12 changed files with 1034 additions and 1828 deletions
Unified View
Diff Options
-
+123 -127components/user/productList.vue
-
+0 -18pages.json
-
+0 -259pages/index/cart.vue
-
+0 -181pages/index/category.vue
-
+0 -420pages/index/center.vue
-
+5 -0pages/index/index.vue
-
+174 -156pages/index/tradingPlatform.vue
-
+75 -76pages_order/auth/selectionIdentity.vue
-
+159 -125pages_order/center/systemSet.vue
-
+470 -463pages_order/tradingPlatform/nowOrder.vue
-
BINstatic/image/tabbar/组 46940_1.png
-
+28 -3store/store.js
+ 123
- 127
components/user/productList.vue
View File
| @ -1,147 +1,143 @@ | |||||
| <template> | <template> | ||||
| <view class="list"> | |||||
| <view class="item" | |||||
| v-for="(item, index) in 10" | |||||
| @click="immediatePurchase(item)" | |||||
| :key="index"> | |||||
| <image | |||||
| class="image" | |||||
| src="https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg" mode=""></image> | |||||
| <view class="info"> | |||||
| <view class="title"> | |||||
| {{ $t('other.aluminumProducts') }} | |||||
| </view> | |||||
| <view class="price"> | |||||
| <text>￥58</text> | |||||
| {{ $t('other.unitPrice2') }} | |||||
| </view> | |||||
| <!--<view class="favorable">--> | |||||
| <!-- <view class="t">--> | |||||
| <!-- 限时优惠--> | |||||
| <!-- </view>--> | |||||
| <!-- <view class="p">--> | |||||
| <!-- ￥48--> | |||||
| <!-- </view>--> | |||||
| <!--</view>--> | |||||
| <view class="num"> | |||||
| 最多批发*快速下单 | |||||
| </view> | |||||
| </view> | |||||
| <view class="btn"> | |||||
| <view class="change"> | |||||
| {{ $t('other.immediatePurchase') }} | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <view class="list"> | |||||
| <view class="item" v-for="(item, index) in list" @click="immediatePurchase(item)" :key="index"> | |||||
| <image class="image" :src="item.pic || 'https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg'" mode=""></image> | |||||
| <view class="info"> | |||||
| <view class="title"> | |||||
| {{ $t('other.aluminumProducts') }} | |||||
| </view> | |||||
| <view class="price"> | |||||
| <text>￥{{ item.price }}</text> | |||||
| {{ $t('components.unitPrice2') }} | |||||
| </view> | |||||
| <!--<view class="favorable">--> | |||||
| <!-- <view class="t">--> | |||||
| <!-- 限时优惠--> | |||||
| <!-- </view>--> | |||||
| <!-- <view class="p">--> | |||||
| <!-- ￥48--> | |||||
| <!-- </view>--> | |||||
| <!--</view>--> | |||||
| <view class="num"> | |||||
| 最多批发*快速下单 | |||||
| </view> | |||||
| </view> | |||||
| <view class="btn"> | |||||
| <view class="change"> | |||||
| {{ $t('components.immediatePurchase') }} | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </template> | </template> | ||||
| <script> | <script> | ||||
| export default { | |||||
| name: "productList", | |||||
| data() { | |||||
| return {}; | |||||
| }, | |||||
| methods: { | |||||
| // 立即购买 | |||||
| immediatePurchase(item) { | |||||
| console.log("====") | |||||
| var itemStr = encodeURIComponent(JSON.stringify(item)); | |||||
| uni.navigateTo({ | |||||
| url: `/pages_order/tradingPlatform/nowOrder?params=${itemStr}`, | |||||
| }); | |||||
| } | |||||
| }, | |||||
| } | |||||
| export default { | |||||
| name: "productList", | |||||
| props : ['list'], | |||||
| data() { | |||||
| return {}; | |||||
| }, | |||||
| methods: { | |||||
| // 立即购买 | |||||
| immediatePurchase(item) { | |||||
| console.log("====") | |||||
| var itemStr = encodeURIComponent(JSON.stringify(item)); | |||||
| uni.navigateTo({ | |||||
| url: `/pages_order/tradingPlatform/nowOrder?params=${itemStr}`, | |||||
| }); | |||||
| } | |||||
| }, | |||||
| } | |||||
| </script> | </script> | ||||
| <style scoped lang="scss"> | <style scoped lang="scss"> | ||||
| .list { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| flex-wrap: wrap; | |||||
| .list { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| flex-wrap: wrap; | |||||
| .item { | |||||
| position: relative; | |||||
| width: 300rpx; | |||||
| padding: 20rpx; | |||||
| background-color: #fff; | |||||
| border-radius: 20rpx; | |||||
| margin-top: 20rpx; | |||||
| .item { | |||||
| position: relative; | |||||
| width: 300rpx; | |||||
| padding: 20rpx; | |||||
| background-color: #fff; | |||||
| border-radius: 20rpx; | |||||
| margin-top: 20rpx; | |||||
| &:nth-child(odd) { | |||||
| margin-right: 20rpx; | |||||
| } | |||||
| &:nth-child(odd) { | |||||
| margin-right: 20rpx; | |||||
| } | |||||
| .image { | |||||
| width: 300rpx; | |||||
| height: 250rpx; | |||||
| border-radius: 20rpx; | |||||
| } | |||||
| .image { | |||||
| width: 300rpx; | |||||
| height: 250rpx; | |||||
| border-radius: 20rpx; | |||||
| } | |||||
| .info { | |||||
| font-size: 26rpx; | |||||
| .info { | |||||
| font-size: 26rpx; | |||||
| .title { | |||||
| font-size: 30rpx; | |||||
| color: #000; | |||||
| } | |||||
| .title { | |||||
| font-size: 30rpx; | |||||
| color: #000; | |||||
| } | |||||
| .price { | |||||
| color: #D03F25; | |||||
| margin-top: 6rpx; | |||||
| .price { | |||||
| color: #D03F25; | |||||
| margin-top: 6rpx; | |||||
| text { | |||||
| font-size: 34rpx; | |||||
| font-weight: 900; | |||||
| } | |||||
| } | |||||
| text { | |||||
| font-size: 34rpx; | |||||
| font-weight: 900; | |||||
| } | |||||
| } | |||||
| .favorable { | |||||
| display: flex; | |||||
| background-image: url(/static/image/product/favorable.png); | |||||
| background-size: 100% 100%; | |||||
| width: fit-content; | |||||
| padding: 5rpx 10rpx; | |||||
| font-size: 18rpx; | |||||
| margin-top: 6rpx; | |||||
| .favorable { | |||||
| display: flex; | |||||
| background-image: url(/static/image/product/favorable.png); | |||||
| background-size: 100% 100%; | |||||
| width: fit-content; | |||||
| padding: 5rpx 10rpx; | |||||
| font-size: 18rpx; | |||||
| margin-top: 6rpx; | |||||
| .p { | |||||
| color: #fff; | |||||
| margin-left: 10rpx; | |||||
| } | |||||
| } | |||||
| .p { | |||||
| color: #fff; | |||||
| margin-left: 10rpx; | |||||
| } | |||||
| } | |||||
| .num { | |||||
| margin-top: 6rpx; | |||||
| font-size: 22rpx; | |||||
| color: #888; | |||||
| } | |||||
| } | |||||
| .num { | |||||
| margin-top: 6rpx; | |||||
| font-size: 22rpx; | |||||
| color: #888; | |||||
| } | |||||
| } | |||||
| .btn { | |||||
| position: absolute; | |||||
| right: 0rpx; | |||||
| bottom: 0rpx; | |||||
| padding: 10rpx; | |||||
| border-radius: 50%; | |||||
| //background-color: $uni-color; | |||||
| .btn { | |||||
| position: absolute; | |||||
| right: 0rpx; | |||||
| bottom: 0rpx; | |||||
| padding: 10rpx; | |||||
| border-radius: 50%; | |||||
| //background-color: $uni-color; | |||||
| .change { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| border-radius: 40rpx; | |||||
| color: white; | |||||
| font-size: 22rpx; | |||||
| //margin: 20rpx 10rpx 0 0; | |||||
| padding: 10rpx 10rpx; | |||||
| background: #2b467a; | |||||
| border: 1px solid #757986; | |||||
| //margin-top: 20rpx; | |||||
| //border-radius: 40rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| .change { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| border-radius: 40rpx; | |||||
| color: white; | |||||
| font-size: 22rpx; | |||||
| //margin: 20rpx 10rpx 0 0; | |||||
| padding: 10rpx 10rpx; | |||||
| background: #2b467a; | |||||
| border: 1px solid #757986; | |||||
| //margin-top: 20rpx; | |||||
| //border-radius: 40rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | </style> | ||||
+ 0
- 18
pages.json
View File
+ 0
- 259
pages/index/cart.vue
View File
| @ -1,259 +0,0 @@ | |||||
| <template> | |||||
| <view class="page"> | |||||
| <navbar/> | |||||
| <view class="user"> | |||||
| <uv-checkbox-group | |||||
| shape="circle" | |||||
| v-model="checkboxValue"> | |||||
| <uv-swipe-action> | |||||
| <view | |||||
| v-for="(item, index) in list" | |||||
| :key="index"> | |||||
| <view style="margin-top: 20rpx;"></view> | |||||
| <uv-swipe-action-item | |||||
| :options="options"> | |||||
| <view class="item"> | |||||
| <view class="checkbox"> | |||||
| <uv-checkbox | |||||
| :name="item.id" | |||||
| activeColor="#FA5A0A" | |||||
| size="40rpx" | |||||
| icon-size="35rpx" | |||||
| ></uv-checkbox> | |||||
| </view> | |||||
| <image | |||||
| class="image" | |||||
| src="https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg" | |||||
| mode=""></image> | |||||
| <view class="info"> | |||||
| <view class="title"> | |||||
| <view class=""> | |||||
| {{ item.title }} | |||||
| </view> | |||||
| <view class=""> | |||||
| <uv-number-box v-model="item.num" | |||||
| @change="valChange"></uv-number-box> | |||||
| </view> | |||||
| </view> | |||||
| <view class="unit"> | |||||
| 规格：{{ item.unit }} | |||||
| <uv-icon name="arrow-down"></uv-icon> | |||||
| </view> | |||||
| <view class="price"> | |||||
| ￥<text>{{ item.price }}</text>元 | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </uv-swipe-action-item> | |||||
| </view> | |||||
| </uv-swipe-action> | |||||
| </uv-checkbox-group> | |||||
| <view class="action"> | |||||
| <view class="icon"> | |||||
| <image src="/static/image/cart/1.png" mode=""></image> | |||||
| <view class="num"> | |||||
| {{ checkboxValue.length }} | |||||
| </view> | |||||
| </view> | |||||
| <view class="price"> | |||||
| <view class="count"> | |||||
| 合计 | |||||
| <view class=""> | |||||
| ￥<text>{{ totalPrice }}</text> | |||||
| </view> | |||||
| </view> | |||||
| <view class="text"> | |||||
| 共{{ checkboxValue.length }}件，已享受更低优惠 | |||||
| </view> | |||||
| </view> | |||||
| <view class="btn"> | |||||
| 去结算 | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <tabber select="3" /> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| import tabber from '@/components/base/tabbar.vue' | |||||
| export default { | |||||
| components: { | |||||
| tabber, | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| value : 0, | |||||
| checkboxValue : [], | |||||
| options: [ | |||||
| { | |||||
| text: '删除', | |||||
| style: { | |||||
| backgroundColor: '#FA5A0A' | |||||
| } | |||||
| }, | |||||
| ], | |||||
| list : [ | |||||
| { | |||||
| id : 1, | |||||
| title : '桌布租赁', | |||||
| num : 1, | |||||
| price : 299, | |||||
| unit : '120*40*75【桌子尺寸】', | |||||
| }, | |||||
| { | |||||
| id : 2, | |||||
| title : '桌布租赁', | |||||
| num : 1, | |||||
| price : 299, | |||||
| unit : '120*40*75【桌子尺寸】', | |||||
| }, | |||||
| ], | |||||
| } | |||||
| }, | |||||
| computed: { | |||||
| totalPrice(){ | |||||
| if (!this.checkboxValue.length) { | |||||
| return 0 | |||||
| } | |||||
| let price = 0 | |||||
| this.list.forEach(n => { | |||||
| if(this.checkboxValue.includes(n.id)){ | |||||
| price += n.price * n.num | |||||
| } | |||||
| }) | |||||
| return price | |||||
| }, | |||||
| }, | |||||
| methods: { | |||||
| valChange(){ | |||||
| }, | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="scss"> | |||||
| .page { | |||||
| padding-bottom: 200rpx; | |||||
| /deep/ .uv-swipe-action{ | |||||
| width: 100%; | |||||
| } | |||||
| } | |||||
| .user { | |||||
| .item{ | |||||
| background-color: #fff; | |||||
| display: flex; | |||||
| padding: 30rpx; | |||||
| .checkbox{ | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| } | |||||
| .image{ | |||||
| width: 200rpx; | |||||
| height: 200rpx; | |||||
| border-radius: 20rpx; | |||||
| } | |||||
| .info{ | |||||
| flex: 1; | |||||
| .title{ | |||||
| display: flex; | |||||
| padding: 10rpx 20rpx; | |||||
| justify-content: space-between; | |||||
| } | |||||
| .unit{ | |||||
| font-size: 24rpx; | |||||
| padding: 10rpx 20rpx; | |||||
| color: #717171; | |||||
| display: flex; | |||||
| align-items: center; | |||||
| } | |||||
| .price{ | |||||
| color: $uni-color; | |||||
| font-size: 28rpx; | |||||
| padding: 10rpx 20rpx; | |||||
| text{ | |||||
| font-size: 36rpx; | |||||
| font-weight: 900; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| .action{ | |||||
| width: 700rpx; | |||||
| position: fixed; | |||||
| bottom: 220rpx; | |||||
| left: 25rpx; | |||||
| background-color: #fff; | |||||
| height: 100rpx; | |||||
| border-radius: 50rpx; | |||||
| box-shadow: 0 0 6rpx 6rpx #00000010; | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| overflow: hidden; | |||||
| .icon{ | |||||
| position: relative; | |||||
| width: 80rpx; | |||||
| height: 80rpx; | |||||
| margin: 0 20rpx; | |||||
| image{ | |||||
| width: 80rpx; | |||||
| height: 80rpx; | |||||
| } | |||||
| .num{ | |||||
| position: absolute; | |||||
| right: 10rpx; | |||||
| top: 0rpx; | |||||
| background-color: $uni-color; | |||||
| color: #fff; | |||||
| font-size: 18rpx; | |||||
| border-radius: 50%; | |||||
| height: 30rpx; | |||||
| width: 30rpx; | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| } | |||||
| } | |||||
| .price{ | |||||
| .count{ | |||||
| display: flex; | |||||
| font-size: 26rpx; | |||||
| align-items: center; | |||||
| view{ | |||||
| color: $uni-color; | |||||
| margin-left: 10rpx; | |||||
| text{ | |||||
| font-size: 32rpx; | |||||
| font-weight: 900; | |||||
| } | |||||
| } | |||||
| } | |||||
| .text{ | |||||
| font-size: 20rpx; | |||||
| color: #717171; | |||||
| } | |||||
| } | |||||
| .btn{ | |||||
| margin-left: auto; | |||||
| background-color: $uni-color; | |||||
| height: 100%; | |||||
| padding: 0 50rpx; | |||||
| color: #fff; | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | |||||
+ 0
- 181
pages/index/category.vue
View File
| @ -1,181 +0,0 @@ | |||||
| <template> | |||||
| <view class="page"> | |||||
| <navbar/> | |||||
| <view class="category"> | |||||
| <uv-vtabs | |||||
| :chain="chain" | |||||
| :list="category" | |||||
| height="1000px" | |||||
| :barItemBadgeStyle="{right:'20px',top:'12px'}" | |||||
| @change="change"> | |||||
| <uv-vtabs-item> | |||||
| <view class="category-title"> | |||||
| 租赁 | |||||
| </view> | |||||
| <view class="list"> | |||||
| <view class="item" v-for="(item,index) in list" :key="index" | |||||
| @click="$utils.navigateTo('/pages_order/product/productDetail?id=123')"> | |||||
| <view class="item-image"> | |||||
| <image | |||||
| :src="item.image" | |||||
| mode="aspectFill"></image> | |||||
| </view> | |||||
| <view class="item-unit"> | |||||
| <text class="text">{{item.unit}}</text> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </uv-vtabs-item> | |||||
| </uv-vtabs> | |||||
| </view> | |||||
| <tabber select="1" /> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| import tabber from '@/components/base/tabbar.vue' | |||||
| export default { | |||||
| components: { | |||||
| tabber, | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| category: [ | |||||
| { | |||||
| name : '桌布' | |||||
| }, | |||||
| { | |||||
| name : '桌布' | |||||
| }, | |||||
| { | |||||
| name : '桌布' | |||||
| }, | |||||
| ], | |||||
| list : [ | |||||
| { | |||||
| unit : '100*50*60', | |||||
| image : 'https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg', | |||||
| }, | |||||
| { | |||||
| unit : '100*50*60', | |||||
| image : 'https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg', | |||||
| }, | |||||
| { | |||||
| unit : '100*50*60', | |||||
| image : 'https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg', | |||||
| }, | |||||
| { | |||||
| unit : '100*50*60', | |||||
| image : 'https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg', | |||||
| }, | |||||
| { | |||||
| unit : '100*50*60', | |||||
| image : 'https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg', | |||||
| }, | |||||
| { | |||||
| unit : '100*50*60', | |||||
| image : 'https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg', | |||||
| }, | |||||
| { | |||||
| unit : '100*50*60', | |||||
| image : 'https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg', | |||||
| }, | |||||
| { | |||||
| unit : '100*50*60', | |||||
| image : 'https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg', | |||||
| }, | |||||
| { | |||||
| unit : '100*50*60', | |||||
| image : 'https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg', | |||||
| }, | |||||
| ], | |||||
| chain: false, | |||||
| value: 0 | |||||
| } | |||||
| }, | |||||
| computed: { | |||||
| list2() { | |||||
| const _list = this.list[this.value]?.childrens; | |||||
| return _list ? _list : []; | |||||
| } | |||||
| }, | |||||
| onReady() { | |||||
| }, | |||||
| methods: { | |||||
| change(index) { | |||||
| console.log('选项改变：', index) | |||||
| this.value = index; | |||||
| } | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="scss"> | |||||
| .category { | |||||
| font-size: 30rpx; | |||||
| color: #333; | |||||
| min-height: 100vh; | |||||
| .category-title{ | |||||
| position: relative; | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| height: 120rpx; | |||||
| &::before, | |||||
| &::after { | |||||
| position: absolute; | |||||
| top: 50%; | |||||
| content: ''; | |||||
| width: 10%; | |||||
| border-top: 2rpx solid black; | |||||
| } | |||||
| &::before { | |||||
| left: 25%; | |||||
| } | |||||
| &::after { | |||||
| right: 25%; | |||||
| } | |||||
| } | |||||
| .list{ | |||||
| display: flex; | |||||
| flex-wrap: wrap; | |||||
| margin: 0 auto; | |||||
| width: 490rpx; | |||||
| .item { | |||||
| padding: 10rpx 20rpx; | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| margin-bottom: 20rpx; | |||||
| .item-image { | |||||
| width: 120rpx; | |||||
| height: 120rpx; | |||||
| image{ | |||||
| height: 100%; | |||||
| width: 100%; | |||||
| border-radius: 50%; | |||||
| } | |||||
| } | |||||
| .item-unit { | |||||
| font-size: 24rpx; | |||||
| margin-top: 15rpx; | |||||
| color: #555; | |||||
| } | |||||
| } | |||||
| .gap { | |||||
| padding: 0 30rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | |||||
+ 0
- 420
pages/index/center.vue
View File
| @ -1,420 +0,0 @@ | |||||
| <template> | |||||
| <view class="page"> | |||||
| <navbar title="个人中心" /> | |||||
| <view class="head"> | |||||
| <view class="headImage"> | |||||
| <image src="" mode=""></image> | |||||
| </view> | |||||
| <view class="info"> | |||||
| <view class="name"> | |||||
| 倾心. | |||||
| </view> | |||||
| <!-- <view class="vip"> | |||||
| VIP1 | |||||
| </view> --> | |||||
| <view class="tips"> | |||||
| 今天是您来的的第32天 | |||||
| </view> | |||||
| </view> | |||||
| <view class="headBtn" @click="headBtn"> | |||||
| 角色切换 | |||||
| </view> | |||||
| <view class="setting"> | |||||
| <uv-icon name="setting" size="40rpx"></uv-icon> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 水洗店 --> | |||||
| <view class="userShop" v-if="userShop"> | |||||
| <userShopCommission /> | |||||
| <view class="userList"> | |||||
| <view class="title"> | |||||
| 我的用户 | |||||
| </view> | |||||
| <view class="list"> | |||||
| <view class="item" v-for="(item, index) in 20" :key="index"> | |||||
| <view class="name"> | |||||
| 客户：王生 | |||||
| </view> | |||||
| <view class="num"> | |||||
| 剩余水洗布：198 | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 酒店 --> | |||||
| <view class="user" v-else> | |||||
| <view class="line"> | |||||
| <view class="item"> | |||||
| <view class="image"> | |||||
| <image src="/static/image/center/1.png" mode=""></image> | |||||
| </view> | |||||
| <view class=""> | |||||
| 余额￥3000 | |||||
| </view> | |||||
| </view> | |||||
| <view class="item"> | |||||
| <view class="image"> | |||||
| <image src="/static/image/center/4.png" mode=""></image> | |||||
| </view> | |||||
| <view class=""> | |||||
| 押金￥30000 | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <view class="line grid"> | |||||
| <view class="title"> | |||||
| 常用功能 | |||||
| </view> | |||||
| <uv-grid :col="4" :border="false"> | |||||
| <uv-grid-item @click="$utils.navigateTo('/pages_order/mine/address')"> | |||||
| <image class="image" src="/static/image/center/7.png" mode=""></image> | |||||
| <text class="grid-text">地址管理</text> | |||||
| </uv-grid-item> | |||||
| <uv-grid-item @click="$utils.redirectTo('/index/order')"> | |||||
| <image class="image" src="/static/image/center/8.png" mode=""></image> | |||||
| <text class="grid-text">订单管理</text> | |||||
| </uv-grid-item> | |||||
| <uv-grid-item @click="$utils.navigateTo('/pages_order/order/refundsOrExchange?index='+0)"> | |||||
| <image class="image" src="/static/image/center/5.png" mode=""></image> | |||||
| <text class="grid-text">换货</text> | |||||
| </uv-grid-item> | |||||
| <uv-grid-item @click="$utils.navigateTo('/pages_order/order/refundsOrExchange?index='+1)"> | |||||
| <image class="image" src="/static/image/center/7.png" mode=""></image> | |||||
| <text class="grid-text">退货</text> | |||||
| </uv-grid-item> | |||||
| </uv-grid> | |||||
| </view> | |||||
| <view class="line grid"> | |||||
| <uv-grid :col="4" :border="false"> | |||||
| <uv-grid-item @click="contactUs"> | |||||
| <image class="image" src="/static/image/center/9.png" mode=""></image> | |||||
| <text class="grid-text">联系客服</text> | |||||
| </uv-grid-item> | |||||
| <uv-grid-item> | |||||
| <image class="image" src="/static/image/center/6.png" mode=""></image> | |||||
| <text class="grid-text">我的租赁</text> | |||||
| </uv-grid-item> | |||||
| <uv-grid-item @click="$utils.redirectTo('/index/cart')"> | |||||
| <image class="image" src="/static/image/center/7.png" mode=""></image> | |||||
| <text class="grid-text">租赁车</text> | |||||
| </uv-grid-item> | |||||
| <uv-grid-item | |||||
| @click="$utils.navigateTo('/pages_order/auth/loginAndRegisterAndForgetPassword?index='+2)"> | |||||
| <image class="image" src="/static/image/center/7.png" mode=""></image> | |||||
| <text class="grid-text">申请成为水洗店</text> | |||||
| </uv-grid-item> | |||||
| </uv-grid> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 联系客服弹框 --> | |||||
| <uv-overlay :show="show" @click="show = false"> | |||||
| <view class="warp"> | |||||
| <view class="rect" @tap.stop> | |||||
| <view class="title">联系客服</view> | |||||
| <view class="center">确定拨打客服电话?</view> | |||||
| <view class="bottom"> | |||||
| <view> | |||||
| <uv-button type="info" shape="circle" text="取消" :custom-style="customStyle1" | |||||
| @click="cancle"></uv-button> | |||||
| </view> | |||||
| <view> | |||||
| <uv-button type="info" shape="circle" text="确定" :custom-style="customStyle2" | |||||
| @click="confirm"></uv-button> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </uv-overlay> | |||||
| <tabber select="4" /> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| import tabber from '@/components/base/tabbar.vue' | |||||
| import { | |||||
| mapGetters | |||||
| } from 'vuex' | |||||
| import userShopCommission from '@/components/userShop/userShopCommission.vue' | |||||
| export default { | |||||
| components: { | |||||
| tabber, | |||||
| userShopCommission, | |||||
| }, | |||||
| computed: { | |||||
| ...mapGetters(['userShop']), | |||||
| customStyle1() { | |||||
| return { | |||||
| height: '60rpx', | |||||
| background: '#FFF', | |||||
| color: '#000000', | |||||
| fontSize: '36rpx', | |||||
| borderRadius: '40rpx', //圆角 | |||||
| // nvue中必须是下方的写法 | |||||
| 'border-top-right-radius': '40rpx', | |||||
| 'border-bottom-left-radius': '40rpx', | |||||
| 'border-bottom-right-radius': '40rpx', | |||||
| 'width': '150rpx', | |||||
| } | |||||
| }, | |||||
| customStyle2() { | |||||
| return { | |||||
| height: '60rpx', | |||||
| background: '#fd5100', | |||||
| color: '#FFF', | |||||
| fontSize: '34px', | |||||
| borderRadius: '40rpx', //圆角 | |||||
| // nvue中必须是下方的写法 | |||||
| 'border-top-right-radius': '40rpx', | |||||
| 'border-bottom-left-radius': '40rpx', | |||||
| 'border-bottom-right-radius': '40rpx', | |||||
| 'width': '150rpx', | |||||
| } | |||||
| } | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| show: false, | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| headBtn() { | |||||
| let self = this | |||||
| uni.showModal({ | |||||
| title: '演示切换角色之后的效果', | |||||
| success(res) { | |||||
| if (res.confirm) { | |||||
| self.$store.state.shop = !self.$store.state.shop | |||||
| } | |||||
| } | |||||
| }) | |||||
| }, | |||||
| // 联系客服按钮回调 | |||||
| contactUs() { | |||||
| this.show = true | |||||
| }, | |||||
| confirm() { | |||||
| this.show = false | |||||
| }, | |||||
| cancle() { | |||||
| this.show = false | |||||
| }, | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="scss"> | |||||
| .page { | |||||
| .warp { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| height: 100%; | |||||
| } | |||||
| .rect { | |||||
| width: 600rpx; | |||||
| height: 300rpx; | |||||
| background-color: #fff; | |||||
| border-radius: 20rpx; | |||||
| overflow: hidden; | |||||
| .title { | |||||
| padding: 10rpx 0 0 15rpx; | |||||
| background-color: #fd5100; | |||||
| color: #FFF; | |||||
| text-align: left; | |||||
| width: 100%; | |||||
| height: 18%; | |||||
| font-size: 36rpx; | |||||
| } | |||||
| .center { | |||||
| height: 40%; | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| font-size: 36rpx; | |||||
| } | |||||
| .bottom { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| gap: 50rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| image { | |||||
| width: 100%; | |||||
| height: 100%; | |||||
| } | |||||
| .head { | |||||
| display: flex; | |||||
| background-color: #fff; | |||||
| padding: 40rpx 20rpx; | |||||
| align-items: center; | |||||
| position: relative; | |||||
| .headImage { | |||||
| width: 120rpx; | |||||
| height: 120rpx; | |||||
| background-image: url(/static/image/center/3.png); | |||||
| background-size: 100% 100%; | |||||
| overflow: hidden; | |||||
| border-radius: 50%; | |||||
| margin-right: 40rpx; | |||||
| } | |||||
| .info { | |||||
| font-size: 28rpx; | |||||
| .vip { | |||||
| background-color: #FCCC92; | |||||
| color: #FA6239; | |||||
| width: 100rpx; | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| height: 40rpx; | |||||
| border-radius: 20rpx; | |||||
| margin-top: 20rpx; | |||||
| } | |||||
| .name { | |||||
| font-size: 32rpx; | |||||
| } | |||||
| .tips { | |||||
| font-size: 26rpx; | |||||
| color: #ABABAB; | |||||
| } | |||||
| } | |||||
| .headBtn { | |||||
| margin-left: auto; | |||||
| padding: 15rpx 20rpx; | |||||
| background-color: $uni-color; | |||||
| color: #fff; | |||||
| border-radius: 20rpx; | |||||
| margin-top: 50rpx; | |||||
| } | |||||
| .setting { | |||||
| position: absolute; | |||||
| right: 50rpx; | |||||
| top: 50rpx; | |||||
| } | |||||
| } | |||||
| .userShop { | |||||
| .userList { | |||||
| .title { | |||||
| font-size: 32rpx; | |||||
| font-weight: 900; | |||||
| padding: 20rpx; | |||||
| } | |||||
| .list { | |||||
| display: flex; | |||||
| flex-wrap: wrap; | |||||
| .item { | |||||
| width: 270rpx; | |||||
| margin: 20rpx; | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| padding: 40rpx 30rpx; | |||||
| background-color: #fff; | |||||
| border-radius: 30rpx; | |||||
| line-height: 60rpx; | |||||
| .name {} | |||||
| .num { | |||||
| color: $uni-color; | |||||
| font-weight: 600; | |||||
| font-size: 28rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| .user { | |||||
| .line { | |||||
| display: flex; | |||||
| background-color: #fff; | |||||
| margin-top: 20rpx; | |||||
| padding: 20rpx 0; | |||||
| .item { | |||||
| flex: 1; | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| padding: 20rpx 0; | |||||
| &:nth-child(1) { | |||||
| border-right: 1px solid #00000013; | |||||
| } | |||||
| .image { | |||||
| width: 100rpx; | |||||
| height: 70rpx; | |||||
| margin-right: 20rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| .grid { | |||||
| flex-direction: column; | |||||
| font-size: 26rpx; | |||||
| padding: 20rpx; | |||||
| .title { | |||||
| margin-bottom: 30rpx; | |||||
| font-size: 28rpx; | |||||
| font-weight: 600; | |||||
| } | |||||
| .image { | |||||
| width: 70rpx; | |||||
| height: 70rpx; | |||||
| margin-bottom: 10rpx; | |||||
| } | |||||
| text { | |||||
| text-align: center; | |||||
| width: 120rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | |||||
+ 5
- 0
pages/index/index.vue
View File
+ 174
- 156
pages/index/tradingPlatform.vue
View File
| @ -1,164 +1,182 @@ | |||||
| <template> | <template> | ||||
| <view class="trading-platform"> | |||||
| <topbar showRight="0"></topbar> | |||||
| <view class="frame"> | |||||
| <!--顶部栏--> | |||||
| <!--折线图--> | |||||
| <view class="chart"> | |||||
| 折线图 | |||||
| </view> | |||||
| <!-- 供应商 --> | |||||
| <view class="supplier" v-if="userShop"> | |||||
| <view style="" class="purchaser-title"> | |||||
| <span class="active"> {{ $t('other.orderList') }}</span> | |||||
| </view> | |||||
| <view class="supplierList"> | |||||
| <orderList :orderList="list.records"/> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 采购商 --> | |||||
| <view class="purchaser" v-else> | |||||
| <view style="" class="purchaser-title"> | |||||
| <span @click="actionIndexChange(0)" :class="actionIndex==0?'active':'noactive'">{{ $t('other.spotTrading') }}</span> | |||||
| <span @click="actionIndexChange(1)" :class="actionIndex==1?'active':'noactive'">{{ $t('other.futuresTrading') }}</span> | |||||
| </view> | |||||
| <view class="productList"> | |||||
| <productList :productList="list.records"/> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <tabber select="1"/> | |||||
| </view> | |||||
| <view class="trading-platform"> | |||||
| <topbar showRight="0"></topbar> | |||||
| <view class="frame"> | |||||
| <!--顶部栏--> | |||||
| <!--折线图--> | |||||
| <view class="chart"> | |||||
| 折线图 | |||||
| </view> | |||||
| <!-- 供应商 --> | |||||
| <view class="supplier" v-if="userShop"> | |||||
| <view style="" class="purchaser-title"> | |||||
| <span class="active"> {{ $t('other.orderList') }}</span> | |||||
| </view> | |||||
| <view class="supplierList"> | |||||
| <orderList :orderList="list" /> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 采购商 --> | |||||
| <view class="purchaser" v-else> | |||||
| <view style="" class="purchaser-title"> | |||||
| <span @click="actionIndexChange(index)" | |||||
| v-for="(item, index) in type" | |||||
| :class="actionIndex == index ? 'active' : 'noactive'">{{ item.name }}</span> | |||||
| <!-- <span @click="actionIndexChange(index)" | |||||
| :class="actionIndex==index?'active':'noactive'">{{ $t('other.futuresTrading') }}</span> --> | |||||
| </view> | |||||
| <view class="productList"> | |||||
| <productList :list="list" /> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <tabber select="1" /> | |||||
| </view> | |||||
| </template> | </template> | ||||
| <script> | <script> | ||||
| import tabber from '@/components/base/tabbar.vue' | |||||
| import topbar from "@/components/base/topbar.vue"; | |||||
| import {mapGetters} from 'vuex' | |||||
| import ProductList from "@/components/user/productList.vue"; | |||||
| import OrderList from "@/pages_order/components/order/orderList.vue"; | |||||
| export default { | |||||
| components: { | |||||
| OrderList, | |||||
| ProductList, | |||||
| topbar, | |||||
| tabber, | |||||
| }, | |||||
| computed: { | |||||
| ...mapGetters(['userShop']), | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| list: { | |||||
| records: [ | |||||
| {} | |||||
| ], | |||||
| total: 0, | |||||
| }, | |||||
| actionIndex: 0, | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| // 切换tab | |||||
| actionIndexChange(index) { | |||||
| // index为0时切换到现货交易，index为1时切换到期货交易 | |||||
| this.actionIndex = index; | |||||
| }, | |||||
| } | |||||
| } | |||||
| import tabber from '@/components/base/tabbar.vue' | |||||
| import topbar from "@/components/base/topbar.vue"; | |||||
| import { | |||||
| mapGetters | |||||
| } from 'vuex' | |||||
| import ProductList from "@/components/user/productList.vue"; | |||||
| import OrderList from "@/pages_order/components/order/orderList.vue"; | |||||
| import mixinList from '@/mixins/list.js' | |||||
| export default { | |||||
| mixins : [mixinList], | |||||
| components: { | |||||
| OrderList, | |||||
| ProductList, | |||||
| topbar, | |||||
| tabber, | |||||
| }, | |||||
| computed: { | |||||
| ...mapGetters(['userShop']), | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| actionIndex: 0, | |||||
| mixinsListApi : 'getMyProductlist', | |||||
| type : [ | |||||
| { | |||||
| name : this.$t('other.spotTrading') | |||||
| }, | |||||
| { | |||||
| name : this.$t('other.futuresTrading') | |||||
| }, | |||||
| ], | |||||
| } | |||||
| }, | |||||
| onLoad() { | |||||
| if(this.userShop){ | |||||
| this.mixinsListApi = 'getMyProductlist' | |||||
| }else{ | |||||
| this.mixinsListApi = 'productlist' | |||||
| this.queryParams.productType = this.actionIndex | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| // 切换tab | |||||
| actionIndexChange(index) { | |||||
| // index为0时切换到现货交易，index为1时切换到期货交易 | |||||
| this.actionIndex = index; | |||||
| this.queryParams.productType = this.actionIndex | |||||
| this.getData() | |||||
| }, | |||||
| } | |||||
| } | |||||
| </script> | </script> | ||||
| <style scoped lang="scss"> | <style scoped lang="scss"> | ||||
| .trading-platform { | |||||
| .frame { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| justify-content: center; | |||||
| height: calc(100vh - 120rpx - 120rpx); | |||||
| .chart { | |||||
| height: 30%; | |||||
| } | |||||
| .supplier { | |||||
| height: 70%; | |||||
| padding: 20rpx 20rpx; | |||||
| background-image: url('../../static/image/index/1.png'); | |||||
| color: #FFF; | |||||
| font-size: 32rpx; | |||||
| .supplierList { | |||||
| margin-top: 20rpx; | |||||
| height: 92%; | |||||
| overflow: auto; | |||||
| } | |||||
| .purchaser-title { | |||||
| height: 8%; | |||||
| .active { | |||||
| text-decoration: underline; | |||||
| width: 80rpx; | |||||
| margin: 20rpx 20rpx 20rpx 20rpx; | |||||
| padding: 10rpx 20rpx; | |||||
| } | |||||
| .noactive { | |||||
| width: 80rpx; | |||||
| margin: 20rpx 20rpx 20rpx 20rpx; | |||||
| padding: 10rpx 20rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| .purchaser { | |||||
| height: 60%; | |||||
| padding: 20rpx 0; | |||||
| background-image: url('../../static/image/index/1.png'); | |||||
| color: #FFF; | |||||
| font-size: 32rpx; | |||||
| .purchaser-title { | |||||
| .active { | |||||
| text-decoration: underline; | |||||
| width: 80rpx; | |||||
| margin: 20rpx 20rpx 20rpx 20rpx; | |||||
| padding: 10rpx 20rpx; | |||||
| } | |||||
| .noactive { | |||||
| width: 80rpx; | |||||
| margin: 20rpx 20rpx 20rpx 20rpx; | |||||
| padding: 10rpx 20rpx; | |||||
| } | |||||
| } | |||||
| .productList { | |||||
| margin-top: 20rpx; | |||||
| height: 60vh; | |||||
| overflow: auto; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| .trading-platform { | |||||
| .frame { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| justify-content: center; | |||||
| height: calc(100vh - 120rpx - 120rpx); | |||||
| .chart { | |||||
| height: 30%; | |||||
| } | |||||
| .supplier { | |||||
| height: 70%; | |||||
| padding: 20rpx 20rpx; | |||||
| background-image: url('../../static/image/index/1.png'); | |||||
| color: #FFF; | |||||
| font-size: 32rpx; | |||||
| .supplierList { | |||||
| margin-top: 20rpx; | |||||
| height: 92%; | |||||
| overflow: auto; | |||||
| } | |||||
| .purchaser-title { | |||||
| height: 8%; | |||||
| .active { | |||||
| text-decoration: underline; | |||||
| width: 80rpx; | |||||
| margin: 20rpx 20rpx 20rpx 20rpx; | |||||
| padding: 10rpx 20rpx; | |||||
| } | |||||
| .noactive { | |||||
| width: 80rpx; | |||||
| margin: 20rpx 20rpx 20rpx 20rpx; | |||||
| padding: 10rpx 20rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| .purchaser { | |||||
| height: 60%; | |||||
| padding: 20rpx 0; | |||||
| background-image: url('../../static/image/index/1.png'); | |||||
| color: #FFF; | |||||
| font-size: 32rpx; | |||||
| .purchaser-title { | |||||
| .active { | |||||
| text-decoration: underline; | |||||
| width: 80rpx; | |||||
| margin: 20rpx 20rpx 20rpx 20rpx; | |||||
| padding: 10rpx 20rpx; | |||||
| } | |||||
| .noactive { | |||||
| width: 80rpx; | |||||
| margin: 20rpx 20rpx 20rpx 20rpx; | |||||
| padding: 10rpx 20rpx; | |||||
| } | |||||
| } | |||||
| .productList { | |||||
| margin-top: 20rpx; | |||||
| height: 60vh; | |||||
| overflow: auto; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | </style> | ||||
+ 75
- 76
pages_order/auth/selectionIdentity.vue
View File
| @ -1,94 +1,93 @@ | |||||
| <template> | <template> | ||||
| <view> | |||||
| <view> | |||||
| <navbar :title="$t('pageTitle.selectIdentity')" leftClick @leftClick="$utils.navigateBack"/> | |||||
| <navbar :title="$t('pageTitle.selectIdentity')" | |||||
| :leftClick="!$route.query.back" @leftClick="$utils.navigateBack" /> | |||||
| <view class="container"> | |||||
| <view class="container"> | |||||
| <view class="title">{{ $t('components.selectIdentity') }}</view> | |||||
| <view class="button-group"> | |||||
| <!--供应商--> | |||||
| <view class="identity-button" @click="selectIdentity(0)"> | |||||
| <view class="identity-text"> {{ $t('other.iAmBuyer') }}</view> | |||||
| <view class="identity-icon"> | |||||
| <img src="../../static/image/index/5.png" style="width: 100%; height: 100%;"> | |||||
| </view> | |||||
| </view> | |||||
| <!--采购--> | |||||
| <view class="identity-button" @click="selectIdentity(1)"> | |||||
| <view class="identity-text"> {{ $t('other.iAmSupplier') }}</view> | |||||
| <view class="identity-icon"> | |||||
| <img src="../../static/image/index/6.png" style="width: 100%; height: 100%;"> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <view class="title">{{ $t('components.selectIdentity') }}</view> | |||||
| <view class="button-group"> | |||||
| <!--供应商--> | |||||
| <view class="identity-button" @click="selectIdentity(0)"> | |||||
| <view class="identity-text"> {{ $t('other.iAmBuyer') }}</view> | |||||
| <view class="identity-icon"> | |||||
| <img src="../../static/image/index/5.png" style="width: 100%; height: 100%;"> | |||||
| </view> | |||||
| </view> | |||||
| <!--采购--> | |||||
| <view class="identity-button" @click="selectIdentity(1)"> | |||||
| <view class="identity-text"> {{ $t('other.iAmSupplier') }}</view> | |||||
| <view class="identity-icon"> | |||||
| <img src="../../static/image/index/6.png" style="width: 100%; height: 100%;"> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </template> | </template> | ||||
| <script> | <script> | ||||
| export default { | |||||
| methods: { | |||||
| selectIdentity(identity) { | |||||
| uni.navigateTo({ | |||||
| url: `/pages_order/auth/registerShop?identity=${identity}` | |||||
| }) | |||||
| }, | |||||
| } | |||||
| } | |||||
| export default { | |||||
| methods: { | |||||
| selectIdentity(identity) { | |||||
| uni.navigateTo({ | |||||
| url: `/pages_order/auth/registerShop?identity=${identity}` | |||||
| }) | |||||
| }, | |||||
| } | |||||
| } | |||||
| </script> | </script> | ||||
| <style scoped lang="scss"> | <style scoped lang="scss"> | ||||
| * { | |||||
| box-sizing: border-box; | |||||
| } | |||||
| * { | |||||
| box-sizing: border-box; | |||||
| } | |||||
| .container { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| //height: 100vh; | |||||
| background-color: #f5f5f5; | |||||
| .container { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| //height: 100vh; | |||||
| background-color: #f5f5f5; | |||||
| .title { | |||||
| font-size: 40rpx; | |||||
| color: #333; | |||||
| margin: 80rpx 0; | |||||
| } | |||||
| .title { | |||||
| font-size: 40rpx; | |||||
| color: #333; | |||||
| margin: 80rpx 0; | |||||
| } | |||||
| .button-group { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| .button-group { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| width: 100vw; | |||||
| //padding: 0 20px; | |||||
| width: 100vw; | |||||
| //padding: 0 20px; | |||||
| .identity-button { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: space-between; | |||||
| width: 80%; | |||||
| margin-bottom: 40rpx; | |||||
| padding: 40rpx 50rpx; | |||||
| background-color: #2d2f59; | |||||
| border-radius: 20rpx; | |||||
| color: white; | |||||
| .identity-button { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: space-between; | |||||
| width: 80%; | |||||
| margin-bottom: 40rpx; | |||||
| padding: 40rpx 50rpx; | |||||
| background-color: #2d2f59; | |||||
| border-radius: 20rpx; | |||||
| color: white; | |||||
| .identity-text { | |||||
| font-size: 40rpx; | |||||
| } | |||||
| .identity-text { | |||||
| font-size: 40rpx; | |||||
| } | |||||
| .identity-icon { | |||||
| width: 130rpx; | |||||
| height: 130rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | |||||
| .identity-icon { | |||||
| width: 130rpx; | |||||
| height: 130rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | |||||
+ 159
- 125
pages_order/center/systemSet.vue
View File
| @ -1,133 +1,167 @@ | |||||
| <template> | <template> | ||||
| <view class="page"> | |||||
| <navbar :title="$t('pageTitle.systemSettings')" leftClick @leftClick="$utils.navigateBack"/> | |||||
| <view class="frame"> | |||||
| <view class="content" v-for="(item, index) in list" :key="index"> | |||||
| <view class="title">{{ item.title }}</view> | |||||
| <view class="item" v-for="(item2, index) in item.itemList" :key="index" @click="tapItem(item2, index)"> | |||||
| <view class="key"> | |||||
| <view class="img"> | |||||
| <img :src="item2.leftIcon" style="width: 100%; height: 100%;"/> | |||||
| </view> | |||||
| <view class="text"> | |||||
| {{ item2.text }} | |||||
| </view> | |||||
| </view> | |||||
| <view class="value"> | |||||
| {{ item.rightIcon }} | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 语言切换 --> | |||||
| <!--<view style="padding: 20rpx;"--> | |||||
| <!-- @click="$refs.changeLanguage.open()">--> | |||||
| <!-- {{ $t('pages.index.index.language') }}--> | |||||
| <!--</view>--> | |||||
| <changeLanguage ref="changeLanguage"/> | |||||
| </view> | |||||
| <view class="page"> | |||||
| <navbar :title="$t('pageTitle.systemSettings')" leftClick @leftClick="$utils.navigateBack" /> | |||||
| <view class="frame"> | |||||
| <view class="content" v-for="(item, index) in list" :key="index"> | |||||
| <view class="title">{{ item.title }}</view> | |||||
| <view class="item" v-for="(item2, index) in item.itemList" :key="index" @click="tapItem(item2, index)"> | |||||
| <view class="key"> | |||||
| <view class="img"> | |||||
| <img :src="item2.leftIcon" style="width: 100%; height: 100%;" /> | |||||
| </view> | |||||
| <view class="text"> | |||||
| {{ item2.text }} | |||||
| </view> | |||||
| </view> | |||||
| <view class="value"> | |||||
| {{ item.rightIcon }} | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 语言切换 --> | |||||
| <!--<view style="padding: 20rpx;"--> | |||||
| <!-- @click="$refs.changeLanguage.open()">--> | |||||
| <!-- {{ $t('pages.index.index.language') }}--> | |||||
| <!--</view>--> | |||||
| <changeLanguage ref="changeLanguage" /> | |||||
| </view> | |||||
| </template> | </template> | ||||
| <script> | <script> | ||||
| import topbar from "@/components/base/topbar.vue"; | |||||
| import tabber from "@/components/base/tabbar.vue"; | |||||
| import ChangeLanguage from "@/components/base/changeLanguage.vue"; | |||||
| export default { | |||||
| name: "systemSet", | |||||
| components: {ChangeLanguage, tabber, topbar}, | |||||
| data() { | |||||
| return { | |||||
| list: [ | |||||
| { | |||||
| title: `${this.$t('pageTitle.accountSetting')}`, | |||||
| itemList: [ | |||||
| // text: `${this.$t('pageTitle.switchAccount')}` | |||||
| {leftIcon: "../static/center/1.svg", text: `${this.$t('pageTitle.switchAccount')}`, rightIcon: ">"}, | |||||
| {leftIcon: "../static/center/2.svg", text: `${this.$t('pageTitle.forgotPasswordPage')}`, rightIcon: ">"}, | |||||
| {leftIcon: "../static/center/2.svg", text: this.$t('pageTitle.logout'), rightIcon: ">"}, | |||||
| ] | |||||
| }, | |||||
| { | |||||
| title: `${this.$t('pageTitle.systemSetting')}`, | |||||
| itemList: [ | |||||
| {leftIcon: "../static/center/1.svg", text: `${this.$t('pageTitle.languageSwitch')}`, rightIcon: ">"}, | |||||
| {leftIcon: "../static/center/2.svg", text: `${this.$t('pageTitle.versionUpdate')}`, rightIcon: ">"}, | |||||
| {leftIcon: "../static/center/2.svg", text: this.$t('pageTitle.clearCache'), rightIcon: ">"}, | |||||
| ] | |||||
| }, | |||||
| { | |||||
| title: `${this.$t('pageTitle.identitySetting')}`, | |||||
| itemList: [ | |||||
| {leftIcon: "../static/center/2.svg", text: this.$t('pageTitle.switchIdentity'), rightIcon: ">"}, | |||||
| ] | |||||
| } | |||||
| ], | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| tapItem(item, index) { | |||||
| if (item.text === this.$t('pageTitle.languageSwitch')) { | |||||
| this.$refs.changeLanguage.open(); | |||||
| } | |||||
| } | |||||
| }, | |||||
| } | |||||
| import topbar from "@/components/base/topbar.vue"; | |||||
| import tabber from "@/components/base/tabbar.vue"; | |||||
| import ChangeLanguage from "@/components/base/changeLanguage.vue"; | |||||
| export default { | |||||
| name: "systemSet", | |||||
| components: { | |||||
| ChangeLanguage, | |||||
| tabber, | |||||
| topbar | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| list: [{ | |||||
| title: `${this.$t('pageTitle.accountSetting')}`, | |||||
| itemList: [ | |||||
| // text: `${this.$t('pageTitle.switchAccount')}` | |||||
| { | |||||
| leftIcon: "../static/center/1.svg", | |||||
| text: `${this.$t('pageTitle.switchAccount')}`, | |||||
| rightIcon: ">" | |||||
| }, | |||||
| { | |||||
| leftIcon: "../static/center/2.svg", | |||||
| text: `${this.$t('pageTitle.forgotPasswordPage')}`, | |||||
| rightIcon: ">" | |||||
| }, | |||||
| { | |||||
| leftIcon: "../static/center/2.svg", | |||||
| text: this.$t('pageTitle.logout'), | |||||
| rightIcon: ">", | |||||
| type : 'logout', | |||||
| }, | |||||
| ] | |||||
| }, | |||||
| { | |||||
| title: `${this.$t('pageTitle.systemSetting')}`, | |||||
| itemList: [{ | |||||
| leftIcon: "../static/center/1.svg", | |||||
| text: `${this.$t('pageTitle.languageSwitch')}`, | |||||
| rightIcon: ">" | |||||
| }, | |||||
| { | |||||
| leftIcon: "../static/center/2.svg", | |||||
| text: `${this.$t('pageTitle.versionUpdate')}`, | |||||
| rightIcon: ">" | |||||
| }, | |||||
| { | |||||
| leftIcon: "../static/center/2.svg", | |||||
| text: this.$t('pageTitle.clearCache'), | |||||
| rightIcon: ">" | |||||
| }, | |||||
| ] | |||||
| }, | |||||
| { | |||||
| title: `${this.$t('pageTitle.identitySetting')}`, | |||||
| itemList: [{ | |||||
| leftIcon: "../static/center/2.svg", | |||||
| text: this.$t('pageTitle.switchIdentity'), | |||||
| rightIcon: ">" | |||||
| }, ] | |||||
| } | |||||
| ], | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| tapItem(item, index) { | |||||
| if (item.text === this.$t('pageTitle.languageSwitch')) { | |||||
| this.$refs.changeLanguage.open(); | |||||
| }else if(item.type){ | |||||
| this[item.type]() | |||||
| } | |||||
| }, | |||||
| logout(){ | |||||
| this.$store.commit('logout') | |||||
| }, | |||||
| }, | |||||
| } | |||||
| </script> | </script> | ||||
| <style scoped lang="scss"> | <style scoped lang="scss"> | ||||
| .page { | |||||
| background-color: #FFF; | |||||
| height: 100vh; | |||||
| .frame { | |||||
| padding: 40rpx; | |||||
| .content { | |||||
| margin-bottom: 40rpx; | |||||
| .title { | |||||
| font-size: 30rpx; | |||||
| color: #b0b0b0; | |||||
| } | |||||
| .item { | |||||
| display: flex; | |||||
| justify-content: space-between; | |||||
| align-items: center; | |||||
| padding: 20rpx 40rpx; | |||||
| .key { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| color: #333333; | |||||
| font-size: 32rpx; | |||||
| .img { | |||||
| width: 40rpx; | |||||
| height: 40rpx; | |||||
| } | |||||
| .text { | |||||
| margin-left: 20rpx; | |||||
| } | |||||
| } | |||||
| .value { | |||||
| color: #999999; | |||||
| font-size: 36rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| .page { | |||||
| background-color: #FFF; | |||||
| height: 100vh; | |||||
| .frame { | |||||
| padding: 40rpx; | |||||
| .content { | |||||
| margin-bottom: 40rpx; | |||||
| .title { | |||||
| font-size: 30rpx; | |||||
| color: #b0b0b0; | |||||
| } | |||||
| .item { | |||||
| display: flex; | |||||
| justify-content: space-between; | |||||
| align-items: center; | |||||
| padding: 20rpx 40rpx; | |||||
| .key { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| color: #333333; | |||||
| font-size: 32rpx; | |||||
| .img { | |||||
| width: 40rpx; | |||||
| height: 40rpx; | |||||
| } | |||||
| .text { | |||||
| margin-left: 20rpx; | |||||
| } | |||||
| } | |||||
| .value { | |||||
| color: #999999; | |||||
| font-size: 36rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | </style> | ||||
+ 470
- 463
pages_order/tradingPlatform/nowOrder.vue
View File
| @ -1,471 +1,478 @@ | |||||
| <template> | <template> | ||||
| <view class="now-order"> | |||||
| <navbar :title="$t('pageTitle.immediateOrder')" leftClick @leftClick="$utils.navigateBack"/> | |||||
| <view class="frame"> | |||||
| <view class="title"> | |||||
| <span | |||||
| style="width: 10rpx;height: 40rpx;background-color: #1f1c39;border-radius: 10rpx;overflow: hidden;"></span> | |||||
| <span>{{ $t('other.aluminumProducts') }}</span> | |||||
| </view> | |||||
| <view class="basic-info"> | |||||
| <!--商品规格--> | |||||
| <view class="item"> | |||||
| <view>{{ $t('components.productSpe') }}</view> | |||||
| <view> | |||||
| 铝制品(Al>96%) | |||||
| </view> | |||||
| </view> | |||||
| <!--<uv-divider text="" :hairline="true"></uv-divider>--> | |||||
| <!--提货地点--> | |||||
| <view class="currentRegion"> | |||||
| <view>{{ $t('components.pickupLocation') }}</view> | |||||
| <view @click.stop="selectAddr"> | |||||
| <input class="input" | |||||
| disabled | |||||
| v-model="form.currentRegion" placeholder="请选择所在地区"></input> | |||||
| <view class="orientation"> | |||||
| <!-- 定位 --> | |||||
| <img src="../../static/image/address/selectIcon.png" | |||||
| style="width:30rpx;height: 30rpx;margin:5rpx 5rpx 5rpx 5rpx;"> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!--详细地址--> | |||||
| <view class="item"> | |||||
| <view>{{ $t('components.detailedAddress') }}</view> | |||||
| <view> | |||||
| <input v-model="form.address" placeholder="请输入详细地址" clearable></input> | |||||
| </view> | |||||
| </view> | |||||
| <!--交货日期--> | |||||
| <view class="delivery-date"> | |||||
| <view>{{ $t('components.deliveryDate') }}</view> | |||||
| <view class="value"> | |||||
| <view class="dateTimeCls"> | |||||
| <view class="date" @click="startDateOpen"> | |||||
| {{ form.deliveryDate }} | |||||
| <uv-datetime-picker ref="startDateRef" v-model="form.deliveryDate" mode="date" | |||||
| @confirm="startDateChange"></uv-datetime-picker> | |||||
| </view> | |||||
| <view class="img"> | |||||
| > | |||||
| <!--<img src="../static/address/1.svg" style="width: 40rpx;--> | |||||
| <!--height: 40rpx;">--> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!--暂定数量--> | |||||
| <view class="tentativeQuantity"> | |||||
| <view class="key">{{ $t('other.tentativeQuantity') }}</view> | |||||
| <view class="value"> | |||||
| <uv-number-box v-model="form.tentativeQuantity"></uv-number-box> | |||||
| </view> | |||||
| </view> | |||||
| <!--单价--> | |||||
| <view class="item"> | |||||
| <view>{{ $t('components.unitPrice') }}</view> | |||||
| <view> | |||||
| <input v-model="form.price" disabled clearable></input> | |||||
| </view> | |||||
| </view> | |||||
| <!--履约保证金--> | |||||
| <view class="performanceBond"> | |||||
| <view class="key">{{ $t('other.performanceDeposit') }}</view> | |||||
| <view class="value"> | |||||
| <input v-model="form.performanceBond" clearable></input> | |||||
| </view> | |||||
| </view> | |||||
| <view class="Tip"> | |||||
| <span class="span">{{ $t('other.priceQuantityPercentage') }}</span> | |||||
| </view> | |||||
| ‘ | |||||
| <!--立即下单和联系我们--> | |||||
| <view class="btns"> | |||||
| <span @click="ljxd" class="ljxd"> | |||||
| {{ $t('components.immediateOrder') }} | |||||
| </span> | |||||
| <span @click="contactUs" class="lxwm"> | |||||
| {{ $t('components.contactUs') }} | |||||
| </span> | |||||
| <span class="tip">{{ $t('components.contactUsIfAnyProblems') }}</span> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 联系客服弹框 --> | |||||
| <customerServicePopup ref="customerServicePopup" /> | |||||
| </view> | |||||
| <view class="now-order"> | |||||
| <navbar :title="$t('pageTitle.immediateOrder')" leftClick @leftClick="$utils.navigateBack" /> | |||||
| <view class="frame"> | |||||
| <view class="title"> | |||||
| <span | |||||
| style="width: 10rpx;height: 40rpx;background-color: #1f1c39;border-radius: 10rpx;overflow: hidden;"></span> | |||||
| <span>{{ $t('other.aluminumProducts') }}</span> | |||||
| </view> | |||||
| <view class="basic-info"> | |||||
| <!--商品规格--> | |||||
| <view class="item"> | |||||
| <view>{{ $t('components.productSpe') }}</view> | |||||
| <view> | |||||
| 铝制品(Al>96%) | |||||
| </view> | |||||
| </view> | |||||
| <!--<uv-divider text="" :hairline="true"></uv-divider>--> | |||||
| <!--提货地点--> | |||||
| <view class="currentRegion"> | |||||
| <view>{{ $t('components.pickupLocation') }}</view> | |||||
| <!-- <view @click.stop="selectAddr"> | |||||
| <input class="input" disabled v-model="form.currentRegion" placeholder="请选择所在地区"></input> | |||||
| <view class="orientation"> | |||||
| <img src="../../static/image/address/selectIcon.png" | |||||
| style="width:30rpx;height: 30rpx;margin:5rpx 5rpx 5rpx 5rpx;"> | |||||
| </view> | |||||
| </view> --> | |||||
| <view class=""> | |||||
| {{ fatherData.address }} | |||||
| </view> | |||||
| </view> | |||||
| <!--详细地址--> | |||||
| <view class="item"> | |||||
| <view>{{ $t('components.detailedAddress') }}</view> | |||||
| <view> | |||||
| <!-- <input v-model="form.address" placeholder="请输入详细地址" clearable></input> --> | |||||
| </view> | |||||
| </view> | |||||
| <!--交货日期--> | |||||
| <view class="delivery-date"> | |||||
| <view>{{ $t('components.deliveryDate') }}</view> | |||||
| <view class="value"> | |||||
| <view class="dateTimeCls"> | |||||
| <view class="date" @click="startDateOpen"> | |||||
| {{ form.deliveryDate }} | |||||
| <uv-datetime-picker ref="startDateRef" | |||||
| v-model="form.deliveryDate" | |||||
| mode="date" | |||||
| @confirm="startDateChange"></uv-datetime-picker> | |||||
| </view> | |||||
| <view class="img"> | |||||
| > | |||||
| <!--<img src="../static/address/1.svg" style="width: 40rpx;--> | |||||
| <!--height: 40rpx;">--> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!--暂定数量--> | |||||
| <view class="tentativeQuantity"> | |||||
| <view class="key">{{ $t('other.tentativeQuantity') }}</view> | |||||
| <view class="value"> | |||||
| <uv-number-box | |||||
| inputWidth="200rpx" | |||||
| v-model="form.tentativeQuantity" :max="fatherData.num"></uv-number-box> | |||||
| </view> | |||||
| </view> | |||||
| <!--单价--> | |||||
| <view class="item"> | |||||
| <view>{{ $t('components.unitPrice') }}</view> | |||||
| <view> | |||||
| <input v-model="fatherData.price" disabled clearable></input> | |||||
| </view> | |||||
| </view> | |||||
| <!--履约保证金--> | |||||
| <view class="performanceBond"> | |||||
| <view class="key">{{ $t('other.performanceDeposit') }}</view> | |||||
| <view class="value"> | |||||
| <input v-model="form.performanceBond" clearable></input> | |||||
| </view> | |||||
| </view> | |||||
| <view class="Tip"> | |||||
| <span class="span">{{ $t('other.priceQuantityPercentage') }}</span> | |||||
| </view> | |||||
| ‘ | |||||
| <!--立即下单和联系我们--> | |||||
| <view class="btns"> | |||||
| <span @click="ljxd" class="ljxd"> | |||||
| {{ $t('components.immediateOrder') }} | |||||
| </span> | |||||
| <span @click="contactUs" class="lxwm"> | |||||
| {{ $t('components.contactUs') }} | |||||
| </span> | |||||
| <span class="tip">{{ $t('components.contactUsIfAnyProblems') }}</span> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 联系客服弹框 --> | |||||
| <customerServicePopup ref="customerServicePopup" /> | |||||
| </view> | |||||
| </template> | </template> | ||||
| <script> | <script> | ||||
| import topbar from "@/components/base/topbar.vue"; | |||||
| import {mapGetters} from 'vuex' | |||||
| import Position from '@/utils/position.js' | |||||
| import dayjs from "dayjs"; | |||||
| import customerServicePopup from '@/components/config/customerServicePopup.vue' | |||||
| export default { | |||||
| name: "nowOrder", | |||||
| components: { | |||||
| topbar,customerServicePopup, | |||||
| }, | |||||
| computed: { | |||||
| ...mapGetters(['userShop']), | |||||
| }, | |||||
| onLoad(options) { | |||||
| if (options.params) { | |||||
| const fatherData = JSON.parse(decodeURIComponent(options.params)); | |||||
| console.log(fatherData, "fatherData==========") | |||||
| this.fatherData = fatherData; | |||||
| } | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| fatherData: {}, | |||||
| form: { | |||||
| currentRegion: '', | |||||
| address: '', | |||||
| tentativeQuantity: 0, | |||||
| deliveryDate: dayjs(new Date()).format("YYYY-MM-DD"), | |||||
| price: 0, | |||||
| performanceBond: 0, | |||||
| latitude: '', | |||||
| longitude: '', | |||||
| }, | |||||
| phoneNumber: '00000000000' | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| // 立即下单 | |||||
| ljxd() { | |||||
| var itemStr = encodeURIComponent(JSON.stringify(this.form)); | |||||
| uni.navigateTo({ | |||||
| url: `/pages_order/tradingPlatform/confirmOrder?params=${itemStr}`, | |||||
| }); | |||||
| }, | |||||
| // 联系我们 | |||||
| contactUs() { | |||||
| this.$refs.customerServicePopup.open() | |||||
| }, | |||||
| startDateChange(val) { | |||||
| this.$nextTick(() => { | |||||
| this.form.deliveryDate = dayjs(val.value).format("YYYY-MM-DD") | |||||
| }); | |||||
| }, | |||||
| startDateOpen() { | |||||
| this.$refs.startDateRef.open(); | |||||
| }, | |||||
| //地图上选择地址 | |||||
| selectAddr() { | |||||
| Position.getLocation(res => { | |||||
| Position.selectAddress(res.longitude, res.latitude, success => { | |||||
| this.setAddress(success) | |||||
| }) | |||||
| }) | |||||
| Position.getLocationDetail(res => { | |||||
| console.log(res); | |||||
| this.form.address = res | |||||
| }) | |||||
| }, | |||||
| //提取用户选择的地址信息复制给表单数据 | |||||
| setAddress(res) { | |||||
| //经纬度信息 | |||||
| this.form.latitude = res.latitude | |||||
| this.form.longitude = res.longitude | |||||
| if (!res.address && res.name) { //用户直接选择城市的逻辑 | |||||
| return this.form.currentRegion = res.name | |||||
| } | |||||
| if (res.address || res.name) { | |||||
| return this.form.currentRegion = res.address + res.name | |||||
| } | |||||
| this.form.currentRegion = '' //用户啥都没选就点击勾选 | |||||
| }, | |||||
| } | |||||
| } | |||||
| import topbar from "@/components/base/topbar.vue"; | |||||
| import { | |||||
| mapGetters | |||||
| } from 'vuex' | |||||
| import Position from '@/utils/position.js' | |||||
| import dayjs from "dayjs"; | |||||
| import customerServicePopup from '@/components/config/customerServicePopup.vue' | |||||
| export default { | |||||
| name: "nowOrder", | |||||
| components: { | |||||
| topbar, | |||||
| customerServicePopup, | |||||
| }, | |||||
| computed: { | |||||
| ...mapGetters(['userShop']), | |||||
| }, | |||||
| onLoad(options) { | |||||
| if (options.params) { | |||||
| const fatherData = JSON.parse(decodeURIComponent(options.params)); | |||||
| console.log(fatherData, "fatherData==========") | |||||
| this.fatherData = fatherData; | |||||
| } | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| fatherData: {}, | |||||
| form: { | |||||
| currentRegion: '', | |||||
| address: '', | |||||
| tentativeQuantity: 0, | |||||
| deliveryDate: dayjs(new Date()).format("YYYY-MM-DD"), | |||||
| price: 0, | |||||
| performanceBond: 0, | |||||
| latitude: '', | |||||
| longitude: '', | |||||
| }, | |||||
| phoneNumber: '00000000000' | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| // 立即下单 | |||||
| ljxd() { | |||||
| var itemStr = encodeURIComponent(JSON.stringify(this.form)); | |||||
| uni.navigateTo({ | |||||
| url: `/pages_order/tradingPlatform/confirmOrder?params=${itemStr}`, | |||||
| }); | |||||
| }, | |||||
| // 联系我们 | |||||
| contactUs() { | |||||
| this.$refs.customerServicePopup.open() | |||||
| }, | |||||
| startDateChange(val) { | |||||
| this.$nextTick(() => { | |||||
| this.form.deliveryDate = dayjs(val.value).format("YYYY-MM-DD") | |||||
| }); | |||||
| }, | |||||
| startDateOpen() { | |||||
| this.$refs.startDateRef.open(); | |||||
| }, | |||||
| //地图上选择地址 | |||||
| selectAddr() { | |||||
| Position.getLocation(res => { | |||||
| Position.selectAddress(res.longitude, res.latitude, success => { | |||||
| this.setAddress(success) | |||||
| }) | |||||
| }) | |||||
| Position.getLocationDetail(res => { | |||||
| console.log(res); | |||||
| this.form.address = res | |||||
| }) | |||||
| }, | |||||
| //提取用户选择的地址信息复制给表单数据 | |||||
| setAddress(res) { | |||||
| //经纬度信息 | |||||
| this.form.latitude = res.latitude | |||||
| this.form.longitude = res.longitude | |||||
| if (!res.address && res.name) { //用户直接选择城市的逻辑 | |||||
| return this.form.currentRegion = res.name | |||||
| } | |||||
| if (res.address || res.name) { | |||||
| return this.form.currentRegion = res.address + res.name | |||||
| } | |||||
| this.form.currentRegion = '' //用户啥都没选就点击勾选 | |||||
| }, | |||||
| } | |||||
| } | |||||
| </script> | </script> | ||||
| <style scoped lang="scss"> | <style scoped lang="scss"> | ||||
| .now-order { | |||||
| background-color: #FFF; | |||||
| height: 100vh; | |||||
| .frame { | |||||
| .title { | |||||
| display: flex; | |||||
| font-size: 30rpx; | |||||
| font-weight: 700; | |||||
| padding: 0rpx 0 0rpx 20rpx; | |||||
| margin: 20rpx 0 0 0; | |||||
| > span:nth-of-type(1) { | |||||
| margin: 4rpx 0 0 8rpx; | |||||
| background-color: #FFF; | |||||
| } | |||||
| > span:nth-of-type(2) { | |||||
| margin: 0 0 0 8rpx; | |||||
| background-color: #FFF; | |||||
| } | |||||
| } | |||||
| .basic-info { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| gap: 5rpx; | |||||
| background-color: #FFF; | |||||
| //margin-top: 20rpx; | |||||
| padding: 20rpx 20rpx 20rpx 20rpx; | |||||
| .delivery-date { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| background-color: #FFF; | |||||
| height: 80rpx; | |||||
| // margin: 10rpx 0 0 0; | |||||
| padding: 10rpx 0 0 20rpx; | |||||
| > view:nth-of-type(1) { | |||||
| width: 30%; | |||||
| // font-weight: 700; | |||||
| } | |||||
| .value { | |||||
| width: 70%; | |||||
| border-radius: 10rpx; | |||||
| overflow: hidden; | |||||
| .dateTimeCls { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: space-between; | |||||
| width: 100%; | |||||
| height: 80%; | |||||
| //border: 1px solid #b0b2b3; | |||||
| padding: 5rpx; | |||||
| border-radius: 20rpx; | |||||
| .date { | |||||
| font-size: 30rpx; | |||||
| display: flex; | |||||
| align-items: center; | |||||
| width: 80%; | |||||
| height: 100%; | |||||
| color: #000; | |||||
| } | |||||
| .img { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| //margin-left: 50rpx; | |||||
| width: 20%; | |||||
| //height: 100%; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| .tentativeQuantity { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| background-color: #FFF; | |||||
| height: 80rpx; | |||||
| // margin: 10rpx 0 0 0; | |||||
| padding: 10rpx 0 0 20rpx; | |||||
| .key { | |||||
| width: 30%; | |||||
| } | |||||
| .value { | |||||
| width: 70%; | |||||
| border-radius: 10rpx; | |||||
| overflow: hidden; | |||||
| } | |||||
| } | |||||
| .Tip { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| .span { | |||||
| color: #999; | |||||
| font-size: 24rpx; | |||||
| } | |||||
| } | |||||
| .btns { | |||||
| width: 100%; | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| gap: 20rpx; | |||||
| .ljxd { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| width: 500rpx; | |||||
| height: 70rpx; | |||||
| border-radius: 40rpx; | |||||
| color: #FFF; | |||||
| font-size: 28rpx; | |||||
| margin: 20rpx 10rpx 0 0; | |||||
| background: $uni-color; | |||||
| //margin-top: 20rpx; | |||||
| border-radius: 40rpx; | |||||
| } | |||||
| .lxwm { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| width: 500rpx; | |||||
| height: 70rpx; | |||||
| border-radius: 40rpx; | |||||
| color: #000000; | |||||
| font-size: 28rpx; | |||||
| margin: 20rpx 10rpx 0 0; | |||||
| background: #f1f1f1; | |||||
| //margin-top: 20rpx; | |||||
| border-radius: 40rpx; | |||||
| } | |||||
| .tip { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| font-size: 24rpx; | |||||
| color: #999; | |||||
| //width: 500rpx; | |||||
| } | |||||
| } | |||||
| .item { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| background-color: #FFF; | |||||
| height: 80rpx; | |||||
| // margin: 10rpx 0 0 0; | |||||
| padding: 10rpx 0 0 20rpx; | |||||
| > view:nth-of-type(1) { | |||||
| width: 30%; | |||||
| // font-weight: 700; | |||||
| } | |||||
| > view:nth-of-type(2) { | |||||
| width: 70%; | |||||
| border-radius: 10rpx; | |||||
| overflow: hidden; | |||||
| input { | |||||
| background-color: #FFF; | |||||
| font-size: 28rpx; | |||||
| padding: 16rpx 8rpx 16rpx 15rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| .performanceBond { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| background-color: #FFF; | |||||
| height: 80rpx; | |||||
| // margin: 10rpx 0 0 0; | |||||
| padding: 10rpx 0 0 20rpx; | |||||
| .key { | |||||
| width: 30%; | |||||
| // font-weight: 700; | |||||
| } | |||||
| .value { | |||||
| width: 70%; | |||||
| border-radius: 10rpx; | |||||
| overflow: hidden; | |||||
| input { | |||||
| background-color: #FFF; | |||||
| font-size: 28rpx; | |||||
| padding: 16rpx 8rpx 16rpx 15rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| .currentRegion { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| background-color: #FFF; | |||||
| height: 80rpx; | |||||
| // margin: 10rpx 0 0 0; | |||||
| padding: 10rpx 0 0 20rpx; | |||||
| > view:nth-of-type(1) { | |||||
| width: 30%; | |||||
| // font-weight: 700; | |||||
| } | |||||
| > view:nth-of-type(2) { | |||||
| width: 70%; | |||||
| padding: 0 20rpx 0 0; | |||||
| display: flex; | |||||
| .input { | |||||
| background-color: #f5f5f5; | |||||
| // color: #a4a4a4; | |||||
| font-size: 28rpx; | |||||
| padding: 8rpx 8rpx 8rpx 15rpx; | |||||
| width: 350rpx; | |||||
| } | |||||
| .orientation { | |||||
| display: flex; | |||||
| padding: 10rpx 10rpx 10rpx 20rpx; | |||||
| font-size: 30rpx; | |||||
| color: #FBAB32; | |||||
| flex-direction: column; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| .now-order { | |||||
| background-color: #FFF; | |||||
| height: 100vh; | |||||
| .frame { | |||||
| .title { | |||||
| display: flex; | |||||
| font-size: 30rpx; | |||||
| font-weight: 700; | |||||
| padding: 0rpx 0 0rpx 20rpx; | |||||
| margin: 20rpx 0 0 0; | |||||
| >span:nth-of-type(1) { | |||||
| margin: 4rpx 0 0 8rpx; | |||||
| background-color: #FFF; | |||||
| } | |||||
| >span:nth-of-type(2) { | |||||
| margin: 0 0 0 8rpx; | |||||
| background-color: #FFF; | |||||
| } | |||||
| } | |||||
| .basic-info { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| gap: 5rpx; | |||||
| background-color: #FFF; | |||||
| //margin-top: 20rpx; | |||||
| padding: 20rpx 20rpx 20rpx 20rpx; | |||||
| .delivery-date { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| background-color: #FFF; | |||||
| height: 80rpx; | |||||
| // margin: 10rpx 0 0 0; | |||||
| padding: 10rpx 0 0 20rpx; | |||||
| >view:nth-of-type(1) { | |||||
| width: 30%; | |||||
| // font-weight: 700; | |||||
| } | |||||
| .value { | |||||
| width: 70%; | |||||
| border-radius: 10rpx; | |||||
| overflow: hidden; | |||||
| .dateTimeCls { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: space-between; | |||||
| width: 100%; | |||||
| height: 80%; | |||||
| //border: 1px solid #b0b2b3; | |||||
| padding: 5rpx; | |||||
| border-radius: 20rpx; | |||||
| .date { | |||||
| font-size: 30rpx; | |||||
| display: flex; | |||||
| align-items: center; | |||||
| width: 80%; | |||||
| height: 100%; | |||||
| color: #000; | |||||
| } | |||||
| .img { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| //margin-left: 50rpx; | |||||
| width: 20%; | |||||
| //height: 100%; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| .tentativeQuantity { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| background-color: #FFF; | |||||
| height: 80rpx; | |||||
| // margin: 10rpx 0 0 0; | |||||
| padding: 10rpx 0 0 20rpx; | |||||
| .key { | |||||
| width: 30%; | |||||
| } | |||||
| .value { | |||||
| width: 70%; | |||||
| border-radius: 10rpx; | |||||
| overflow: hidden; | |||||
| } | |||||
| } | |||||
| .Tip { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| .span { | |||||
| color: #999; | |||||
| font-size: 24rpx; | |||||
| } | |||||
| } | |||||
| .btns { | |||||
| width: 100%; | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| gap: 20rpx; | |||||
| .ljxd { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| width: 500rpx; | |||||
| height: 70rpx; | |||||
| border-radius: 40rpx; | |||||
| color: #FFF; | |||||
| font-size: 28rpx; | |||||
| margin: 20rpx 10rpx 0 0; | |||||
| background: $uni-color; | |||||
| //margin-top: 20rpx; | |||||
| border-radius: 40rpx; | |||||
| } | |||||
| .lxwm { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| width: 500rpx; | |||||
| height: 70rpx; | |||||
| border-radius: 40rpx; | |||||
| color: #000000; | |||||
| font-size: 28rpx; | |||||
| margin: 20rpx 10rpx 0 0; | |||||
| background: #f1f1f1; | |||||
| //margin-top: 20rpx; | |||||
| border-radius: 40rpx; | |||||
| } | |||||
| .tip { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| justify-content: center; | |||||
| font-size: 24rpx; | |||||
| color: #999; | |||||
| //width: 500rpx; | |||||
| } | |||||
| } | |||||
| .item { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| background-color: #FFF; | |||||
| height: 80rpx; | |||||
| // margin: 10rpx 0 0 0; | |||||
| padding: 10rpx 0 0 20rpx; | |||||
| >view:nth-of-type(1) { | |||||
| width: 30%; | |||||
| // font-weight: 700; | |||||
| } | |||||
| >view:nth-of-type(2) { | |||||
| width: 70%; | |||||
| border-radius: 10rpx; | |||||
| overflow: hidden; | |||||
| input { | |||||
| background-color: #FFF; | |||||
| font-size: 28rpx; | |||||
| padding: 16rpx 8rpx 16rpx 15rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| .performanceBond { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| background-color: #FFF; | |||||
| height: 80rpx; | |||||
| // margin: 10rpx 0 0 0; | |||||
| padding: 10rpx 0 0 20rpx; | |||||
| .key { | |||||
| width: 30%; | |||||
| // font-weight: 700; | |||||
| } | |||||
| .value { | |||||
| width: 70%; | |||||
| border-radius: 10rpx; | |||||
| overflow: hidden; | |||||
| input { | |||||
| background-color: #FFF; | |||||
| font-size: 28rpx; | |||||
| padding: 16rpx 8rpx 16rpx 15rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| .currentRegion { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| background-color: #FFF; | |||||
| height: 80rpx; | |||||
| // margin: 10rpx 0 0 0; | |||||
| padding: 10rpx 0 0 20rpx; | |||||
| >view:nth-of-type(1) { | |||||
| width: 30%; | |||||
| // font-weight: 700; | |||||
| } | |||||
| >view:nth-of-type(2) { | |||||
| width: 70%; | |||||
| padding: 0 20rpx 0 0; | |||||
| display: flex; | |||||
| .input { | |||||
| background-color: #f5f5f5; | |||||
| // color: #a4a4a4; | |||||
| font-size: 28rpx; | |||||
| padding: 8rpx 8rpx 8rpx 15rpx; | |||||
| width: 350rpx; | |||||
| } | |||||
| .orientation { | |||||
| display: flex; | |||||
| padding: 10rpx 10rpx 10rpx 20rpx; | |||||
| font-size: 30rpx; | |||||
| color: #FBAB32; | |||||
| flex-direction: column; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | </style> | ||||
BIN
static/image/tabbar/组 46940_1.png
View File
| Before | After |
|---|---|
|
|
| Width: 20 | Height: 20 | Size: 276 B |