20261008
This commit is contained in:
@@ -0,0 +1,195 @@
|
||||
<template>
|
||||
<view class="wrap">
|
||||
<!-- 吸顶 -->
|
||||
<u-sticky offset-top="0" customNavHeight="0">
|
||||
<!-- 顶部 -->
|
||||
<uititle title="报价单"></uititle>
|
||||
</u-sticky>
|
||||
<view class="layout layout-goods">
|
||||
<view class="goods-title">商品1：螺纹钢</view>
|
||||
<view class="goods-box m-top-20 clear">
|
||||
<!-- 百分比，hundred-100%,half-50%,third-33.33%,fourth-25%,fifth-20% -->
|
||||
<view class="goods-item half flex flex-wrap fl">
|
||||
<view class="lb">直径D mm：</view>
|
||||
<view class="vl flex-1">12mm</view>
|
||||
</view>
|
||||
<view class="goods-item half flex flex-wrap fl">
|
||||
<view class="lb">执行标准：</view>
|
||||
<view class="vl flex-1">GB/T1499.2</view>
|
||||
</view>
|
||||
<view class="goods-item half flex flex-wrap fl">
|
||||
<view class="lb">单件长度：</view>
|
||||
<view class="vl flex-1">6000定尺 mm</view>
|
||||
</view>
|
||||
<view class="goods-item half flex flex-wrap fl">
|
||||
<view class="lb">材质：</view>
|
||||
<view class="vl flex-1">HRB355</view>
|
||||
</view>
|
||||
<view class="goods-item half flex flex-wrap fl">
|
||||
<view class="lb">计价形式：</view>
|
||||
<view class="vl flex-1">过磅</view>
|
||||
</view>
|
||||
<view class="goods-item half flex flex-wrap fl">
|
||||
<view class="lb">采购数量：</view>
|
||||
<view class="vl flex-1">100吨</view>
|
||||
</view>
|
||||
<view class="goods-item half flex flex-wrap fl">
|
||||
<view class="lb">交货时限： </view>
|
||||
<view class="vl flex-1">2024-05-11</view>
|
||||
</view>
|
||||
<view class="goods-item hundred flex flex-wrap fl">
|
||||
<view class="lb">交货服务：</view>
|
||||
<view class="vl flex-1">供货方送至交货地点</view>
|
||||
</view>
|
||||
<view class="goods-item hundred flex flex-wrap fl">
|
||||
<view class="lb">交货地点：</view>
|
||||
<view class="vl flex-1">广西壮族自治区-贵港市-覃塘区-大圩</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex justify-between align-center m-top-20">
|
||||
<view class="group flex align-center" style="width: 48%;">
|
||||
<view class="lb m-right-20">报价单价:</view>
|
||||
<view class="vl flex-1">
|
||||
<u--input
|
||||
placeholder="请输入内容"
|
||||
border="surround"
|
||||
v-model="value"
|
||||
suffixIcon="元"
|
||||
suffixIconStyle="font-size: 26rpx;color: #909399"
|
||||
@change="change"
|
||||
></u--input>
|
||||
</view>
|
||||
</view>
|
||||
<view class="group flex align-center" style="width: 48%;">
|
||||
<view class="lb m-right-20">小计金额:</view>
|
||||
<view class="vl flex-1">
|
||||
<u--input
|
||||
placeholder="请输入内容"
|
||||
border="surround"
|
||||
v-model="value"
|
||||
suffixIcon="元"
|
||||
suffixIconStyle="font-size: 26rpx;color: #909399"
|
||||
@change="change"
|
||||
></u--input>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="layout layout-publish bg-white">
|
||||
<view class="group flex align-center">
|
||||
<view class="lb need strong m-right-20">货款总价:</view>
|
||||
<view class="vl flex-1">
|
||||
<u--input
|
||||
placeholder="请输入内容"
|
||||
border="surround"
|
||||
v-model="value"
|
||||
suffixIcon="元"
|
||||
suffixIconStyle="font-size: 26rpx;color: #909399"
|
||||
@change="change"
|
||||
></u--input>
|
||||
</view>
|
||||
</view>
|
||||
<view class="group flex align-center m-top-30">
|
||||
<view class="lb need strong m-right-20">人民币大写:</view>
|
||||
<view class="vl flex-1">
|
||||
<u--input
|
||||
placeholder="请输入内容"
|
||||
border="surround"
|
||||
v-model="value"
|
||||
suffixIcon="元"
|
||||
suffixIconStyle="font-size: 26rpx;color: #909399"
|
||||
@change="change"
|
||||
></u--input>
|
||||
</view>
|
||||
</view>
|
||||
<u--text text="温馨提示：贷款总价由各个商品报价加起来" size="24rpx" color="#777" margin="30rpx 0"></u--text>
|
||||
</view>
|
||||
<u-button class="public-btn m-top-30" text="提交报价"></u-button>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import uititle from '@/components/common/title'
|
||||
export default {
|
||||
components: {
|
||||
uititle,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 输入框自定义样式
|
||||
inputStyle: {
|
||||
borderRadius: 0,
|
||||
},
|
||||
value: '', // 模拟值
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
handTag(val) {
|
||||
val.checked = !val.checked
|
||||
},
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #ffffff;
|
||||
}
|
||||
.goods-title {
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
line-height: 40rpx;
|
||||
color: #101010;
|
||||
}
|
||||
.layout-goods {
|
||||
margin: 20rpx 30rpx;
|
||||
padding: 30rpx 0;
|
||||
font-size: 28rpx;
|
||||
line-height: 32rpx;
|
||||
color: #626262;
|
||||
border-bottom: 1px solid #f2f2f2;
|
||||
.goods-item {
|
||||
padding: 18rpx 0;
|
||||
}
|
||||
}
|
||||
.public-btn {
|
||||
width: 80%;
|
||||
margin-top: 60rpx;
|
||||
color: #ffffff;
|
||||
background: #A92924;
|
||||
}
|
||||
.layout-publish {
|
||||
margin: 20rpx 30rpx;
|
||||
padding: 50rpx 30rpx;
|
||||
border-radius: 18rpx;
|
||||
}
|
||||
.group .lb {
|
||||
position: relative;
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
color: #A92924;
|
||||
}
|
||||
.group .strong {
|
||||
width: 160rpx;
|
||||
font-weight: 600;
|
||||
color: #101010;
|
||||
}
|
||||
.lbx {
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
.need::before {
|
||||
position: absolute;
|
||||
left: -16rpx;
|
||||
top: 50%;
|
||||
z-index: 9;
|
||||
margin-top: -12rpx;
|
||||
content: '*';
|
||||
color: #A92924;
|
||||
font-size: 32rpx;
|
||||
line-height: 1;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user