qniao
/
paper-shopkeeper-app
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Merge branch 'devlop' of http://git.qniao.cn/dengxiongfei/paper-shopkeeper-app into devlop

devlop
邓雄飞 4 years ago
parent
b70f31ff5f 223c7def15
commit
c53b4a67de
27 changed files with 2421 additions and 383 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 433
      components/bussiness-components/packingStationItem.vue
  2. 38
      pages.json
  3. 206
      pages/client-detail/base-paper-deals.vue
  4. 38
      pages/client-detail/basic-information.vue
  5. 249
      pages/client-detail/equipment-information.vue
  6. 10
      pages/client-detail/index.vue
  7. 291
      pages/client-detail/lv-select.vue
  8. 49
      pages/client-detail/no-data.vue
  9. 4
      pages/client-detail/waste-paper-trading.vue
  10. 264
      pages/mall/index.vue
  11. 48
      pages/my-offer/index.vue
  12. 667
      pages/submit-quotation/index.vue
  13. 21
      pages/trade/index.vue
  14. 66
      pages/trade/orderList.vue
  15. 77
      pages/trade/quotationList.vue
  16. BIN
      static/imgs/client-detail/arrow-right-icon.png
  17. BIN
      static/imgs/client-detail/no-data-icon.png
  18. BIN
      static/imgs/client-detail/yzjy-icon.png
  19. BIN
      static/imgs/mall/cut-icon.png
  20. BIN
      static/imgs/mall/grounding-icon.png
  21. BIN
      static/imgs/mall/sold-out-icon.png
  22. BIN
      static/imgs/mall/zsc-bg-icon.png
  23. BIN
      static/imgs/trade/myPrice.png
  24. 25
      uni_modules/uni-number-box/changelog.md
  25. 220
      uni_modules/uni-number-box/components/uni-number-box/uni-number-box.vue
  26. 85
      uni_modules/uni-number-box/package.json
  27. 13
      uni_modules/uni-number-box/readme.md

433
components/bussiness-components/packingStationItem.vue
View File

@ -1,228 +1,229 @@
<template> <template>
<view class="packing-area">
<view class="info">
<image class="image" :src="info.enterpriseLogo || 'https://qncloud.oss-cn-shenzhen.aliyuncs.com/ztb_pic/testPic.jfif'"></image>
<view class="content">
<view class="title">
<text class="text">{{ info.enterpriseName }}</text>
<image
class="icon"
:src="info.whetherCooperation ? '/static/imgs/general/cooperation-icon.png' : '/static/imgs/general/no-cooperation-icon.png'"
></image>
</view>
<view class="desc">
<text>{{ transformBusiness(info.business) }}</text>
</view>
<view v-show="info.whetherCooperation === 1" class="box-area">
<view class="box">
<view><text class="title">月采购量</text></view>
<view style="margin-top: 16rpx">
<text class="value">{{ info.monthlyPurchaseQuantity ? `${info.monthlyPurchaseQuantity}吨` : '0' }}</text>
</view>
</view>
<view class="box">
<view><text class="title">月采购额</text></view>
<view style="margin-top: 16rpx">
<text class="value">{{ info.monthlyTradingQuota ? `${info.monthlyTradingQuota}万` : '0' }}</text>
</view>
</view>
<view class="box">
<view><text class="title">最近购买</text></view>
<view style="margin-top: 16rpx">
<text class="value">{{ transformDate(info.lastTradingDate) || '-' }}</text>
</view>
</view>
</view>
<view v-show="info.whetherCooperation === 0" class="box-area">
<view class="box">
<view><text class="title">法定代表人</text></view>
<view style="margin-top: 16rpx">
<text class="value">{{ info.legalPerson ? `${info.legalPerson}` : '' }}</text>
</view>
</view>
<view class="box">
<view><text class="title">注册资本</text></view>
<view style="margin-top: 16rpx">
<text class="value">{{ info.registeredCapital ? `${info.registeredCapital}万` : '0' }}</text>
</view>
</view>
<view class="box">
<view><text class="title">成立时间</text></view>
<view style="margin-top: 16rpx">
<text class="value">{{ transformDate(info.openingDate) || '-' }}</text>
</view>
</view>
</view>
</view>
</view>
<view class="other">
<view class="box">
<image class="icon" src="/static/imgs/client-list/navigation-icon.png"></image>
<text class="text">{{ info.detailedAddress || '未知' }}</text>
</view>
<view class="divide"></view>
<view class="box">
<image class="icon" src="/static/imgs/client-list/phone-icon.png"></image>
<text class="text">{{ info.legalPerson + ' ' + transformPhoneNum(info.contactNumber) }}</text>
</view>
</view>
</view>
<view class="packing-area">
<view class="info" @tap="goDetail">
<image class="image" :src="info.enterpriseLogo || 'https://qncloud.oss-cn-shenzhen.aliyuncs.com/ztb_pic/testPic.jfif'"></image>
<view class="content">
<view class="title">
<text class="text">{{ info.enterpriseName }}</text>
<image class="icon" :src="info.whetherCooperation ? '/static/imgs/general/cooperation-icon.png' : '/static/imgs/general/no-cooperation-icon.png'"></image>
</view>
<view class="desc">
<text>{{ transformBusiness(info.business) }}</text>
</view>
<view v-show="info.whetherCooperation === 1" class="box-area">
<view class="box">
<view><text class="title">月采购量</text></view>
<view style="margin-top: 16rpx">
<text class="value">{{ info.monthlyPurchaseQuantity ? `${info.monthlyPurchaseQuantity}吨` : '0' }}</text>
</view>
</view>
<view class="box">
<view><text class="title">月采购额</text></view>
<view style="margin-top: 16rpx">
<text class="value">{{ info.monthlyTradingQuota ? `${info.monthlyTradingQuota}万` : '0' }}</text>
</view>
</view>
<view class="box">
<view><text class="title">最近购买</text></view>
<view style="margin-top: 16rpx">
<text class="value">{{ transformDate(info.lastTradingDate) || '-' }}</text>
</view>
</view>
</view>
<view v-show="info.whetherCooperation === 0" class="box-area">
<view class="box">
<view><text class="title">法定代表人</text></view>
<view style="margin-top: 16rpx">
<text class="value">{{ info.legalPerson ? `${info.legalPerson}` : '' }}</text>
</view>
</view>
<view class="box">
<view><text class="title">注册资本</text></view>
<view style="margin-top: 16rpx">
<text class="value">{{ info.registeredCapital ? `${info.registeredCapital}万` : '0' }}</text>
</view>
</view>
<view class="box">
<view><text class="title">成立时间</text></view>
<view style="margin-top: 16rpx">
<text class="value">{{ transformDate(info.openingDate) || '-' }}</text>
</view>
</view>
</view>
</view>
</view>
<view class="other">
<view class="box">
<image class="icon" src="/static/imgs/client-list/navigation-icon.png"></image>
<text class="text">{{ info.detailedAddress || '未知' }}</text>
</view>
<view class="divide"></view>
<view class="box">
<image class="icon" src="/static/imgs/client-list/phone-icon.png"></image>
<text class="text">{{ info.legalPerson + ' ' + transformPhoneNum(info.contactNumber) }}</text>
</view>
</view>
</view>
</template> </template>
<script> <script>
import { go2 } from '@/utils/hook.js'
export default { export default {
props: {
info: {
type: Object,
default: () => ({
enterpriseName: '广州市金骏彩色印务有限公司',
enterpriseLogo: '',
business: '生产画册、书刊、包装盒、手提袋子、快递箱',
whetherCooperation: 1,
monthlyPurchaseQuantity: 100,
monthlyTradingQuota: 200,
lastTradingDate: '2020-12-12',
openingDate: '2020-12-12',
legalPerson: '张三',
registeredCapital: 1000,
contactNumber: '13888888888',
detailedAddress: '广州市天河区天河路'
})
}
},
methods: {
transformBusiness(business) {
let text = business?.trim() || '未知'
if (text.length > 17) {
text = text.substr(0, 17) + '...'
}
return '主营：' + text
},
transformDate(date) {
if (date) {
return date.split('-').join('/')
}
return ''
},
transformPhoneNum(phoneNum) {
if (phoneNum) {
if (this.hasLogin) {
return phoneNum
} else {
return phoneNum.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2')
}
}
return '--'
}
},
computed: {
hasLogin() {
return this.$store.state.qnToken != ''
}
}
props: {
info: {
type: Object,
default: () => ({
enterpriseName: '广州市金骏彩色印务有限公司',
enterpriseLogo: '',
business: '生产画册、书刊、包装盒、手提袋子、快递箱',
whetherCooperation: 1,
monthlyPurchaseQuantity: 100,
monthlyTradingQuota: 200,
lastTradingDate: '2020-12-12',
openingDate: '2020-12-12',
legalPerson: '张三',
registeredCapital: 1000,
contactNumber: '13888888888',
detailedAddress: '广州市天河区天河路'
})
}
},
methods: {
goDetail() {
go2('client-detail', { id: this.info.enterpriseId })
},
transformBusiness(business) {
let text = business?.trim() || '未知'
if (text.length > 17) {
text = text.substr(0, 17) + '...'
}
return '主营：' + text
},
transformDate(date) {
if (date) {
return date.split('-').join('/')
}
return ''
},
transformPhoneNum(phoneNum) {
if (phoneNum) {
if (this.hasLogin) {
return phoneNum
} else {
return phoneNum.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2')
}
}
return '--'
}
},
computed: {
hasLogin() {
return this.$store.state.qnToken != ''
}
}
} }
</script> </script>
<style lang="scss"> <style lang="scss">
.packing-area { .packing-area {
width: 750rpx;
background-color: #fff;
.info {
width: 750rpx;
padding: 30rpx 32rpx 48rpx;
border-bottom: 2rpx solid #dddddd;
display: flex;
flex-direction: row;
align-items: flex-start;
.image {
width: 140rpx;
height: 140rpx;
flex-grow: 0;
flex-shrink: 0;
margin-right: 20rpx;
}
.content {
flex-grow: 1;
.title {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
.text {
font-size: 32rpx;
color: #000000;
font-weight: 600;
}
.icon {
width: 100rpx;
height: 32rpx;
flex-grow: 0;
flex-shrink: 0;
margin-left: 8rpx;
}
}
.desc {
margin-top: 14rpx;
font-size: 26rpx;
color: #333333;
}
.box-area {
margin-top: 30rpx;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
.box {
width: 170rpx;
.title {
display: flex;
flex-direction: row;
justify-content: center;
font-size: 24rpx;
color: #888888;
}
.value {
display: flex;
flex-direction: row;
justify-content: center;
font-size: 28rpx;
color: #333333;
font-weight: 500;
}
}
}
}
}
.other {
width: 750rpx;
padding: 24rpx 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
.divide {
width: 2rpx;
height: 32rpx;
background: #d8d8d8;
}
.box {
width: 340rpx;
margin: 0 32rpx;
display: flex;
flex-direction: row;
align-items: center;
.icon {
width: 52rpx;
height: 52rpx;
flex-grow: 0;
flex-shrink: 0;
margin-right: 10rpx;
}
.text {
font-size: 24rpx;
color: #555555;
}
}
}
width: 750rpx;
background-color: #fff;
.info {
width: 750rpx;
padding: 30rpx 32rpx 48rpx;
border-bottom: 2rpx solid #dddddd;
display: flex;
flex-direction: row;
align-items: flex-start;
.image {
width: 140rpx;
height: 140rpx;
flex-grow: 0;
flex-shrink: 0;
margin-right: 20rpx;
}
.content {
flex-grow: 1;
.title {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-start;
.text {
font-size: 32rpx;
color: #000000;
font-weight: 600;
}
.icon {
width: 100rpx;
height: 32rpx;
flex-grow: 0;
flex-shrink: 0;
margin-left: 8rpx;
}
}
.desc {
margin-top: 14rpx;
font-size: 26rpx;
color: #333333;
}
.box-area {
margin-top: 30rpx;
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
.box {
width: 170rpx;
.title {
display: flex;
flex-direction: row;
justify-content: center;
font-size: 24rpx;
color: #888888;
}
.value {
display: flex;
flex-direction: row;
justify-content: center;
font-size: 28rpx;
color: #333333;
font-weight: 500;
}
}
}
}
}
.other {
width: 750rpx;
padding: 24rpx 0;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
.divide {
width: 2rpx;
height: 32rpx;
background: #d8d8d8;
}
.box {
width: 340rpx;
margin: 0 32rpx;
display: flex;
flex-direction: row;
align-items: center;
.icon {
width: 52rpx;
height: 52rpx;
flex-grow: 0;
flex-shrink: 0;
margin-right: 10rpx;
}
.text {
font-size: 24rpx;
color: #555555;
}
}
}
} }
</style> </style>

38
pages.json
View File

@ -38,15 +38,14 @@
{ {
"path": "pages/mall/index", "path": "pages/mall/index",
"style": { "style": {
"navigationBarTitleText": "商城"
"navigationBarTitleText": "商城",
"navigationStyle": "custom"
} }
}, },
{ {
"path": "pages/mine/index", "path": "pages/mine/index",
"style": { "style": {
"navigationBarTitleText": "我的",
"enablePullDownRefresh": false,
"navigationStyle": "custom"
"navigationBarTitleText": "我的"
} }
}, },
{ {
@ -57,14 +56,6 @@
"navigationStyle": "custom" "navigationStyle": "custom"
} }
}, },
{
"path": "pages/enterprise-info/index",
"style": {
"navigationBarTitleText": "完善企业信息",
"enablePullDownRefresh": false,
"navigationStyle": "custom"
}
},
{ {
"path": "pages/agreement/index", "path": "pages/agreement/index",
"style": { "style": {
@ -111,30 +102,17 @@
} }
}, },
{ {
"path": "components/not-logged/not-logged",
"style": {
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
},
{
"path": "pages/trade/quotationList",
"path": "pages/my-offer/index",
"style": { "style": {
"navigationBarTitleText": "",
"enablePullDownRefresh": false
}
},
{
"path": "pages/trade/orderList",
"style": {
"navigationBarTitleText": "",
"navigationBarTitleText": "我的报价",
"enablePullDownRefresh": false "enablePullDownRefresh": false
} }
}, },
{ {
"path": "pages/trade/my-offer",
"path": "pages/submit-quotation/index",
"style": { "style": {
"navigationBarTitleText": "我的报价",
"navigationBarTitleText": "提交报价",
"navigationStyle": "custom",
"enablePullDownRefresh": false "enablePullDownRefresh": false
} }
} }

206
pages/client-detail/base-paper-deals.vue
View File

@ -1,22 +1,204 @@
<template> <template>
<view>
原纸交易
<view class="warpper">
<scroll-list ref="list" :option="option" @load="upCallback" @refresh="downCallback" style="background-color: #FFFFFF;">
<view class="sum-box">
<view class="">
<view class="title">
交易金额
</view>
<view class="value">
458 682.00
</view>
</view>
<view class="">
<view class="title">
总交易量(吨)
</view>
<view class="value">
125.7752
</view>
</view>
</view>
<uGap></uGap>
<view class="card-box">
<view class="header">
<view class="left-title">
XJ 202112235389
</view>
<view class="right-title">
¥ 22045.78
</view>
</view>
<view class="content">
<image class="image" src="https://qncloud.oss-cn-shenzhen.aliyuncs.com/ztb_pic/testPic.jfif" mode=""></image>
<view class="">
<view class="title">
金蝶蓝白卡
</view>
<view class="desc">
白卡纸/金蝶蓝/350g/787*1092/2200张
</view>
</view>
</view>
<view class="content">
<image class="image" src="https://qncloud.oss-cn-shenzhen.aliyuncs.com/ztb_pic/testPic.jfif" mode=""></image>
<view class="">
<view class="title">
丽盈白卡
</view>
<view class="desc">
白卡纸/丽盈/350g/787*1092/2200张
</view>
</view>
</view>
<view class="other">
<view class="time">
2021-12-23 12:30:45
</view>
<view class="btn">
更多详情
<image class="icon" src="/static/imgs/client-detail/arrow-right-icon.png"></image>
</view>
</view>
<uGap></uGap>
</view>
</scroll-list>
</view> </view>
</template> </template>
<script> <script>
export default {
data() {
return {
}
},
methods: {
import uGap from '@/components/u-gap/u-gap.vue'
export default {
components: { uGap },
data() {
return {
option: {
size: 10,
auto: true,
emptyText: '暂无数据~',
background: '#F7F8FA',
disabled: false
}
} }
},
methods: {
downCallback() {},
upCallback() {}
} }
}
</script> </script>
<style>
<style lang="scss">
.warpper {
width: 750rpx;
.sum-box {
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: center;
// text-align: center;
height: 184rpx;
background: url('/static/imgs/client-detail/yzjy-icon.png') no-repeat;
background-size: 100%;
.title {
font-size: 26rpx;
color: #FFFFFF;
letter-spacing: 0;
font-weight: 500;
}
.value {
font-size: 56rpx;
color: #FFFFFF;
letter-spacing: 0;
text-align: left;
font-weight: 500;
margin-top: 16rpx;
}
}
.card-box {
.header {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
height: 88rpx;
background: #FFFFFF;
border-bottom: 2rpx solid #DDDDDD;
padding: 0rpx 32rpx;
.left-title {
font-size: 30rpx;
color: #000000;
letter-spacing: 0;
font-weight: 600;
}
.right-title {
font-size: 30rpx;
color: #FF5368;
letter-spacing: 0;
text-align: right;
font-weight: 500;
}
}
.content {
display: flex;
flex-direction: row;
align-items: center;
height: 148rpx;
background: #FFFFFF;
border-bottom: 2rpx solid #DDDDDD;
padding: 0rpx 32rpx;
.image {
width: 100rpx;
height: 100rpx;
flex: 0 0 100rpx;
margin-right: 20rpx;
}
.title {
font-size: 30rpx;
color: #333333;
letter-spacing: 0;
text-align: left;
font-weight: 400;
}
.desc {
padding-top: 26rpx;
font-size: 26rpx;
color: #888888;
letter-spacing: 0;
text-align: left;
font-weight: 400;
}
}
.other {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
height: 80rpx;
background: #FFFFFF;
padding: 0rpx 32rpx;
.time {
font-size: 26rpx;
color: #888888;
letter-spacing: 0;
text-align: left;
font-weight: 400;
}
.btn {
font-size: 28rpx;
color: #007AFF;
letter-spacing: 0;
text-align: center;
font-weight: 500;
display: flex;
align-items: center;
}
.icon {
width: 24rpx;
height: 24rpx;
margin-left: 6rpx;
}
}
}
}
</style> </style>

38
pages/client-detail/basic-information.vue
View File

@ -79,21 +79,21 @@
<view class="cf-info"> <view class="cf-info">
<view class="row"> <view class="row">
<view class="left"> <view class="left">
<view class="info-title"><text>产房面积：</text></view>
<view class="info-value"><text>{{info.plantArea}}m²</text></view>
<view class="title"><text>产房面积：</text></view>
<view class="value"><text>{{info.plantArea}}m²</text></view>
</view> </view>
<view class="right"> <view class="right">
<view class="info-title"><text>年营业额：</text></view>
<view class="info-value"><text>{{info.annualTurnover}}万</text></view>
<view class="title"><text>年营业额：</text></view>
<view class="value"><text>{{info.annualTurnover}}万</text></view>
</view> </view>
</view> </view>
<view class="row"> <view class="row">
<view class="left"> <view class="left">
<view class="info-title"><text>产房照片：</text></view>
<view class="title"><text>产房照片：</text></view>
<view class="look-over" @tap="previewImg(info.factoryImgList[0], info.factoryImgList)"><text>点击查看</text></view> <view class="look-over" @tap="previewImg(info.factoryImgList[0], info.factoryImgList)"><text>点击查看</text></view>
</view> </view>
<view class="right"> <view class="right">
<view class="info-title"><text>租赁合同：</text></view>
<view class="title"><text>租赁合同：</text></view>
<view class="look-over" @tap="previewImg(info.leaseContract, [info.leaseContract])"><text>点击查看</text></view> <view class="look-over" @tap="previewImg(info.leaseContract, [info.leaseContract])"><text>点击查看</text></view>
</view> </view>
</view> </view>
@ -264,10 +264,10 @@ export default {
this.seemoreFlag = !this.seemoreFlag this.seemoreFlag = !this.seemoreFlag
}, },
transformDate(date) { transformDate(date) {
if (date) {
return `${date[0]}/${date[1]}/${date[2]}`
}
return ''
if (date) {
return date.split('-').join('/')
}
return ''
}, },
previewImg(index, list) { previewImg(index, list) {
uni.previewImage({ uni.previewImage({
@ -451,15 +451,29 @@ export default {
align-items: center; align-items: center;
margin-bottom: 16rpx; margin-bottom: 16rpx;
} }
.title {
flex: 0 0 150rpx;
font-size: 28rpx;
color: #888888;
letter-spacing: 0;
font-weight: 400;
margin-right: 8rpx;
}
.value {
font-size: 28rpx;
color: #333333;
letter-spacing: 0;
font-weight: 400;
}
.left { .left {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-between;
width: 60%;
} }
.right { .right {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: space-between;
width: 40%;
} }
} }

249
pages/client-detail/equipment-information.vue
View File

@ -1,22 +1,247 @@
<template> <template>
<view>
设备信息
<view class="warpper">
<scroll-list ref="list" :option="option" @load="upCallback" @refresh="downCallback" style="background-color: #FFFFFF;">
<view class="card-box">
<view class="header">
<view class="title">全自动立体糊盒机</view>
<view class="desc">近30天</view>
</view>
<view class="content">
<view class="info">
<view class="">
<view class="value">8900件</view>
<view class="title">
<image class="icon" src="/static/imgs/client-detail/address-icon.png"></image>
设备产能
</view>
</view>
<view class="">
<view class="value">89 h</view>
<view class="title">
<image class="icon" src="/static/imgs/client-detail/address-icon.png"></image>
工作时长
</view>
</view>
<view class="">
<view class="value">86%</view>
<view class="title">
<image class="icon" src="/static/imgs/client-detail/address-icon.png"></image>
开机率
</view>
</view>
</view>
<view class="shrink-box" v-if="!seemoreFlag">
<view class="row">
<view class="left">
<view class="title">设备图片：</view>
<view class="look-over">点击查看</view>
</view>
<view class="right">
<view class="title">购买年份：</view>
<view class="value">2019年</view>
</view>
</view>
<view class="row">
<view class="left">
<view class="title">购买金额：</view>
<view class="value">2000万</view>
</view>
<view class="right">
<view class="title">设备产能：</view>
<view class="value">2000个/天</view>
</view>
</view>
<view class="row">
<view class="left">
<view class="title">成色：</view>
<view class="value">9成新</view>
</view>
<view class="right">
<view class="title">设备类型：</view>
<view class="value">糊盒机</view>
</view>
</view>
<view class="row">
<view class="left">
<view class="title">最大输纸 长度：</view>
<view class="value">2000mm</view>
</view>
<view class="right">
<view class="title">最大输纸 宽度：</view>
<view class="value">2000mm</view>
</view>
</view>
<view class="row">
<view class="left">
<view class="title">最大输纸 厚度：</view>
<view class="value">2000mm</view>
</view>
<view class="right">
<view class="title">咬口：</view>
<view class="value">2000mm</view>
</view>
</view>
</view>
</view>
<view class="see-more">
<view class="" @tap="seemoreTap">
<text>设备详情</text>
<image class="icon" :src="!seemoreFlag ? '/static/imgs/client-detail/arrow-up-icon.png' : '/static/imgs/client-detail/arrow-down-icon.png'"></image>
</view>
</view>
<uGap></uGap>
</view>
</scroll-list>
</view> </view>
</template> </template>
<script> <script>
export default {
data() {
return {
}
},
methods: {
import lvSelect from './lv-select.vue'
import uGap from '@/components/u-gap/u-gap.vue'
export default {
components: { lvSelect, uGap },
data() {
return {
option: {
size: 10,
auto: true,
emptyText: '暂无数据~',
background: '#F7F8FA',
disabled: false
},
seemoreFlag: true
} }
},
methods: {
seemoreTap() {
this.seemoreFlag = !this.seemoreFlag
},
downCallback() {},
upCallback() {}
} }
}
</script> </script>
<style>
<style lang="scss">
.warpper {
.card-box {
.header {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
height: 88rpx;
background: #ffffff;
padding: 0rpx 36rpx 0rpx 32rpx;
.title {
font-size: 30rpx;
color: #000000;
letter-spacing: 0;
font-weight: 600;
}
.desc {
font-size: 28rpx;
color: #888888;
letter-spacing: 0;
text-align: right;
font-weight: 400;
}
}
.content {
border-bottom: 2rpx solid #dddddd;
border-top: 2rpx solid #dddddd;
.info {
display: flex;
flex-direction: row;
justify-content: space-around;
align-items: center;
text-align: center;
height: 148rpx;
background: #ffffff;
.value {
font-size: 28rpx;
color: #333333;
letter-spacing: 0;
text-align: center;
font-weight: 500;
}
.title {
margin-top: 16rpx;
font-size: 24rpx;
color: #888888;
letter-spacing: 0;
text-align: center;
font-weight: 400;
display: flex;
flex-direction: row;
align-items: center;
}
.icon {
width: 32rpx;
height: 32rpx;
padding-right: 6rpx;
}
}
.shrink-box {
background: #f7f8fa;
padding: 8rpx 36rpx 16rpx 32rpx;
.row {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin-top: 16rpx;
.left {
display: flex;
flex-direction: row;
width: 60%;
}
.right {
display: flex;
flex-direction: row;
width: 40%;
}
.title {
flex: 0 0 140rpx;
font-size: 28rpx;
color: #888888;
letter-spacing: 0;
font-weight: 400;
}
.value {
font-size: 28rpx;
color: #333333;
letter-spacing: 0;
font-weight: 400;
}
.look-over {
font-size: 28rpx;
color: #007aff;
letter-spacing: 0;
font-weight: 400;
}
}
}
}
.see-more {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
height: 80rpx;
line-height: 80rpx;
background: #ffffff;
padding: 0rpx 32rpx;
font-size: 28rpx;
color: #007aff;
letter-spacing: 0;
text-align: center;
font-weight: 400;
.icon {
width: 24rpx;
height: 24rpx;
}
}
}
}
</style> </style>

10
pages/client-detail/index.vue
View File

@ -7,7 +7,7 @@
<!-- </view> --> <!-- </view> -->
</qnHeader> </qnHeader>
<view> <view>
<uni-segmented-control :current="current" :values="items" @clickItem="onClickItem" styleType="text" activeColor="#007AFF"></uni-segmented-control>
<uni-segmented-control :current="current" :values="items" @clickItem="onClickItem" styleType="text" activeColor="#007AFF" class="segmented"></uni-segmented-control>
<view class="content"> <view class="content">
<view v-show="current === 0"><basicInformation ref="basicInformationRef" :customerId="customerId"></basicInformation></view> <view v-show="current === 0"><basicInformation ref="basicInformationRef" :customerId="customerId"></basicInformation></view>
@ -78,5 +78,13 @@ export default {
line-height: 40rpx; line-height: 40rpx;
font-weight: 500; font-weight: 500;
} }
.segmented {
height: 88rpx;
border-bottom: 2rpx solid #ECECEC;
font-size: 28rpx;
color: #333333;
text-align: center;
font-weight: 400;
}
} }
</style> </style>

291
pages/client-detail/lv-select.vue
View File

@ -0,0 +1,291 @@
<template>
<view style="position: relative;" :class="size === 'small' ? 'small' : ''">
<view class="uni-flex" :class="{unishadow :uniShadow}">
<view class="uni-search-form uni-circular uni-background">
<icon type="search" size="14" class="uni-icon-position"/>
<input
type="text"
:placeholder="placeholder"
v-model="inputVal"
@input="onInput"
@focus="onFocus"
></input>
<icon v-if="isShowClearIcon" type="clear" size="16" class="uni-icon-clear" @tap="clearInputValue"/>
</view>
<view class="uni-action">
<button
:disabled="loading"
class="uni-cu-btn uni-bg-gradual-green uni-shadow-blur uni-round"
:class="[type === 'primary' ? 'uni-primary' : (type === 'success' ? 'uni-success' : (type === 'warning' ? 'uni-warning' : 'uni-error'))]"
hover-class="hover"
@click="handleSearch"
>搜索</button>
</view>
</view>
<view v-if="isShowSelect">
<view class="uni-combox__selector" v-if="inputIsShow">
<scroll-view scroll-y="true" class="uni-combox__selector-scroll">
<view class="uni-combox__selector-empty " v-if="loading">
<view>加载中··· </view>
</view>
<view class="uni-combox__selector-empty " v-if="!loading && dataListLength === 0" @tap="closeDielog">
<view>{{emptyTips}}</view>
</view>
<view class="uni-combox__selector-item" v-for="(item,index) in dataList" :key="index" @tap="onSelectorClick(index)">
<text>{{item[showValue]}}</text>
</view>
</scroll-view>
</view>
</view>
</view>
</template>
<script>
export default {
name: 'select',
props: {
// placeholder: {
// type: String,
// default: '请输入信息'
// },
infoList: {
type: Array,
default () {
return []
}
},
value: {
type: String,
default: ''
},
showValue: {
type: String,
default: 'name'
},
emptyTips: {
type: String,
default: '暂无数据'
},
loading: {
type: Boolean,
default: false
},
btnStyleColor: {
type: Object,
default() {
return {}
}
},
uniShadow: {
type: Boolean,
default: true
},
type: {
type: String,
default: 'primary'
},
size: {
type: String,
default: 'medium'
},
isShowSelect: {
type: Boolean,
default: true
}
},
data() {
return {
inputIsShow: false,
inputVal: '',
dataList: [],
placeholder: '请输入信息',
isShowClearIcon: false
}
},
computed: {
dataListLength() {
return this.dataList.length
}
},
watch: {
value: {
handler(newVal) {
this.inputVal = newVal
},
immediate: true
},
infoList: {
handler(newVal) {
this.dataList = newVal
},
deep: true,
immediate: true
},
inputVal(val) {
if(!val.length) {
this.isShowClearIcon = false
}
}
},
methods: {
closeDielog() {
this.inputIsShow = false
},
onFocus() {
if(this.dataList.length) {
this.inputIsShow = true
this.isShowClearIcon = !!this.inputVal
}
},
onSelectorClick(index) {
this.inputIsShow = false
this.isShowClearIcon = false
this.inputVal = this.dataList[index][this.showValue]
this.$emit('input', this.inputVal)
this.$emit('change', this.dataList[index])
},
onInput() {
this.$emit('input', this.inputVal)
},
handleSearch() {
this.inputIsShow = true
this.$emit('handleSearch')
},
clearInputValue() {
this.inputVal = ''
}
}
}
</script>
<style scoped lang="scss">
// $selectWidth: 75%; // 下拉选择框宽度
.small {
transform: scale(.9, .9);
}
.uni-primary {
background-color: $uni-color-primary;
}
.uni-success {
background-color: #67c23a;
}
.uni-warning {
background-color: $uni-color-warning;
}
.uni-error {
background-color: $uni-color-error;
}
.hover{
transition: all .6s;
transform: scale(0.8,0.8);
}
.uni-flex{
width: 100%;
display: flex;
justify-content: center;
align-items: center;
padding: 10rpx 20rpx;
box-sizing: border-box;
}
.unishadow{
box-shadow: 0rpx 1rpx 5rpx #DDDDDD;
}
.uni-search-form{
position: relative;
width: 60%;
margin: 10rpx;
padding: 10rpx 80rpx;
font-size: 30rpx;
color: #999999;
}
.uniRound{
border-radius: 5px;
}
.uni-circular{
border-radius: 100rpx;
}
.uni-icon-position{
position: absolute;
top: 50%;
left: 26rpx;
transform: translate(0,-50%);
}
.uni-icon-clear{
position: absolute;
top: 50%;
right: 26rpx;
transform: translate(0,-50%);
}
.uni-background{
background-color: #F5F5F5;
}
/* button */
.uni-action{
width:120rpx;
height: 66rpx;
}
.uni-cu-btn{
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
color: #FFFFFF;
font-size: 28rpx;
border: none;
// background-color: $uni-color-primary;
}
.uni-shadow-blur{
box-shadow: 0rpx 1rpx 10rpx #C8C7CC;
}
.uni-round{
border-radius: 100rpx;
}
.uni-combox__selector {
position: absolute;
top: 100rpx;
left: 40rpx;
box-sizing: border-box;
width: 75%; // 下拉框宽度
background-color: #FFFFFF;
border-radius: 6px;
box-shadow: #DDDDDD 4px 4px 8px, #DDDDDD -4px -4px 8px;
z-index: 999;
}
.uni-combox__selector-scroll {
max-height: 200px;
box-sizing: border-box;
}
.uni-combox__selector::before {
content: '';
position: absolute;
width: 0;
height: 0;
border-bottom: solid 6px #FFFFFF;
border-right: solid 6px transparent;
border-left: solid 6px transparent;
left: 50%;
top: -6px;
margin-left: -6px;
}
.uni-combox__selector-empty{
text-align: center;
color: #8F8F94;
padding: 20rpx 0;
font-size: 28rpx;
}
.uni-combox__selector-item {
/* #ifdef APP-NVUE */
display: flex;
/* #endif */
font-size: 24rpx;
margin: 0px 10px;
padding: 20rpx 10rpx;
color: #808080;
}
.uni-combox__selector-item:hover {
background-color: #DDDDDD;
}
.uni-combox__selector-empty:last-child,
.uni-combox__selector-item:last-child {
border-bottom: none;
}
</style>

49
pages/client-detail/no-data.vue
View File

@ -0,0 +1,49 @@
<template>
<view class="warpper">
<image class="icon" src="/static/imgs/client-detail/no-data-icon.png"></image>
<view class="text">
{{ title }}
</view>
</view>
</template>
<script>
export default {
props: {
title:{
type: String,
default: null
}
},
data() {
return {
}
},
methods: {
}
}
</script>
<style lang="scss">
.warpper {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-align: center;
margin-top: 25%;
.icon {
width: 560rpx;
height: 320rpx;
}
.text {
font-size: 30rpx;
color: #333333;
letter-spacing: 0;
text-align: center;
font-weight: 400;
}
}
</style>

4
pages/client-detail/waste-paper-trading.vue
View File

@ -1,11 +1,13 @@
<template> <template>
<view> <view>
废纸交易
<noData title="暂无废纸交易数据"></noData>
</view> </view>
</template> </template>
<script> <script>
import noData from './no-data'
export default { export default {
components:{noData},
data() { data() {
return { return {

264
pages/mall/index.vue
View File

@ -1,40 +1,254 @@
<template> <template>
<view class="content">
mall
<view class="warpper">
<uni-nav-bar>
<view slot="left" class="left-title">纸商城</view>
<view slot="right" class="right-title">分享</view>
</uni-nav-bar>
<scroll-list ref="list" :option="option" @load="upCallback" @refresh="downCallback" style="background-color: #FFFFFF;">
<view class="top-box">
<view class="">
<image class="image" src="https://qncloud.oss-cn-shenzhen.aliyuncs.com/ztb_pic/testPic.jfif" mode=""></image>
</view>
<view class="center">
<view class="title">
东莞市隆兴纸业有限公司
</view>
<view class="desc">
全部商品 39 &nbsp; | &nbsp;上新 9
</view>
</view>
<view class="right">
<view class="cut">
切换商城
<image class="cut-icon" src="/static/imgs/mall/cut-icon.png" mode=""></image>
</view>
<view class="set">
设置
</view>
</view>
</view>
<uGap></uGap>
<view v-for="(item,index) in 6" :key="index">
<view class="content">
<image class="image" src="https://qncloud.oss-cn-shenzhen.aliyuncs.com/ztb_pic/testPic.jfif" mode=""></image>
<view class="">
<view class="title">
<view class="">
金蝶蓝白卡
</view>
<view class="">
<image class="icon" :src="1 === 1 ? '/static/imgs/mall/grounding-icon.png' : '/static/imgs/mall/sold-out-icon.png'" mode=""></image>
</view>
</view>
<view class="sub-title">
金桂/白卡纸/金蝶蓝
</view>
<view class="desc">
克重(价格)：200(3900) 235(3900) 255(390
0)255(390
</view>
</view>
</view>
<view class="other">
<view class="time">
5分钟前
</view>
<view class="btn">
<view class="">
编辑
</view>
<view class="divide"></view>
<view class="">
下架
</view>
</view>
</view>
<uGap></uGap>
</view>
</scroll-list>
</view> </view>
</template> </template>
<script> <script>
export default {
import uGap from '@/components/u-gap/u-gap.vue'
export default {
components: { uGap },
data() {
return {
option: {
size: 10,
auto: true,
emptyText: '暂无数据~',
background: '#F7F8FA',
disabled: false
}
}
},
methods: {
downCallback() {},
upCallback() {}
} }
}
</script> </script>
<style>
.content {
<style lang="scss">
.warpper {
width: 750rpx;
.left-title {
font-size: 40rpx;
color: #000000;
letter-spacing: 0;
font-weight: 500;
}
.right-title {
font-size: 28rpx;
color: #007aff;
text-align: right;
font-weight: 500;
}
.top-box {
display: flex; display: flex;
flex-direction: column;
flex-direction: row;
align-items: center; align-items: center;
justify-content: center;
}
.logo {
height: 200rpx;
width: 200rpx;
margin-top: 200rpx;
margin-left: auto;
margin-right: auto;
margin-bottom: 50rpx;
justify-content: space-around;
height: 180rpx;
background: url('/static/imgs/mall/zsc-bg-icon.png') no-repeat;
background-size: 100%;
.image {
width: 100rpx;
height: 100rpx;
border-radius: 50%;
}
.right {
width: 140rpx;
}
.center {
position: relative;
left: -20rpx;
}
.title {
font-size: 34rpx;
color: #FFFFFF;
letter-spacing: 2rpx;
font-weight: 600;
margin-bottom: 12rpx;
}
.desc {
opacity: 0.75;
font-size: 28rpx;
color: #FFFFFF;
letter-spacing: 0;
font-weight: 500;
padding-right: 32rpx;
}
.cut {
display: flex;
align-items: center;
font-size: 24rpx;
color: #FFFFFF;
letter-spacing: 0;
text-align: center;
font-weight: 400;
.cut-icon {
width: 29.42rpx;
height: 26.67rpx;
margin-left: 10rpx;
}
}
.set {
opacity: 0.75;
font-size: 28rpx;
color: #FFFFFF;
letter-spacing: 0;
font-weight: 500;
position: relative;
top: 39rpx;
left: 60rpx;
}
} }
.text-area {
.content {
background: #FFFFFF;
border-bottom: 2rpx solid #DDDDDD;
display: flex; display: flex;
justify-content: center;
flex-direction: row;
padding: 24rpx 0rpx 24rpx 32rpx;
.image {
width: 100rpx;
height: 100rpx;
flex: 0 0 100rpx;
margin-right: 18rpx;
}
.title {
display: flex;
flex-direction: row;
justify-content: space-between;
font-size: 32rpx;
color: #333333;
letter-spacing: 0;
font-weight: 500;
.icon {
position: relative;
top: -22rpx;
width: 150rpx;
height: 50rpx;
}
}
.sub-title {
position: relative;
font-size: 28rpx;
color: #333333;
letter-spacing: 0;
font-weight: 400;
top: -4rpx;
}
.desc {
font-size: 28rpx;
color: #555555;
letter-spacing: 0;
font-weight: 400;
padding-top: 10rpx;
line-height: 1.4;
}
} }
.title {
font-size: 36rpx;
color: #8f8f94;
.other {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
height: 80rpx;
background: #FFFFFF;
padding: 0rpx 32rpx;
.time {
font-size: 28rpx;
color: #888888;
letter-spacing: 0;
font-weight: 400;
}
.btn {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
font-size: 28rpx;
color: #007AFF;
letter-spacing: 0;
text-align: right;
font-weight: 400;
}
.divide {
width: 2rpx;
height: 32rpx;
background: #d8d8d8;
margin: 0 32rpx;
}
.icon {
width: 24rpx;
height: 24rpx;
margin-left: 6rpx;
}
} }
}
</style> </style>

pages/trade/my-offer.vue → pages/my-offer/index.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<view class="my-offer"> <view class="my-offer">
<!-- <uni-segmented-control :current="controlCurrent" :values="controlItems" @clickItem="onClickItem" styleType="text" activeColor="#007AFF"></uni-segmented-control> -->
<uni-nav-bar left-icon="back" @clickLeft="back" statusBar fixed title="我的报价"></uni-nav-bar>
<scroll-list style="touch-action: none" ref="orderRef" :option="orderOption" @load="orderUp" @refresh="orderDown"> <scroll-list style="touch-action: none" ref="orderRef" :option="orderOption" @load="orderUp" @refresh="orderDown">
<view v-for="(items,index) in orderData" :key="index"> <view v-for="(items,index) in orderData" :key="index">
<view class="list-border list-title-line"> <view class="list-border list-title-line">
@ -8,8 +8,11 @@
<text class="list-title-Subtitle">{{ items.orderStatus }}</text> <text class="list-title-Subtitle">{{ items.orderStatus }}</text>
</view> </view>
<view class="list-border list-info-line" v-for="(item, index) in items.orderItemList" :key="index"> <view class="list-border list-info-line" v-for="(item, index) in items.orderItemList" :key="index">
<view class="list-info list-border">
<view class=""><image class="list-image" :src="item.productImg" mode=""></image></view>
<view class="list-info" :class="index===items.orderItemList.length?'list-border':''">
<view class="">
<!-- <image class="list-image" :src="item.productImg" mode=""></image> -->
<image class="list-image" src="../../static/logo.png" mode="">
</view>
<view class="list-info-contant"> <view class="list-info-contant">
<view class="list-info-title">{{ item.brandName }}{{ item.categoryName }}</view> <view class="list-info-title">{{ item.brandName }}{{ item.categoryName }}</view>
<view class="list-info-text"> <view class="list-info-text">
@ -31,6 +34,7 @@
</template> </template>
<script> <script>
import { back, go2 } from '@/utils/hook.js'
import uGap from '@/components/u-gap/u-gap.vue' import uGap from '@/components/u-gap/u-gap.vue'
import scrollList from '@/components/scroll-list/scroll-list.vue' import scrollList from '@/components/scroll-list/scroll-list.vue'
import { getEnterpriseList, gettradingHallList } from '@/apis/trade' import { getEnterpriseList, gettradingHallList } from '@/apis/trade'
@ -52,6 +56,8 @@ export default {
pageSize: 10 pageSize: 10
}, },
orderData: [], orderData: [],
controlCurrent:0,
controlItems: ['全部', '待确认', '待发货', '已完成'],
orderOption: { orderOption: {
size: 10, size: 10,
auto: true, auto: true,
@ -87,6 +93,7 @@ export default {
this.getTradingQurty() this.getTradingQurty()
}, },
methods: { methods: {
back,
// 获取订单列表 // 获取订单列表
getTradingQurty() { getTradingQurty() {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
@ -127,21 +134,26 @@ export default {
.catch(() => { .catch(() => {
this.$refs.orderRef.refreshFail() this.$refs.orderRef.refreshFail()
}) })
}
},
//分段器点击事件
onClickItem(value) {
console.log(value)
}
} }
} }
</script> </script>
<style lang="scss"> <style lang="scss">
.my-offer { .my-offer {
margin-bottom: 0px;
margin-bottom: 0rpx;
.list-border { .list-border {
// border-top: 1px solid #dddddd; // border-top: 1px solid #dddddd;
border-bottom: 1px solid #dddddd;
border-bottom: 2rpx solid #dddddd;
} }
.list-title-line { .list-title-line {
line-height: 44px;
padding-left: 24px;
line-height: 88rpx;
padding-left: 48rpx;
background: #FFFFFF;
} }
.list-title { .list-title {
font-family: PingFangSC-Semibold; font-family: PingFangSC-Semibold;
@ -161,11 +173,12 @@ export default {
margin-right: 32rpx; margin-right: 32rpx;
} }
.list-info-line { .list-info-line {
padding-left: 24px;
line-height: 35px;
padding-left: 48rpx;
line-height: 70rpx;
background: #FFFFFF;
} }
.list-info-contant { .list-info-contant {
margin-left: 24px;
margin-left: 48rpx;
} }
.list-info-title { .list-info-title {
font-family: PingFangSC-Medium; font-family: PingFangSC-Medium;
@ -181,27 +194,30 @@ export default {
color: #888888; color: #888888;
letter-spacing: 0; letter-spacing: 0;
text-align: left; text-align: left;
line-height: 32px;
line-height: 64rpx;
font-weight: 400; font-weight: 400;
} }
.list-image { .list-image {
width: 100rpx; width: 100rpx;
height: 100rpx; height: 100rpx;
margin-top: 10px;
margin-top: 20rpx;
} }
.list-info { .list-info {
display: flex; display: flex;
} }
.list-bottom-contant { .list-bottom-contant {
line-height: 35px;
padding-left: 24px;
line-height: 70rpx;
padding-left: 48rpx;
width: 750rpx;
height: 80rpx;
background: #FFFFFF;
} }
.list-time{ .list-time{
font-family: PingFangSC-Regular; font-family: PingFangSC-Regular;
font-size: 26rpx; font-size: 26rpx;
color: #888888; color: #888888;
letter-spacing: 0; letter-spacing: 0;
line-height: 32px;
line-height: 64rpx;
font-weight: 400; font-weight: 400;
} }
} }

667
pages/submit-quotation/index.vue
View File

@ -0,0 +1,667 @@
<template>
<view class="submit-quotation">
<view>
<uni-nav-bar left-icon="back" @clickLeft="back" statusBar fixed title="">
<view class="submit-title">提交报价</view>
<view slot="left"></view>
<view slot="right"></view>
</uni-nav-bar>
</view>
<view class="submit-main">
<view><text class="submit-main-title">交货要求</text></view>
<view>
<text class="submit-main-subTitle">询价客户：</text>
<text class="submit-main-subContant">东莞市隆兴纸业有限公司</text>
</view>
<view>
<text class="submit-main-subTitle">交货区域：</text>
<text class="submit-main-subContant">广东省/广州市/天河区</text>
</view>
<view>
<text class="submit-main-subTitle">交货时间：</text>
<text class="submit-main-subContant">2021/12/29 12:30</text>
</view>
</view>
<uGap></uGap>
<view class="submit-deadline">
<view class="submit-text">报价截止</view>
<view class="submit-time"><text class="submit-time-text">12</text></view>
<view class="sbumit-colon">:</view>
<view class="submit-time"><text class="submit-time-text">12</text></view>
<view class="sbumit-colon">:</view>
<view class="submit-time"><text class="submit-time-text">12</text></view>
</view>
<uGap></uGap>
<view class="submit-contant">
<view class="submit-contant-head">
<view class="submit-contant-title">丽品白卡｜200g｜787*1092｜5000张</view>
<view class="" @click="commodityModify()"><image class="submit-image" src="../../static/imgs/trade/myPrice.png" mode=""></image></view>
</view>
<view class="submit-contant-body">
<view class="">
<text class="submit-contant-body-title">重量(吨)：</text>
<text class="submit-contant-body-subtitle">1.6544</text>
</view>
<view>
<text class="submit-contant-body-title">单价(元/吨)：</text>
<text class="submit-contant-body-subtitle">
1000
<image @click="priceModify()" class="submit-image-price" src="../../static/imgs/trade/myPrice.png" mode=""></image>
</text>
</view>
<view>
<text class="submit-contant-body-title">小计(元)：</text>
<text class="submit-contant-body-subtitle">1.6544</text>
</view>
<view class="submit-contant-body-input">
<uni-easyinput maxlength="100" class="submit-contant-body-inputClass" v-model="value" placeholder="请输入内容"></uni-easyinput>
</view>
</view>
</view>
<view class="submit-contant-order">
<view class="">
<text class="submit-contant-order-title">其他费用：</text>
<text class="submit-contant-order-subtitle">¥ 80.00</text>
</view>
<view class="">
<text class="submit-contant-order-title">合计：</text>
<text class="submit-contant-order-money">¥ 13800.32</text>
</view>
</view>
<uGap></uGap>
<view class="submit-contant-time">
<view class="">
<text class="submit-contant-time-title">有效时间：</text>
<text class="submit-contant-time-title">24小时</text>
</view>
<view class="" @click="resetTime()"><text class="submit-contant-time-subtitle">设置</text></view>
</view>
<uGap></uGap>
<view class="submit-contant-remark">
<view class="submit-contant-remark-title">报价备注</view>
<view class=""><uni-easyinput maxlength="200" type="textarea" class="submit-contant-remark-input" v-model="value1" placeholder="请输入内容"></uni-easyinput></view>
</view>
<uGap></uGap>
<view class="submit-btnBg"><button class="submit-btn" type="primary">提交报价</button></view>
<view class="">
<uni-popup ref="popup" :mask-click="false">
<view class="submit-popup">
<view class="submit-line">
<view class="submit-popup-close">
<view class="submit-popup-title">纸品名称：</view>
<view class="" @click="close()"><image class="submit-popup-close-image" src="../../static/imgs/client/close-icon.png" mode=""></image></view>
</view>
<view><uni-data-picker class="submit-popup-input" :border="false" :localdata="items" @change="onchange"></uni-data-picker></view>
</view>
<view class="submit-line">
<view class="submit-popup-close"><view class="submit-popup-title">克重(g)</view></view>
<view class=""><uni-easyinput :inputBorder="false" class="submit-popup-input" type="number" v-model="value" placeholder="请输入内容"></uni-easyinput></view>
</view>
<view class="submit-line">
<view class="submit-popup-close"><view class="submit-popup-title">规格(mm)</view></view>
<view class="submit-popup-close">
<view class="">
<uni-easyinput
:inputBorder="false"
class="submit-popup-input submit-popup-specifications"
type="number"
v-model="value"
placeholder="请输入内容"
></uni-easyinput>
</view>
<view class="submit-popup-x">x</view>
<view class="">
<uni-easyinput
:inputBorder="false"
class="submit-popup-input submit-popup-specifications"
type="number"
v-model="value"
placeholder="请输入内容"
></uni-easyinput>
</view>
</view>
</view>
<view class="submit-popup-close submit-number-box">
<view class=""><view class="submit-popup-title">购买数量(张)</view></view>
<view class="submit-number-line">
<uni-number-box v-model="vModelValue"></uni-number-box>
<text class="submit-number-text">预估重量：1.6346吨</text>
</view>
</view>
<view class=""><button class="submit-btn submit-number-btn" type="primary">确认修改纸品</button></view>
</view>
</uni-popup>
</view>
<view class="">
<uni-popup ref="popupPrice" :mask-click="false">
<view class="submit-popup">
<view class="submit-line">
<view class="submit-popup-close">
<view class="submit-popup-title">
单价(元/吨)
<text class="submit-number-text submit-price-subTitle">预估重量：1.6346吨</text>
</view>
<view class="" @click="close()"><image class="submit-popup-close-image" src="../../static/imgs/client/close-icon.png" mode=""></image></view>
</view>
<view>
<view class="">
<uni-easyinput :inputBorder="false" class="submit-popup-input" type="number" v-model="value" placeholder="请输入内容"></uni-easyinput>
</view>
</view>
</view>
<view class="submit-number-box submit-price">
<view class="submit-popup-close"><view class="submit-popup-title">其他费用(元)</view></view>
<view class=""><uni-easyinput :inputBorder="false" class="submit-popup-input" type="number" v-model="value" placeholder="请输入内容"></uni-easyinput></view>
</view>
<view class="submit-price-total">
<view class="submit-price-text">合计：</view>
<view class="submit-price-total-text">¥ 0</view>
</view>
<view class=""><button class="submit-btn submit-number-btn" type="primary">确认报价</button></view>
</view>
</uni-popup>
</view>
<view class="">
<uni-popup ref="popupTime" :mask-click="false">
<view class="submit-check-time">
<view class="submit-check-flex ">
<view class="submit-check-cancel" @click="pickerCancel()">
取消
</view>
<view class="submit-check-title">
设置时间
</view>
<view class="submit-check-sure" @click="pickerSure()">
确认
</view>
</view>
<picker-view v-if="visible" :indicator-style="indicatorStyle" :value="timeValue" @change="bindChange" class="picker-view">
<picker-view-column>
<view class="item submit-check-text" v-for="(item, index) in years" :key="index">{{ item }}</view>
</picker-view-column>
<picker-view-column>
<view class="item submit-check-text" v-for="(item, index) in months" :key="index">{{ item }}小时</view>
</picker-view-column>
</picker-view>
</view>
</uni-popup>
</view>
</view>
</template>
<script>
import { back, go2 } from '@/utils/hook.js'
import qnHeader from '@/components/qn-header/qn-header.vue'
import uGap from '@/components/u-gap/u-gap.vue'
export default {
components: {
qnHeader,
uGap
},
data() {
const date = new Date()
const years = ['长期']
const year = date.getFullYear()
const months = []
const month = date.getMonth() + 1
const day = date.getDate()
for (let i = 0; i <= 31; i++) {
years.push(i+'天')
}
for (let i = 1; i <= 12; i++) {
months.push(i)
}
return {
value: '',
value1: '',
vModelValue: '',
indicatorStyle: `height: 50px;`,
visible: true,
title: 'picker-view',
years,
year,
months,
month,
timeValue: [0, 1],
pickerValue:[],
items: [
{
text: '一年级',
value: '1-0'
},
{
text: '二年级',
value: '2-0'
},
{
text: '三年级',
value: '3-0'
},
{
text: '一年级',
value: '1-0'
},
{
text: '二年级',
value: '2-0'
},
{
text: '三年级',
value: '3-0'
}
]
}
},
methods: {
back,
// 商品操作按钮
commodityModify(item) {
console.log(111)
this.$refs.popup.open('bottom')
},
// 单价操作按钮
priceModify() {
this.$refs.popupPrice.open('bottom')
},
// 事件设置
resetTime() {
this.$refs.popupTime.open('bottom')
},
// 事件选择change事件
bindChange(e) {
console.log(e.detail.value)
},
close() {
this.$refs.popup.close()
this.$refs.popupPrice.close()
},
// 纸张选择下拉change事件
onchange(e) {
console.log(e)
this.pickerValue = e.detail.value
},
// 时间设置取消
pickerCancel(){
this.$refs.popupTime.close()
},
// 时间设置确认
pickerSure(){
this.$refs.popupTime.close()
}
}
}
</script>
<style lang="scss">
.picker-view {
width: 750rpx;
height: 600rpx;
margin-top: 20rpx;
}
.item {
height: 50rpx;
align-items: center;
justify-content: center;
text-align: center;
padding-top: 30rpx;
}
.submit-quotation {
.submit-title {
width: 100%;
font-family: PingFangSC-Medium;
font-size: 36rpx;
color: #000000;
letter-spacing: 0;
text-align: center;
font-weight: 500;
}
.submit-main {
width: 750rpx;
height: 260rpx;
padding: 24rpx 0rpx 0rpx 32rpx;
line-height: 52rpx;
background: #ffffff;
.submit-main-title {
font-family: PingFangSC-Medium;
font-size: 30rpx;
color: #000000;
letter-spacing: 0;
font-weight: 500;
}
.submit-main-subTitle {
font-family: PingFangSC-Regular;
font-size: 28rpx;
color: #888888;
letter-spacing: 0;
font-weight: 400;
}
.submit-main-subContant {
font-family: PingFangSC-Regular;
font-size: 28rpx;
color: #333333;
letter-spacing: 0;
font-weight: 400;
}
}
.submit-deadline {
width: 750rpx;
height: 75rpx;
background: #f4f9fc;
box-shadow: 0rpx 2rpx 12rpx 0rpx rgba(100, 101, 102, 0.12);
display: flex;
justify-content: center;
.submit-text {
font-family: PingFangSC-Medium;
font-size: 28rpx;
color: rgba(0, 0, 0, 0.5);
letter-spacing: 0;
font-weight: 500;
margin-top: 22rpx;
width: 130rpx;
}
.submit-time {
width: 40rpx;
height: 40rpx;
background: #ee0a24;
border-radius: 8rpx;
margin-top: 20rpx;
text-align: center;
}
.submit-time-text {
font-family: PingFangSC-Semibold;
font-size: 24rpx;
color: #ffffff;
text-align: center;
line-height: 32rpx;
font-weight: 600;
}
.sbumit-colon {
width: 24rpx;
height: 32rpx;
font-family: PingFangSC-Regular;
font-size: 24rpx;
color: #ee0a24;
text-align: center;
line-height: 32rpx;
font-weight: 400;
margin-top: 20rpx;
}
}
.submit-contant {
background-color: #ffffff;
// height: 368rpx;
border-bottom: 2rpx solid #dddddd;
padding-bottom: 20rpx;
.submit-contant-head {
line-height: 90rpx;
width: 750rpx;
height: 90rpx;
border-bottom: 2rpx dashed #d8d8d8;
display: flex;
justify-content: space-between;
}
.submit-contant-title {
font-family: PingFangSC-Semibold;
font-size: 30rpx;
color: rgba(0, 0, 0, 0.75);
letter-spacing: 0;
text-align: left;
font-weight: 600;
padding: 0rpx 0rpx 0rpx 32rpx;
}
.submit-contant-body {
line-height: 68rpx;
padding-left: 32rpx;
.submit-contant-body-title {
font-family: PingFangSC-Regular;
font-size: 28rpx;
color: #555555;
letter-spacing: 0;
font-weight: 400;
}
.submit-contant-body-subtitle {
font-family: PingFangSC-Regular;
font-size: 28rpx;
color: #555555;
letter-spacing: 0;
font-weight: 400;
float: right;
margin-right: 32rpx;
}
.submit-contant-body-input {
margin-right: 32rpx;
}
.submit-contant-body-inputClass {
background-color: #f7f8fa;
}
}
}
.submit-contant-order {
width: 750rpx;
height: 90rpx;
line-height: 90rpx;
background: #ffffff;
display: flex;
padding-left: 32rpx;
padding-right: 32rpx;
justify-content: space-between;
.submit-contant-order-title {
width: 140rpx;
height: 40rpx;
font-family: PingFangSC-Regular;
font-size: 28rpx;
color: rgba(0, 0, 0, 0.5);
font-weight: 400;
}
.submit-contant-order-subtitle {
width: 101rpx;
height: 40rpx;
font-family: PingFangSC-Regular;
font-size: 28rpx;
color: rgba(0, 0, 0, 0.5);
letter-spacing: 0;
text-align: left;
font-weight: 400;
}
.submit-contant-order-money {
width: 172rpx;
height: 42rpx;
font-family: PingFangSC-Semibold;
font-size: 40rpx;
color: #f5222d;
letter-spacing: 0;
line-height: 42rpx;
font-weight: 600;
}
}
.submit-contant-time {
width: 750rpx;
height: 88rpx;
background: #ffffff;
line-height: 88rpx;
display: flex;
padding-left: 32rpx;
padding-right: 32rpx;
justify-content: space-between;
.submit-contant-time-title {
width: 230rpx;
height: 40rpx;
font-size: 28rpx;
color: #000000;
letter-spacing: 0;
font-weight: 400;
}
.submit-contant-time-subtitle {
width: 56rpx;
height: 40rpx;
font-size: 28rpx;
color: #007aff;
letter-spacing: 0;
text-align: right;
font-weight: 500;
cursor: pointer;
}
}
.submit-contant-remark {
width: 750rpx;
height: 336rpx;
background: #ffffff;
.submit-contant-remark-title {
font-family: PingFangSC-Regular;
font-size: 30rpx;
color: #000000;
letter-spacing: 0;
font-weight: 400;
padding: 28rpx 0rpx 0rpx 32rpx;
}
.submit-contant-remark-input {
background: #f7f8fa;
border-radius: 20rpx;
margin: 10rpx 32rpx 32rpx 32rpx;
width: 686rpx;
}
}
.submit-btnBg {
width: 750rpx;
height: 120rx;
background: #ffffff;
box-shadow: 0rpx 2rpx 12rpx 0rpx rgba(100, 101, 102, 0.12);
padding: 12rpx 32rpx 12rpx 32rpx;
}
.submit-btn {
width: 686rpx;
height: 96rpx;
background: #007aff;
border-radius: 10px;
}
.submit-image {
width: 24.38rpx;
height: 20.38rpx;
margin-right: 32rpx;
cursor: pointer;
}
.submit-image-price {
width: 24.38rpx;
height: 20.38rpx;
margin-left: 14rpx;
cursor: pointer;
}
.submit-popup {
width: 750rpx;
height: 960rpx;
background: #ffffff;
border-top-right-radius: 2rpx;
border-top-left-radius: 2rpx;
padding: 20rpx 32rpx 0rpx 32rpx;
// line-height: 124rpx;
.submit-popup-input {
background-color: #f5f5f5;
}
.submit-popup-close {
display: flex;
justify-content: space-between;
}
.submit-popup-close-image {
width: 24.38rpx;
height: 20.38rpx;
cursor: pointer;
}
.submit-popup-title {
font-size: 30rpx;
color: rgba(0, 0, 0, 0.85);
letter-spacing: 0;
text-align: left;
font-weight: 400;
}
.submit-popup-specifications {
width: 320rpx;
}
.submit-popup-x {
font-size: 32rpx;
color: rgba(0, 0, 0, 0.85);
font-weight: 400;
}
.submit-line {
border-bottom: 2rpx solid #d8d8d8;
padding-bottom: 32rpx;
height: 194rpx;
line-height: 72rpx;
}
.submit-number-box {
margin-top: 24rpx;
}
.submit-number-text {
font-size: 24rpx;
color: rgba(0, 0, 0, 0.5);
font-weight: 400;
}
.submit-number-line {
line-height: 40rpx;
}
.submit-number-btn {
position: absolute;
bottom: 20rpx;
}
.submit-price {
line-height: 72rpx;
}
.submit-price-total {
display: flex;
justify-content: flex-end;
margin-top: 20rpx;
}
.submit-price-total-text {
font-size: 40rpx;
color: #f5222d;
letter-spacing: 0;
line-height: 42rpx;
font-weight: 600;
}
.submit-price-text {
font-size: 28rpx;
color: rgba(0, 0, 0, 0.85);
text-align: right;
font-weight: 400;
line-height: 40rpx;
}
.submit-price-subTitle {
margin-left: 20rpx;
}
}
.submit-check-time{
background-color: #FFFFFF;
padding: 28rpx 32rpx 0px 28rpx;
.submit-check-flex {
display: flex;
justify-content: space-between;
}
.submit-check-title{
font-size: 32rpx;
color: #323233;
text-align: center;
line-height: 44rpx;
font-weight: 500;
}
.submit-check-cancel{
font-size: 28rpx;
color: #969799;
line-height: 40rpx;
font-weight: 400;
cursor: pointer;
}
.submit-check-sure{
font-size: 28rpx;
color: #007AFF;
line-height: 40rpx;
font-weight: 400;
cursor: pointer;
}
.submit-check-text{
font-size: 36rpx;
color: #323233;
line-height: 48rpx;
font-weight: 500;
}
}
}
</style>

21
pages/trade/index.vue
View File

@ -36,9 +36,8 @@ export default {
key: '', key: '',
mainKey: '1', mainKey: '1',
current: '0', current: '0',
controlCurrent: 0,
items: ['报价', '订单'], items: ['报价', '订单'],
controlItems: ['全部', '待确认', '待发货', '已完成'],
} }
}, },
mounted() { mounted() {
@ -60,10 +59,7 @@ export default {
// this.getTradingQurty() // this.getTradingQurty()
// } // }
}, },
//分段器点击事件
onClickItem(value) {
console.log(value)
}
} }
} }
</script> </script>
@ -72,11 +68,11 @@ export default {
.trade-index { .trade-index {
.top-bar { .top-bar {
background-color: rgb(255, 255, 255); background-color: rgb(255, 255, 255);
border-bottom-width: 1px;
border-bottom-width: 2rpx;
border-bottom-style: solid; border-bottom-style: solid;
border-bottom-color: #eee; border-bottom-color: #eee;
z-index: 998; z-index: 998;
height: 44px;
height: 88rpx;
} }
.title { .title {
font-size: 40rpx; font-size: 40rpx;
@ -85,7 +81,7 @@ export default {
font-weight: 500; font-weight: 500;
} }
.text-view { .text-view {
padding: 10px;
padding: 20rpx;
} }
.bar-contant { .bar-contant {
display: flex; display: flex;
@ -96,7 +92,7 @@ export default {
color: #000000; color: #000000;
letter-spacing: 0; letter-spacing: 0;
font-weight: 550; font-weight: 550;
border-bottom: 2px solid #007aff;
border-bottom: 4rpx solid #007aff;
} }
.oncheck-title { .oncheck-title {
font-family: PingFangSC-Regular; font-family: PingFangSC-Regular;
@ -105,9 +101,8 @@ export default {
font-weight: 550; font-weight: 550;
} }
.check-control { .check-control {
line-height: 35px;
width: 40px;
line-height: 70rpx;
// width: 40px;
text-align: center; text-align: center;
} }
.title-left { .title-left {

66
pages/trade/orderList.vue
View File

@ -1,15 +1,18 @@
<template> <template>
<view class="order-list"> <view class="order-list">
<!-- <uni-segmented-control :current="controlCurrent" :values="controlItems" @clickItem="onClickItem" styleType="text" activeColor="#007AFF"></uni-segmented-control> -->
<uni-segmented-control :current="controlCurrent" :values="controlItems" @clickItem="onClickItem" styleType="text" activeColor="#007AFF"></uni-segmented-control>
<scroll-list style="touch-action: none" ref="orderRef" :option="orderOption" @load="orderUp" @refresh="orderDown"> <scroll-list style="touch-action: none" ref="orderRef" :option="orderOption" @load="orderUp" @refresh="orderDown">
<view v-for="(items,index) in orderData" :key="index">
<view v-for="(items, index) in orderData" :key="index">
<view class="list-border list-title-line"> <view class="list-border list-title-line">
<text class="list-title">广州民族印刷有限公司</text> <text class="list-title">广州民族印刷有限公司</text>
<text class="list-title-Subtitle">{{ items.orderStatus }}</text> <text class="list-title-Subtitle">{{ items.orderStatus }}</text>
</view> </view>
<view class="list-border list-info-line" v-for="(item, index) in items.orderItemList" :key="index"> <view class="list-border list-info-line" v-for="(item, index) in items.orderItemList" :key="index">
<view class="list-info list-border">
<view class=""><image class="list-image" :src="item.productImg" mode=""></image></view>
<view class="list-info " :class="index===items.orderItemList.length?'list-border':''">
<view class="">
<!-- <image class="list-image" :src="item.productImg" mode=""></image> -->
<image class="list-image" src="../../static/logo.png" mode="">
</view>
<view class="list-info-contant"> <view class="list-info-contant">
<view class="list-info-title">{{ item.brandName }}{{ item.categoryName }}</view> <view class="list-info-title">{{ item.brandName }}{{ item.categoryName }}</view>
<view class="list-info-text"> <view class="list-info-text">
@ -20,8 +23,8 @@
</view> </view>
<view class="list-border list-bottom-contant"> <view class="list-border list-bottom-contant">
<view> <view>
<text>交货时间：</text>
<text>{{ items.deliveryDay }}天</text>
<text class="list-bottom-contant-text">交货时间：</text>
<text class="list-bottom-contant-subtext">{{ items.deliveryDay }}天</text>
<text class="list-title-Subtitle">¥{{ items.totalOfferPrice }}</text> <text class="list-title-Subtitle">¥{{ items.totalOfferPrice }}</text>
</view> </view>
</view> </view>
@ -53,6 +56,8 @@ export default {
pageSize: 10 pageSize: 10
}, },
orderData: [], orderData: [],
controlCurrent: 0,
controlItems: ['全部', '待确认', '待发货', '已完成'],
orderOption: { orderOption: {
size: 10, size: 10,
auto: true, auto: true,
@ -128,6 +133,10 @@ export default {
.catch(() => { .catch(() => {
this.$refs.orderRef.refreshFail() this.$refs.orderRef.refreshFail()
}) })
},
//分段器点击事件
onClickItem(value) {
console.log(value)
} }
} }
} }
@ -136,13 +145,16 @@ export default {
<style lang="scss"> <style lang="scss">
.order-list { .order-list {
margin-bottom: 0px; margin-bottom: 0px;
background: #FFFFFF;
.list-border { .list-border {
// border-top: 1px solid #dddddd;
border-bottom: 1px solid #dddddd;
border-bottom: 2rpx solid #dddddd;
} }
.list-title-line { .list-title-line {
line-height: 44px;
padding-left: 24px;
line-height: 88rpx;
padding-left: 48rpx;
width: 750rpx;
height: 88rpx;
background: #FFFFFF;
} }
.list-title { .list-title {
font-family: PingFangSC-Semibold; font-family: PingFangSC-Semibold;
@ -162,11 +174,14 @@ export default {
margin-right: 32rpx; margin-right: 32rpx;
} }
.list-info-line { .list-info-line {
padding-left: 24px;
line-height: 35px;
padding-left: 48rpx;
line-height: 70rpx;
// width: 750rpx;
// height: 88rpx;
background: #FFFFFF;
} }
.list-info-contant { .list-info-contant {
margin-left: 24px;
margin-left: 48rpx;
} }
.list-info-title { .list-info-title {
font-family: PingFangSC-Medium; font-family: PingFangSC-Medium;
@ -182,20 +197,37 @@ export default {
color: #888888; color: #888888;
letter-spacing: 0; letter-spacing: 0;
text-align: left; text-align: left;
line-height: 32px;
line-height: 64rpx;
font-weight: 400; font-weight: 400;
} }
.list-image { .list-image {
width: 100rpx; width: 100rpx;
height: 100rpx; height: 100rpx;
margin-top: 10px;
margin-top: 20rpx;
} }
.list-info { .list-info {
display: flex; display: flex;
} }
.list-bottom-contant { .list-bottom-contant {
line-height: 35px;
padding-left: 24px;
line-height: 70rpx;
padding-left: 48rpx;
width: 750rpx;
height: 80rpx;
background: #FFFFFF;
.list-bottom-contant-text{
font-size: 26rpx;
color: #888888;
letter-spacing: 0;
line-height: 32rpx;
font-weight: 400;
}
.list-bottom-contant-subtext{
font-size: 26rpx;
color: #333333;
letter-spacing: 0;
line-height: 32rpx;
font-weight: 400;
}
} }
} }
</style> </style>

77
pages/trade/quotationList.vue
View File

@ -46,7 +46,7 @@
</scroll-list> </scroll-list>
<view> <view>
<view class="offer-prices" @click="nativeTo()"> <view class="offer-prices" @click="nativeTo()">
<image class="my-image" src="../../static/imgs/tabbar/trade-gray.png" mode=""></image>
<image class="my-image" src="../../static/imgs/trade/myPrice.png" mode=""></image>
<view class="my-price"> <view class="my-price">
我的报价 我的报价
</view> </view>
@ -155,12 +155,16 @@ export default {
}) })
}, },
// 报价按钮事件 // 报价按钮事件
offerClick(){},
offerClick(){
uni.navigateTo({
url: '../submit-quotation/index'
});
},
// 我的报价页面跳转事件 // 我的报价页面跳转事件
nativeTo(){ nativeTo(){
console.log(11) console.log(11)
uni.navigateTo({ uni.navigateTo({
url: 'my-offer'
url: '../my-offer/index'
}); });
}, },
} }
@ -169,14 +173,15 @@ export default {
<style lang="scss"> <style lang="scss">
.quotation-list { .quotation-list {
margin-bottom: 0px;
margin-bottom: 0rpx;
.list-border { .list-border {
// border-top: 1px solid #dddddd; // border-top: 1px solid #dddddd;
border-bottom: 1px solid #dddddd;
border-bottom: 2rpx solid #dddddd;
} }
.list-title-line { .list-title-line {
line-height: 44px;
padding-left: 24px;
line-height: 88rpx;
padding-left: 48rpx;
background: #FFFFFF;
} }
.list-title { .list-title {
font-family: PingFangSC-Semibold; font-family: PingFangSC-Semibold;
@ -196,11 +201,13 @@ export default {
margin-right: 32rpx; margin-right: 32rpx;
} }
.list-info-line { .list-info-line {
padding-left: 24px;
line-height: 35px;
padding-left: 48rpx;
line-height: 70rpx;
background: #FFFFFF;
} }
.list-info-contant { .list-info-contant {
margin-left: 24px;
margin-left: 48rpx;
background: #FFFFFF;
} }
.list-info-title { .list-info-title {
font-family: PingFangSC-Medium; font-family: PingFangSC-Medium;
@ -216,36 +223,46 @@ export default {
color: #888888; color: #888888;
letter-spacing: 0; letter-spacing: 0;
text-align: left; text-align: left;
line-height: 32px;
line-height: 64rpx;
font-weight: 400; font-weight: 400;
} }
.list-image { .list-image {
width: 100rpx; width: 100rpx;
height: 100rpx; height: 100rpx;
margin-top: 10px;
margin-top: 20rpx;
} }
.list-info { .list-info {
display: flex; display: flex;
} }
.list-bottom-contant { .list-bottom-contant {
line-height: 35px;
padding-left: 24px;
padding-bottom: 24px;
line-height: 70rpx;
padding-left: 48rpx;
padding-bottom: 48rpx;
background: #FFFFFF;
} }
.my-image { .my-image {
width: 30px;
height: 30px;
width: 32rpx;
height: 32rpx;
} }
.my-price { .my-price {
color: #007aff;
font-size: 28rpx;
font-family: PingFangSC-Medium;
font-size: 18rpx;
color: #007AFF;
text-align: center;
font-weight: 500;
white-space: nowrap;
padding: 6rpx;
} }
.offer-class{ .offer-class{
display: flex; display: flex;
} }
.offer-btn{ .offer-btn{
width: 80px;
line-height: 35px;
width: 150rpx;
height: 64rpx;
background: #007AFF;
border: 2rpx solid #007AFF;
border-radius: 8rpx;
line-height: 60rpx;
} }
.offer-width{ .offer-width{
width: 70%; width: 70%;
@ -253,16 +270,20 @@ export default {
.offer-prices{ .offer-prices{
position: absolute; position: absolute;
z-index: 9999; z-index: 9999;
right: 10px;
bottom: 20%;
right: 32rpx;
bottom: 122rpx;
background-color: #ffffff; background-color: #ffffff;
border-radius: 50%; border-radius: 50%;
padding: 10px;
padding: 10rpx;
text-align: center; text-align: center;
width: 80px;
height: 80px;
border: 2px solid #F9F9F9;
box-shadow: 0px 4px 34px 0px rgba(0,0,0,0.2);
width: 110rpx;
height: 110rpx;
border: 2rpx solid #F9F9F9;
box-shadow: 0rpx 4rpx 34rpx 0rpx rgba(0,0,0,0.2);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
} }
} }
</style> </style>

BIN
static/imgs/client-detail/arrow-right-icon.png
View File

Before After
Width: 32  |  Height: 32  |  Size: 543 B

BIN
static/imgs/client-detail/no-data-icon.png
View File

Before After
Width: 560  |  Height: 320  |  Size: 41 KiB

BIN
static/imgs/client-detail/yzjy-icon.png
View File

Before After
Width: 750  |  Height: 184  |  Size: 138 KiB

BIN
static/imgs/mall/cut-icon.png
View File

Before After
Width: 24  |  Height: 24  |  Size: 382 B

BIN
static/imgs/mall/grounding-icon.png
View File

Before After
Width: 150  |  Height: 50  |  Size: 2.1 KiB

BIN
static/imgs/mall/sold-out-icon.png
View File

Before After
Width: 150  |  Height: 50  |  Size: 2.7 KiB

BIN
static/imgs/mall/zsc-bg-icon.png
View File

Before After
Width: 750  |  Height: 180  |  Size: 33 KiB

BIN
static/imgs/trade/myPrice.png
View File

Before After
Width: 32  |  Height: 32  |  Size: 794 B

25
uni_modules/uni-number-box/changelog.md
View File

@ -0,0 +1,25 @@
## 1.2.1（2021-11-22）
- 修复 vue3中某些scss变量无法找到的问题
## 1.2.0（2021-11-19）
- 优化 组件UI，并提供设计资源，详见:[https://uniapp.dcloud.io/component/uniui/resource](https://uniapp.dcloud.io/component/uniui/resource)
- 文档迁移，详见:[https://uniapp.dcloud.io/component/uniui/uni-number-box](https://uniapp.dcloud.io/component/uniui/uni-number-box)
## 1.1.2（2021-11-09）
- 新增 提供组件设计资源，组件样式调整
## 1.1.1（2021-07-30）
- 优化 vue3下事件警告的问题
## 1.1.0（2021-07-13）
- 组件兼容 vue3，如何创建vue3项目，详见 [uni-app 项目支持 vue3 介绍](https://ask.dcloud.net.cn/article/37834)
## 1.0.7（2021-05-12）
- 新增 组件示例地址
## 1.0.6（2021-04-20）
- 修复 uni-number-box 浮点数运算不精确的 bug
- 修复 uni-number-box change 事件触发不正确的 bug
- 新增 uni-number-box v-model 双向绑定
## 1.0.5（2021-02-05）
- 调整为uni_modules目录规范
## 1.0.7（2021-02-05）
- 调整为uni_modules目录规范
- 新增 支持 v-model
- 新增 支持 focus、blur 事件
- 新增 支持 PC 端

220
uni_modules/uni-number-box/components/uni-number-box/uni-number-box.vue
View File

@ -0,0 +1,220 @@
<template>
<view class="uni-numbox">
<view @click="_calcValue('minus')" class="uni-numbox__minus uni-numbox-btns" :style="{background}">
<text class="uni-numbox--text" :class="{ 'uni-numbox--disabled': inputValue <= min || disabled }" :style="{color}">-</text>
</view>
<input :disabled="disabled" @focus="_onFocus" @blur="_onBlur" class="uni-numbox__value" type="number"
v-model="inputValue" :style="{background, color}" />
<view @click="_calcValue('plus')" class="uni-numbox__plus uni-numbox-btns" :style="{background}">
<text class="uni-numbox--text" :class="{ 'uni-numbox--disabled': inputValue >= max || disabled }" :style="{color}">+</text>
</view>
</view>
</template>
<script>
/**
* NumberBox 数字输入框
* @description 带加减按钮的数字输入框
* @tutorial https://ext.dcloud.net.cn/plugin?id=31
* @property {Number} value 输入框当前值
* @property {Number} min 最小值
* @property {Number} max 最大值
* @property {Number} step 每次点击改变的间隔大小
* @property {String} background 背景色
* @property {String} color 字体颜色（前景色）
* @property {Boolean} disabled = [true|false] 是否为禁用状态
* @event {Function} change 输入框值改变时触发的事件，参数为输入框当前的 value
* @event {Function} focus 输入框聚焦时触发的事件，参数为 event 对象
* @event {Function} blur 输入框失焦时触发的事件，参数为 event 对象
*/
export default {
name: "UniNumberBox",
emits: ['change', 'input', 'update:modelValue', 'blur', 'focus'],
props: {
value: {
type: [Number, String],
default: 1
},
modelValue: {
type: [Number, String],
default: 1
},
min: {
type: Number,
default: 0
},
max: {
type: Number,
default: 100
},
step: {
type: Number,
default: 1
},
background: {
type: String,
default: '#f5f5f5'
},
color: {
type: String,
default: '#333'
},
disabled: {
type: Boolean,
default: false
}
},
data() {
return {
inputValue: 0
};
},
watch: {
value(val) {
this.inputValue = +val;
},
modelValue(val) {
this.inputValue = +val;
}
},
created() {
if (this.value === 1) {
this.inputValue = +this.modelValue;
}
if (this.modelValue === 1) {
this.inputValue = +this.value;
}
},
methods: {
_calcValue(type) {
if (this.disabled) {
return;
}
const scale = this._getDecimalScale();
let value = this.inputValue * scale;
let step = this.step * scale;
if (type === "minus") {
value -= step;
if (value < (this.min * scale)) {
return;
}
if (value > (this.max * scale)) {
value = this.max * scale
}
}
if (type === "plus") {
value += step;
if (value > (this.max * scale)) {
return;
}
if (value < (this.min * scale)) {
value = this.min * scale
}
}
this.inputValue = (value / scale).toFixed(String(scale).length - 1);
this.$emit("change", +this.inputValue);
// TODO vue2 兼容
this.$emit("input", +this.inputValue);
// TODO vue3 兼容
this.$emit("update:modelValue", +this.inputValue);
},
_getDecimalScale() {
let scale = 1;
// 浮点型
if (~~this.step !== this.step) {
scale = Math.pow(10, String(this.step).split(".")[1].length);
}
return scale;
},
_onBlur(event) {
this.$emit('blur', event)
let value = event.detail.value;
if (!value) {
// this.inputValue = 0;
return;
}
value = +value;
if (value > this.max) {
value = this.max;
} else if (value < this.min) {
value = this.min;
}
const scale = this._getDecimalScale();
this.inputValue = value.toFixed(String(scale).length - 1);
this.$emit("change", +this.inputValue);
this.$emit("input", +this.inputValue);
},
_onFocus(event) {
this.$emit('focus', event)
}
}
};
</script>
<style lang="scss" scoped>
$box-height: 26px;
$bg: #f5f5f5;
$br: 2px;
$color: #333;
.uni-numbox {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
}
.uni-numbox-btns {
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
align-items: center;
justify-content: center;
padding: 0 8px;
background-color: $bg;
/* #ifdef H5 */
cursor: pointer;
/* #endif */
}
.uni-numbox__value {
margin: 0 2px;
background-color: $bg;
width: 40px;
height: $box-height;
text-align: center;
font-size: 14px;
border-left-width: 0;
border-right-width: 0;
color: $color;
}
.uni-numbox__minus {
border-top-left-radius: $br;
border-bottom-left-radius: $br;
}
.uni-numbox__plus {
border-top-right-radius: $br;
border-bottom-right-radius: $br;
}
.uni-numbox--text {
// fix nvue
line-height: 20px;
font-size: 20px;
font-weight: 300;
color: $color;
}
.uni-numbox .uni-numbox--disabled {
color: #c0c0c0 !important;
/* #ifdef H5 */
cursor: not-allowed;
/* #endif */
}
</style>

85
uni_modules/uni-number-box/package.json
View File

@ -0,0 +1,85 @@
{
"id": "uni-number-box",
"displayName": "uni-number-box 数字输入框",
"version": "1.2.1",
"description": "NumberBox 带加减按钮的数字输入框组件，用户可以控制每次点击增加的数值，支持小数。",
"keywords": [
"uni-ui",
"uniui",
"数字输入框"
],
"repository": "https://github.com/dcloudio/uni-ui",
"engines": {
"HBuilderX": ""
},
"directories": {
"example": "../../temps/example_temps"
},
"dcloudext": {
"category": [
"前端组件",
"通用组件"
],
"sale": {
"regular": {
"price": "0.00"
},
"sourcecode": {
"price": "0.00"
}
},
"contact": {
"qq": ""
},
"declaration": {
"ads": "无",
"data": "无",
"permissions": "无"
},
"npmurl": "https://www.npmjs.com/package/@dcloudio/uni-ui"
},
"uni_modules": {
"dependencies": ["uni-scss"],
"encrypt": [],
"platforms": {
"cloud": {
"tcb": "y",
"aliyun": "y"
},
"client": {
"App": {
"app-vue": "y",
"app-nvue": "y"
},
"H5-mobile": {
"Safari": "y",
"Android Browser": "y",
"微信浏览器(Android)": "y",
"QQ浏览器(Android)": "y"
},
"H5-pc": {
"Chrome": "y",
"IE": "y",
"Edge": "y",
"Firefox": "y",
"Safari": "y"
},
"小程序": {
"微信": "y",
"阿里": "y",
"百度": "y",
"字节跳动": "y",
"QQ": "y"
},
"快应用": {
"华为": "u",
"联盟": "u"
},
"Vue": {
"vue2": "y",
"vue3": "y"
}
}
}
}
}

13
uni_modules/uni-number-box/readme.md
View File

@ -0,0 +1,13 @@
## NumberBox 数字输入框
> **组件名：uni-number-box**
> 代码块： `uNumberBox`
带加减按钮的数字输入框。
### [查看文档](https://uniapp.dcloud.io/component/uniui/uni-number-box)
#### 如使用过程中有任何问题，或者您对uni-ui有一些好的建议，欢迎加入 uni-ui 交流群：871950839
Write Preview
Loading…
Cancel
Save