20 changed files with 156 additions and 1898 deletions
Unified View
Diff Options
-
+1 -1components/base/tabbar.vue
-
+1 -1config.js
-
+2 -19pages.json
-
+0 -146pages/index/cart.vue
-
+0 -159pages/index/category.vue
-
+5 -5pages/index/center.vue
-
+37 -73pages/index/index.vue
-
+0 -263pages/index/order.vue
-
+0 -93pages_order/components/commodity/commoditySelect.vue
-
+18 -88pages_order/order/FavoriteList.vue
-
+1 -1pages_order/order/ModifyWorkOrder.vue
-
+79 -0pages_order/order/WorkOrderList.vue
-
+0 -112pages_order/order/WorkOrderListitem.vue
-
+4 -2pages_order/order/WorkOrders.vue
-
+0 -567pages_order/order/orderDetail.vue
-
+0 -360pages_order/order/refundsOrExchange.vue
-
+1 -1uni_modules/uv-icon/components/uv-icon/props.js
-
+3 -3uni_modules/uv-notice-bar/components/uv-notice-bar/props.js
-
+1 -1uni_modules/uv-search/components/uv-search/props.js
-
+3 -3uni_modules/uv-tabs/components/uv-tabs/props.js
+ 1
- 1
components/base/tabbar.vue
View File
+ 1
- 1
config.js
View File
+ 2
- 19
pages.json
View File
+ 0
- 146
pages/index/cart.vue
View File
| @ -1,146 +0,0 @@ | |||||
| <template> | |||||
| <view class="page"> | |||||
| <navbar | |||||
| title="收藏列表" | |||||
| leftClick | |||||
| @leftClick="$utils.navigateBack"/> | |||||
| <uv-search placeholder="请输入搜索内容" v-model="keyword" height="80"></uv-search> | |||||
| <!-- 标签选项 --> | |||||
| <view class="Tabs"> | |||||
| <uv-tabs :list="listt" @click="click" ></uv-tabs> | |||||
| </view> | |||||
| <view class="Urgent-Work-Order"> | |||||
| <view class="Urgent-Work-List" v-for="(item,index) in 2 " > | |||||
| <view class="Work-List"> | |||||
| 任务号：GY1269103AC0 | |||||
| </view> | |||||
| <view class="Work-List"> | |||||
| 担当信息：李林珠-15177689988 | |||||
| </view> | |||||
| <view class="Work-List"> | |||||
| 机型信息：BSZ24861768 | |||||
| </view> | |||||
| <view class="Work-List"> | |||||
| 数量：88 | |||||
| </view> | |||||
| <view class="Work-List"> | |||||
| 工单状态：本体加工 | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <tabber select="3" /> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| import tabber from '@/components/base/tabbar.vue' | |||||
| export default { | |||||
| components: { | |||||
| tabber, | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| keyword: '水调歌头', | |||||
| listt: [{ | |||||
| name: '所有', | |||||
| }, { | |||||
| name: '备料中', | |||||
| }, { | |||||
| name: '本体加工' | |||||
| }, { | |||||
| name: '气密检测' | |||||
| }, { | |||||
| name: '挂机中' | |||||
| }], | |||||
| 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(){ | |||||
| }, | |||||
| click(item) { | |||||
| console.log('item', item); | |||||
| } | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="scss"> | |||||
| .page { | |||||
| padding-bottom: 200rpx; | |||||
| /deep/ .uv-swipe-action{ | |||||
| width: 100%; | |||||
| } | |||||
| .Tabs{ | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| } | |||||
| .Urgent-Work-Order{ | |||||
| padding: 20rpx; | |||||
| .Urgent-Work-List{ | |||||
| margin-top: 20rpx; | |||||
| border: 6rpx solid rgb(99 ,187 ,211); | |||||
| border-radius: 25rpx; | |||||
| padding: 15rpx; | |||||
| .Work-List{ | |||||
| margin: 15rpx 0rpx; | |||||
| letter-spacing: 2px | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | |||||
+ 0
- 159
pages/index/category.vue
View File
| @ -1,159 +0,0 @@ | |||||
| <template> | |||||
| <view class="page"> | |||||
| <navbar | |||||
| title="列表" | |||||
| leftClick | |||||
| @leftClick="$utils.navigateBack" | |||||
| /> | |||||
| <uv-search placeholder="请输入搜索内容" v-model="keyword" height="80"></uv-search> | |||||
| <!-- 标签选项 --> | |||||
| <view class="Tabs"> | |||||
| <uv-tabs :list="listt" @click="click" ></uv-tabs> | |||||
| </view> | |||||
| <view class="Urgent-Work-Order"> | |||||
| <WorkOrderitem | |||||
| v-for="(item,index) in 2" | |||||
| @click="$utils.navigateTo('/pages_order/order/WorkOrders')"/> | |||||
| </view> | |||||
| <tabber select="1" /> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| import tabber from '@/components/base/tabbar.vue' | |||||
| import WorkOrderitem from '@/components/work/WorkOrderitem.vue' | |||||
| export default { | |||||
| components: { | |||||
| tabber, | |||||
| WorkOrderitem, | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| keyword: '水调歌头', | |||||
| listt: [{ | |||||
| name: '所有', | |||||
| }, { | |||||
| name: '备料中', | |||||
| }, { | |||||
| name: '本体加工' | |||||
| }, { | |||||
| name: '气密检测' | |||||
| }, { | |||||
| name: '挂机中' | |||||
| }], | |||||
| 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; | |||||
| }, | |||||
| click(item) { | |||||
| console.log('item', item); | |||||
| } | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="scss"> | |||||
| .page { | |||||
| background-color: #fff; | |||||
| /deep/ .uv-vtabs { | |||||
| height: calc(100vh - 360rpx) !important; | |||||
| } | |||||
| /deep/ .uv-vtabs__bar { | |||||
| height: calc(100vh - 360rpx) !important; | |||||
| } | |||||
| /deep/ .uv-vtabs__content { | |||||
| height: calc(100vh - 360rpx) !important; | |||||
| } | |||||
| .Tabs{ | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| } | |||||
| .Urgent-Work-Order{ | |||||
| padding: 20rpx; | |||||
| .Urgent-Work-List{ | |||||
| margin-top: 20rpx; | |||||
| border: 6rpx solid rgb(99 ,187 ,211); | |||||
| border-radius: 25rpx; | |||||
| padding: 15rpx; | |||||
| .Work-List{ | |||||
| margin: 15rpx 0rpx; | |||||
| letter-spacing: 2px | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | |||||
+ 5
- 5
pages/index/center.vue
View File
+ 37
- 73
pages/index/index.vue
View File
+ 0
- 263
pages/index/order.vue
View File
| @ -1,263 +0,0 @@ | |||||
| <template> | |||||
| <view class="page"> | |||||
| <navbar | |||||
| title="订单中心" | |||||
| /> | |||||
| <uv-tabs :list="tabs" | |||||
| :activeStyle="{color : '#FD5100', fontWeight : 600}" | |||||
| lineColor="#FD5100" | |||||
| lineHeight="8rpx" | |||||
| lineWidth="50rpx" | |||||
| @click="clickTabs"></uv-tabs> | |||||
| <view v-if="orderList.length > 0" class="list"> | |||||
| <view class="item" | |||||
| v-for="(item, index) in orderList.records" | |||||
| @click="toOrderDetail(item.id)" | |||||
| :key="index"> | |||||
| <view class="top"> | |||||
| <view class="service"> | |||||
| <text>{{item.projectId_dictText}}</text> | |||||
| <text>{{item.type_dictText}}</text> | |||||
| </view> | |||||
| <view class="status"> | |||||
| <text> {{item.state_dictText}}</text> | |||||
| </view> | |||||
| </view> | |||||
| <view class="content"> | |||||
| <view class="left"> | |||||
| <image mode="aspectFill" :src="item.image"></image> | |||||
| </view> | |||||
| <view class="right"> | |||||
| <view class="text-hidden-1"> | |||||
| 客户姓名：{{item.name}} | |||||
| </view> | |||||
| <view class="text-hidden-1"> | |||||
| 产品规格：{{item.unit}} | |||||
| </view> | |||||
| <view class="text-hidden-1"> | |||||
| 租赁地址：{{item.address}} | |||||
| </view> | |||||
| <!-- <view class="text-hidden-1"> | |||||
| 总计时间：{{item.useTime}}分钟 | |||||
| </view> --> | |||||
| </view> | |||||
| </view> | |||||
| <view class="bottom"> | |||||
| <view class="price"> | |||||
| 总价格：<text class="num">{{item.money}}元</text> | |||||
| </view> | |||||
| <view class="b1"> | |||||
| 查看物流 | |||||
| </view> | |||||
| <!-- <view @click.stop="toPayOrder(item)" class="b2" v-if="item.state == 0"> | |||||
| 立即付款 | |||||
| </view> | |||||
| <view class="b1" @click.stop="moreOrder(item.projectId,toPlaceorder)" v-if="item.state == 3"> | |||||
| 再来一单 | |||||
| </view> | |||||
| <view class="b2" @click.stop="toEvaluate(item.id,item.projectId,item.technicianId)" v-if="item.state == 3"> | |||||
| 立即评价 | |||||
| </view> | |||||
| <view class="b2" @click.stop="moreOrder(item.projectId,toPlaceorder)" v-if="item.state == 4"> | |||||
| 再来一单 | |||||
| </view> --> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <tabber select="2"/> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| import tabber from '@/components/base/tabbar.vue' | |||||
| import { mapGetters } from 'vuex' | |||||
| export default { | |||||
| components : { | |||||
| tabber, | |||||
| }, | |||||
| computed : { | |||||
| ...mapGetters(['userShop']), | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| tabs: [{ | |||||
| name: '全部' | |||||
| }, | |||||
| { | |||||
| name: '租赁押金' | |||||
| }, | |||||
| { | |||||
| name: '水洗租赁' | |||||
| }, | |||||
| { | |||||
| name: '破损换货' | |||||
| }, | |||||
| { | |||||
| name: '退货退款' | |||||
| } | |||||
| ], | |||||
| queryParams: { | |||||
| pageNo: 1, | |||||
| pageSize: 10 | |||||
| }, | |||||
| // orderList: [ | |||||
| // { | |||||
| // money : 99.99, | |||||
| // address : '广东省广州市越秀区城南故事C3栋2802', | |||||
| // name : '李**', | |||||
| // phone : '150*****091', | |||||
| // unit : '120*40*75【桌子尺寸】', | |||||
| // image : 'https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg', | |||||
| // state_dictText : '已完成', | |||||
| // } | |||||
| // ], //订单列表数据 | |||||
| orderList : { | |||||
| records : [], | |||||
| total : 0, | |||||
| }, | |||||
| state : -1, | |||||
| } | |||||
| }, | |||||
| onShow() { | |||||
| this.orderPage() | |||||
| }, | |||||
| //滚动到屏幕底部 | |||||
| onReachBottom() { | |||||
| if(this.queryParams.pageSize < this.orderList.total){ | |||||
| this.queryParams.pageSize += 10 | |||||
| this.orderPage() | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| orderPage(){ | |||||
| let queryParams = { | |||||
| ...this.queryParams, | |||||
| } | |||||
| if(this.state != -1){ | |||||
| queryParams.state = this.state | |||||
| } | |||||
| this.$api('orderPage', queryParams, res => { | |||||
| if(res.code == 200){ | |||||
| this.orderList = res.result | |||||
| } | |||||
| }) | |||||
| }, | |||||
| //点击tab栏 | |||||
| clickTabs(index) { | |||||
| if (index == 0) { | |||||
| this.state = -1; | |||||
| } else { | |||||
| this.state = index - 1; | |||||
| } | |||||
| this.queryParams.pageSize = 10 | |||||
| this.orderPage() | |||||
| }, | |||||
| //跳转订单详情页面 | |||||
| toOrderDetail(id) { | |||||
| uni.navigateTo({ | |||||
| url: '/pages_order/order/orderDetail?id=' + id | |||||
| }) | |||||
| }, | |||||
| getOrderList(){ | |||||
| }, | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="scss"> | |||||
| .page{ | |||||
| } | |||||
| .list { | |||||
| .item { | |||||
| width: calc(100% - 40rpx); | |||||
| background-color: #fff; | |||||
| margin: 20rpx; | |||||
| box-sizing: border-box; | |||||
| border-radius: 16rpx; | |||||
| padding: 30rpx; | |||||
| .top { | |||||
| display: flex; | |||||
| justify-content: space-between; | |||||
| align-items: center; | |||||
| font-size: 30rpx; | |||||
| .service {} | |||||
| .status { | |||||
| font-size: 26rpx; | |||||
| font-weight: 600; | |||||
| } | |||||
| } | |||||
| .content { | |||||
| display: flex; | |||||
| margin: 10rpx 0; | |||||
| .left { | |||||
| width: 150rpx; | |||||
| height: 150rpx; | |||||
| border-radius: 10rpx; | |||||
| image { | |||||
| width: 150rpx; | |||||
| height: 150rpx; | |||||
| border-radius: 10rpx; | |||||
| } | |||||
| } | |||||
| .right { | |||||
| width: calc(100% - 160rpx); | |||||
| color: #777; | |||||
| font-size: 24rpx; | |||||
| padding-left: 20rpx; | |||||
| line-height: 40rpx; | |||||
| background-color: #F8F8F8; | |||||
| } | |||||
| } | |||||
| .bottom { | |||||
| display: flex; | |||||
| justify-content: space-between; | |||||
| font-size: 25rpx; | |||||
| .price { | |||||
| font-weight: 900; | |||||
| text { | |||||
| color: #ff780099; | |||||
| font-size: 30rpx; | |||||
| } | |||||
| } | |||||
| .b1 { | |||||
| border: 1px solid #777; | |||||
| color: #777; | |||||
| box-sizing: border-box; | |||||
| } | |||||
| .b2 { | |||||
| background: linear-gradient(178deg, #4FD3BC, #60C285); | |||||
| color: #fff; | |||||
| } | |||||
| view { | |||||
| margin: 12rpx; | |||||
| border-radius: 28rpx; | |||||
| padding: 8rpx 28rpx; | |||||
| margin-bottom: 0; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | |||||
+ 0
- 93
pages_order/components/commodity/commoditySelect.vue
View File
| @ -1,93 +0,0 @@ | |||||
| <template> | |||||
| <view style=""> | |||||
| <view v-for="item in commodityList" :key="item.title" class="address-item"> | |||||
| <view class="itme1" @click="selectSp(item)"> | |||||
| <view class="left"> | |||||
| <img src="../../../static/image/center/1.png" alt="" style="width: 100%;height: 100%;"> | |||||
| </view> | |||||
| <view class="center"> | |||||
| <view>{{ item.title }}</view> | |||||
| <view>{{ item.smallTitle }}</view> | |||||
| </view> | |||||
| <view class="right">×{{item.total}}</view> | |||||
| </view> | |||||
| <uv-line></uv-line> | |||||
| </view> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| export default { | |||||
| props: { | |||||
| commodityList: { | |||||
| default: [], | |||||
| type: Array, | |||||
| } | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| selectAddress: 0, | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| // 打开商品选择 | |||||
| openCommodity() { | |||||
| this.$emit('openSpPopup') | |||||
| }, | |||||
| // 选择了商品 | |||||
| selectSp(e) { | |||||
| console.log(this.commodityList,"this.csss") | |||||
| console.log(e, '选择了商品') | |||||
| this.$emit('selectSp', e) | |||||
| } | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="scss"> | |||||
| .itme1 { | |||||
| display: flex; | |||||
| height: 150rpx; | |||||
| width: 100vw; | |||||
| background-color: #ffffff; | |||||
| .left { | |||||
| padding: 40rpx; | |||||
| width: 20%; | |||||
| border-radius: 10rpx; | |||||
| background-color: #ffffff; | |||||
| } | |||||
| .center { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| justify-content: center; | |||||
| gap: 20rpx; | |||||
| width: 70%; | |||||
| padding: 0rpx 0 0 20rpx; | |||||
| background-color: #ffffff; | |||||
| // 给第一个 view 设置样式 | |||||
| > view:first-of-type { | |||||
| font-size: 36rpx; | |||||
| color: #333; | |||||
| } | |||||
| // 给第二个 view 设置样式 | |||||
| > view:nth-of-type(2) { | |||||
| font-size: 28rpx; | |||||
| color: #666666; | |||||
| } | |||||
| } | |||||
| .right { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| width: 10%; | |||||
| color: #666666; | |||||
| background-color: #ffffff; | |||||
| } | |||||
| } | |||||
| </style> | |||||
+ 18
- 88
pages_order/order/FavoriteList.vue
View File
+ 1
- 1
pages_order/order/ModifyWorkOrder.vue
View File
+ 79
- 0
pages_order/order/WorkOrderList.vue
View File
| @ -0,0 +1,79 @@ | |||||
| <template> | |||||
| <view class="page"> | |||||
| <navbar title="列表" leftClick @leftClick="$utils.navigateBack" /> | |||||
| <view class="search"> | |||||
| <uv-search | |||||
| placeholder="请输入搜索内容" | |||||
| v-model="queryParams.title" | |||||
| bgColor="#fff" | |||||
| height="80"></uv-search> | |||||
| </view> | |||||
| <!-- 标签选项 --> | |||||
| <view class="Tabs"> | |||||
| <uv-tabs :list="tabs" | |||||
| @click="clickTab"></uv-tabs> | |||||
| </view> | |||||
| <view class="Urgent-Work-Order"> | |||||
| <WorkOrderitem | |||||
| :key="index" | |||||
| v-for="(item,index) in list" :obj="item" | |||||
| @click="$utils.navigateTo('/pages_order/order/WorkOrders')" /> | |||||
| </view> | |||||
| <tabber select="1" /> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| import WorkOrderitem from '@/components/work/WorkOrderitem.vue' | |||||
| import mixinsList from '@/mixins/list.js' | |||||
| export default { | |||||
| mixins: [mixinsList], | |||||
| components: { | |||||
| WorkOrderitem, | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| mixinsListApi: 'queryTemplateList', | |||||
| tabs: [{ | |||||
| name: '所有', | |||||
| }, { | |||||
| name: '备料中', | |||||
| }, { | |||||
| name: '本体加工' | |||||
| }, { | |||||
| name: '气密检测' | |||||
| }, { | |||||
| name: '挂机中' | |||||
| }], | |||||
| } | |||||
| }, | |||||
| computed: { | |||||
| }, | |||||
| methods: { | |||||
| clickTab(){}, | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="scss"> | |||||
| .page { | |||||
| .search{ | |||||
| margin: 20rpx; | |||||
| } | |||||
| .Tabs { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| } | |||||
| .Urgent-Work-Order { | |||||
| padding: 20rpx; | |||||
| } | |||||
| } | |||||
| </style> | |||||
+ 0
- 112
pages_order/order/WorkOrderListitem.vue
View File
| @ -1,112 +0,0 @@ | |||||
| <template> | |||||
| <view class="page"> | |||||
| <navbar title="列表" leftClick @leftClick="$utils.navigateBack" /> | |||||
| <uv-search placeholder="请输入搜索内容" v-model="keyword" height="80"></uv-search> | |||||
| <!-- 标签选项 --> | |||||
| <view class="Tabs"> | |||||
| <uv-tabs :list="listt" @click="click"></uv-tabs> | |||||
| </view> | |||||
| <view class="Urgent-Work-Order"> | |||||
| <WorkOrderitem v-for="(item,index) in list" :obj="item" | |||||
| @click="$utils.navigateTo('/pages_order/order/WorkOrders')" /> | |||||
| </view> | |||||
| <tabber select="1" /> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| import tabber from '@/components/base/tabbar.vue' | |||||
| import WorkOrderitem from '@/components/work/WorkOrderitem.vue' | |||||
| import mixinsList from '@/mixins/list.js' | |||||
| export default { | |||||
| mixins: [mixinsList], | |||||
| components: { | |||||
| tabber, | |||||
| WorkOrderitem, | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| mixinsListApi : 'queryTemplateList', | |||||
| keyword: '水调歌头', | |||||
| listt: [{ | |||||
| name: '所有', | |||||
| }, { | |||||
| name: '备料中', | |||||
| }, { | |||||
| name: '本体加工' | |||||
| }, { | |||||
| name: '气密检测' | |||||
| }, { | |||||
| name: '挂机中' | |||||
| }], | |||||
| 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; | |||||
| }, | |||||
| click(item) { | |||||
| console.log('item', item); | |||||
| } | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="scss"> | |||||
| .page { | |||||
| background-color: #fff; | |||||
| /deep/ .uv-vtabs { | |||||
| height: calc(100vh - 360rpx) !important; | |||||
| } | |||||
| /deep/ .uv-vtabs__bar { | |||||
| height: calc(100vh - 360rpx) !important; | |||||
| } | |||||
| /deep/ .uv-vtabs__content { | |||||
| height: calc(100vh - 360rpx) !important; | |||||
| } | |||||
| .Tabs { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| } | |||||
| .Urgent-Work-Order { | |||||
| padding: 20rpx; | |||||
| .Urgent-Work-List { | |||||
| margin-top: 20rpx; | |||||
| border: 6rpx solid rgb(99, 187, 211); | |||||
| border-radius: 25rpx; | |||||
| padding: 15rpx; | |||||
| .Work-List { | |||||
| margin: 15rpx 0rpx; | |||||
| letter-spacing: 2px | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | |||||
+ 4
- 2
pages_order/order/WorkOrders.vue
View File
+ 0
- 567
pages_order/order/orderDetail.vue
View File
| @ -1,567 +0,0 @@ | |||||
| <template> | |||||
| <view> | |||||
| <navbar | |||||
| title="订单详情" | |||||
| leftClick | |||||
| @leftClick="$utils.navigateBack" | |||||
| /> | |||||
| <!-- 水洗店 --> | |||||
| <view class="" | |||||
| v-if="userShop"> | |||||
| <view class="controls"> | |||||
| <view class="title"> | |||||
| <image src="../static/order/icon.png" mode=""></image> | |||||
| 服务完成 | |||||
| </view> | |||||
| <view class="tips"> | |||||
| 待送回 | |||||
| </view> | |||||
| <view class="btns"> | |||||
| <view class="btn1"> | |||||
| 快递寄回 | |||||
| </view> | |||||
| <view class="btn2"> | |||||
| 线下配送 | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <view class="steps"> | |||||
| <uv-steps | |||||
| activeColor="#FD5100" | |||||
| :current="stepsCurrent" dot> | |||||
| <uv-steps-item :title="item" | |||||
| :key="index" | |||||
| v-for="(item, index) in steps"></uv-steps-item> | |||||
| </uv-steps> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 酒店和水洗店 --> | |||||
| <view class="info"> | |||||
| <view class="flex" | |||||
| style="display: flex;"> | |||||
| <view style="width: 8rpx;height: 30rpx; | |||||
| background: #FD5100;border-radius: 6rpx;" /> | |||||
| <view class="head-title">服务项目</view> | |||||
| </view> | |||||
| <view class="flex"> | |||||
| <view class="server-item"> | |||||
| <view class="img-box"> | |||||
| <image :src="msgShop.image" mode="aspectFill"></image> | |||||
| </view> | |||||
| <view class="server-info"> | |||||
| <view class="server-title"> | |||||
| {{msgOrder.projectName}} | |||||
| <!-- <view class="coupon">领券立减</view> --> | |||||
| </view> | |||||
| <view class="current-price"> | |||||
| <text class="unit">￥</text>{{msgOrder.money}} | |||||
| </view> | |||||
| <view class="sales-volume" style="margin-top: 5px;"> | |||||
| <view class="desc">规格：{{msgOrder.unit}}</view> | |||||
| </view> | |||||
| <view class="time-coupon"> | |||||
| <!-- <view class="flex"> | |||||
| <image src="@/static/home/time-icon.png"></image> | |||||
| <view class="time">{{msgOrder.useTime}}分钟</view> | |||||
| </view> --> | |||||
| <!-- <view class="sales-volume"> | |||||
| <image src="@/static/icons/icon1.png"></image> | |||||
| <view class="desc">已售出{{msgShop.payNum}}+单</view> | |||||
| </view> --> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!-- <view class="line min_tips"> | |||||
| <view class="head-div flex"> | |||||
| <view style="width: 118rpx;height: 118rpx;border-radius: 50%;overflow: hidden;"> | |||||
| <image style="width: 118rpx;" :src="msgTechnician.image" mode="widthFix"></image> | |||||
| </view> | |||||
| <view style="padding: 10rpx 34rpx;display: flex;flex-direction: column;justify-content: space-around;"> | |||||
| <view class="nickname"> | |||||
| {{msgTechnician.title}} | |||||
| <view v-if="msgTechnician.isVip" class="tag"> | |||||
| <image src="@/static/order/s.png" mode="aspectFit"></image> | |||||
| <view class="auth">官方认证</view> | |||||
| </view> | |||||
| </view> | |||||
| <view class="days"> | |||||
| <van-rate v-model="msgTechnician.score" :size="10" readonly color="#ffb54c" void-icon="star" | |||||
| void-color="#eee" /> | |||||
| <view class=""> | |||||
| 好评{{msgTechnician.pinNum}} | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <view @click="gototechnicianDetail(msgTechnician)" class="btn-x"> | |||||
| 服务技师 | |||||
| </view> | |||||
| </view> --> | |||||
| <view class="line address"> | |||||
| <view class="address-top"> | |||||
| <!-- <view class=""> | |||||
| 服务地址 | |||||
| </view> --> | |||||
| <view class="copy"> | |||||
| <image @click="copy(msgOrder.name + ' ' + msgOrder.phone + ' ' + msgOrder.address)" src="/static/order/copy.png"></image> | |||||
| </view> | |||||
| </view> | |||||
| <view class="addressDetail"> | |||||
| <view class="">{{msgOrder.name}} {{msgOrder.phone}}</view> | |||||
| <view class="">{{msgOrder.address}}</view> | |||||
| </view> | |||||
| </view> | |||||
| <view class="line"> | |||||
| <view class="t min_tips"> | |||||
| <view class=""> | |||||
| 实付款 | |||||
| </view> | |||||
| <view class="current-price"> | |||||
| ￥{{ msgOrder.money }} | |||||
| </view> | |||||
| </view> | |||||
| <view class="min_tips"> | |||||
| <view class=""> | |||||
| 租赁费用 | |||||
| </view> | |||||
| <view class=""> | |||||
| ￥{{ msgOrder.price }} | |||||
| </view> | |||||
| </view> | |||||
| <view class="min_tips"> | |||||
| <view class=""> | |||||
| 水洗费用 | |||||
| </view> | |||||
| <view class=""> | |||||
| ￥{{ msgOrder.price}} | |||||
| </view> | |||||
| </view> | |||||
| <view class="min_tips"> | |||||
| <view class=""> | |||||
| 押金 | |||||
| </view> | |||||
| <view class=""> | |||||
| ￥{{ msgOrder.price }} | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 订单信息 --> | |||||
| <view class="line"> | |||||
| <view class="t min_tips"> | |||||
| <view class=""> | |||||
| 订单信息 | |||||
| </view> | |||||
| </view> | |||||
| <view class="min_tips"> | |||||
| <view class=""> | |||||
| 订单编号 | |||||
| </view> | |||||
| <view class=""> | |||||
| {{msgOrder.id}} | |||||
| </view> | |||||
| </view> | |||||
| <view class="min_tips"> | |||||
| <view class=""> | |||||
| 下单时间 | |||||
| </view> | |||||
| <view class=""> | |||||
| {{msgOrder.createTime}} | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 下单须知 --> | |||||
| <view class="line"> | |||||
| <view class="t min_tips"> | |||||
| <view class=""> | |||||
| 下单须知 | |||||
| </view> | |||||
| </view> | |||||
| <view class="min_tips" style="line-height: 40rpx;"> | |||||
| {{msgShop.projectExplain}} | |||||
| </view> | |||||
| <view class="btns"> | |||||
| <view @click="clickService" class="btn"> | |||||
| 联系客服 | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| import { mapGetters } from 'vuex' | |||||
| export default { | |||||
| computed : { | |||||
| ...mapGetters(['userShop']), | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| stepsCurrent : 0, | |||||
| steps : [ | |||||
| '接单', | |||||
| '检查', | |||||
| '开始清洗', | |||||
| '服务完成', | |||||
| ], | |||||
| msgShop : { | |||||
| money : 99.99, | |||||
| image : 'https://img95.699pic.com/photo/50058/1378.jpg_wh860.jpg', | |||||
| projectExplain : '1.xxxxxxxxxx xxxxxxxxxx。2.xxxxxx xxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxx xxxxxxxxxxxxxxxx。3.。', | |||||
| }, | |||||
| msgOrder : { | |||||
| money : 99.99, | |||||
| address : '广东省广州市越秀区城南故事C3栋2802', | |||||
| name : '李**', | |||||
| phone : '150*****091', | |||||
| unit : '120*40*75【桌子尺寸】', | |||||
| state_dictText : '已完成', | |||||
| price : 199.99, | |||||
| id : '020644568964457', | |||||
| createTime : '2024-01-18 15:39', | |||||
| projectName : '桌布租赁' | |||||
| }, | |||||
| } | |||||
| }, | |||||
| methods: { | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style scoped lang="scss"> | |||||
| .order { | |||||
| background: linear-gradient(#4899a6, #6fc6ad, #6fc6ad); | |||||
| padding-bottom: 10px; | |||||
| } | |||||
| .controls{ | |||||
| margin: 20rpx; | |||||
| background-color: #fff; | |||||
| height: 400rpx; | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| width: 710rpx; | |||||
| border-radius: 20rpx; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| .title{ | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| font-size: 40rpx; | |||||
| image{ | |||||
| width: 100rpx; | |||||
| height: 100rpx; | |||||
| margin-right: 20rpx; | |||||
| } | |||||
| } | |||||
| .tips{ | |||||
| font-size: 26rpx; | |||||
| color: #FD5100; | |||||
| margin-top: 10rpx; | |||||
| } | |||||
| .btns{ | |||||
| margin-top: 50rpx; | |||||
| display: flex; | |||||
| view{ | |||||
| margin: 0 20rpx; | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| color: #fff; | |||||
| background-color: $uni-color; | |||||
| padding: 15rpx 40rpx; | |||||
| border-radius: 40rpx; | |||||
| } | |||||
| .btn2{ | |||||
| background-color: #FFFFFF; | |||||
| border: 1px solid #A7A7A7; | |||||
| color: #A7A7A7; | |||||
| } | |||||
| } | |||||
| } | |||||
| .steps{ | |||||
| margin: 20rpx; | |||||
| background-color: #fff; | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| width: 710rpx; | |||||
| border-radius: 20rpx; | |||||
| padding: 70rpx 0; | |||||
| /deep/ .uv-text__value{ | |||||
| font-size: 22rpx !important; | |||||
| } | |||||
| } | |||||
| .box { | |||||
| padding: 20px; | |||||
| .btns { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| margin-top: 10px; | |||||
| .btn { | |||||
| color: #fff; | |||||
| padding: 10rpx 50rpx; | |||||
| background-color: #ffb300; | |||||
| border-radius: 30rpx; | |||||
| font-size: 25rpx; | |||||
| margin-right: 10rpx; | |||||
| } | |||||
| .btc{ | |||||
| background: #ccc; | |||||
| } | |||||
| } | |||||
| } | |||||
| .info { | |||||
| margin: 10px; | |||||
| padding: 20rpx; | |||||
| background-color: #fff; | |||||
| width: calc(100% - 40px); | |||||
| border-radius: 10px; | |||||
| .head-title { | |||||
| font-family: PingFang SC, PingFang SC-Bold; | |||||
| color: #2f2e2e; | |||||
| line-height: 30rpx; | |||||
| margin-left: 10rpx; | |||||
| } | |||||
| .server-item { | |||||
| display: flex; | |||||
| flex-wrap: wrap; | |||||
| align-items: center; | |||||
| justify-content: space-between; | |||||
| background: white; | |||||
| border-radius: 15rpx; | |||||
| box-sizing: border-box; | |||||
| margin: 20rpx 0rpx; | |||||
| width: 100%; | |||||
| .img-box { | |||||
| width: 150rpx; | |||||
| height: 150rpx; | |||||
| border-radius: 10rpx; | |||||
| overflow: hidden; | |||||
| image { | |||||
| width: 100%; | |||||
| height: 100%; | |||||
| } | |||||
| } | |||||
| .server-info { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| justify-content: space-around; | |||||
| width: calc(100% - 180rpx); | |||||
| box-sizing: border-box; | |||||
| padding: 10rpx 15rpx; | |||||
| .server-title { | |||||
| display: flex; | |||||
| margin-bottom: 10rpx; | |||||
| } | |||||
| .coupon { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| background: #F29E45; | |||||
| color: white; | |||||
| width: 120rpx; | |||||
| height: 40rpx; | |||||
| border-radius: 10rpx; | |||||
| margin-left: 10rpx; | |||||
| font-size: 22rpx; | |||||
| } | |||||
| .time-coupon, | |||||
| .price { | |||||
| display: flex; | |||||
| flex-wrap: wrap; | |||||
| align-items: center; | |||||
| } | |||||
| .time-coupon { | |||||
| margin: 10rpx 0rpx; | |||||
| font-size: 26rpx; | |||||
| justify-content: space-between; | |||||
| width: 100%; | |||||
| .flex { | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| } | |||||
| image { | |||||
| width: 25rpx; | |||||
| height: 25rpx; | |||||
| } | |||||
| .time { | |||||
| color: #B8B8B8; | |||||
| margin-left: 6rpx; | |||||
| } | |||||
| } | |||||
| .sales-volume { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| color: #B8B8B8; | |||||
| font-size: 24rpx; | |||||
| image { | |||||
| width: 25rpx; | |||||
| height: 25rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| .address { | |||||
| .address-top{ | |||||
| display: flex; | |||||
| justify-content: space-between; | |||||
| align-items: center; | |||||
| image{ | |||||
| width: 30rpx; | |||||
| height: 30rpx; | |||||
| } | |||||
| } | |||||
| .addressDetail { | |||||
| color: #777; | |||||
| font-size: 22rpx; | |||||
| padding: 5px 0; | |||||
| } | |||||
| text { | |||||
| background-color: #F29E45; | |||||
| padding: 8rpx 10rpx; | |||||
| color: #fff; | |||||
| font-size: 20rpx; | |||||
| margin-left: 10px; | |||||
| border-radius: 5px; | |||||
| } | |||||
| } | |||||
| .min_tips { | |||||
| font-size: 22rpx; | |||||
| color: #777; | |||||
| display: flex; | |||||
| justify-content: space-between; | |||||
| padding: 5px 0; | |||||
| align-items: center; | |||||
| } | |||||
| .current-price { | |||||
| font-size: 30rpx; | |||||
| color: #FD5100; | |||||
| } | |||||
| .line { | |||||
| border-top: 2px dotted #00000011; | |||||
| padding: 20rpx 0; | |||||
| .t { | |||||
| padding: 5px 0; | |||||
| color: #000; | |||||
| font-size: 26rpx; | |||||
| } | |||||
| } | |||||
| .head-div { | |||||
| .nickname { | |||||
| font-size: 30rpx; | |||||
| font-weight: 600; | |||||
| text-align: left; | |||||
| line-height: 42rpx; | |||||
| display: flex; | |||||
| align-items: center; | |||||
| .tag { | |||||
| position: relative; | |||||
| display: flex; | |||||
| align-items: center; | |||||
| image { | |||||
| height: 45rpx; | |||||
| width: 90rpx; | |||||
| vertical-align: middle; | |||||
| } | |||||
| .auth { | |||||
| position: absolute; | |||||
| white-space: nowrap; | |||||
| color: #FF6200; | |||||
| left: 23rpx; | |||||
| font-size: 17rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| .days { | |||||
| font-size: 20rpx; | |||||
| font-weight: 400; | |||||
| text-align: left; | |||||
| line-height: 56rpx; | |||||
| display: flex; | |||||
| align-items: center; | |||||
| view { | |||||
| padding-left: 5px; | |||||
| } | |||||
| } | |||||
| } | |||||
| .btn-x { | |||||
| color: #6fc6ad; | |||||
| border: 1px solid #6fc6ad; | |||||
| padding: 10rpx 20rpx; | |||||
| border-radius: 30rpx; | |||||
| } | |||||
| .btns { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| .btn { | |||||
| color: #6fc6ad; | |||||
| border: 1px solid #6fc6ad; | |||||
| padding: 10rpx 20rpx; | |||||
| border-radius: 30rpx; | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | |||||
+ 0
- 360
pages_order/order/refundsOrExchange.vue
View File
| @ -1,360 +0,0 @@ | |||||
| <template> | |||||
| <view class="refundsOrExchange"> | |||||
| <navbar :title="title[titleIndex]" leftClick @leftClick="$utils.navigateBack"/> | |||||
| <view class="frame"> | |||||
| <!-- 商品简介 --> | |||||
| <view class="itme1" @click="openSpPopup"> | |||||
| <view class="left"> | |||||
| <img src="../../static/image/center/1.png" alt="" style="width: 100%;height: 100%;"> | |||||
| </view> | |||||
| <view class="center"> | |||||
| <view>{{ commodity.title }}</view> | |||||
| <view>{{ commodity.smallTitle }}</view> | |||||
| </view> | |||||
| <view class="right">×{{ commodity.total }}</view> | |||||
| </view> | |||||
| <!--<commoditySelect ></commoditySelect>--> | |||||
| <!-- 申请类型&申请原因 --> | |||||
| <view class="item2"> | |||||
| <view class="type"> | |||||
| <span>申请类型</span> | |||||
| <span>退货退款</span> | |||||
| </view> | |||||
| <uv-line></uv-line> | |||||
| <view class="reason"> | |||||
| <view>申请原因</view> | |||||
| <view> | |||||
| <uv-input placeholder="请输入申请原因" border="none" clearable></uv-input> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 退货数量&申请金额--> | |||||
| <view class="item3"> | |||||
| <view class="type"> | |||||
| <span>{{ titleIndex == 0 ? '退货数量' : '换货数量' }}</span> | |||||
| <span> | |||||
| <uv-number-box :min="1" :max="100"></uv-number-box> | |||||
| </span> | |||||
| </view> | |||||
| <uv-line v-if='titleIndex == 0 ? true :false'></uv-line> | |||||
| <view class="reason" v-if='titleIndex == 0 ? true :false'> | |||||
| <view>申请原因</view> | |||||
| <view> | |||||
| <uv-input disabled placeholder="$" border="none" clearable></uv-input> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 申请说明 --> | |||||
| <view class="item4"> | |||||
| <view>申请说明(选填)</view> | |||||
| <view> | |||||
| <uv-input placeholder="请您详细填写申请说明" border="none" clearable></uv-input> | |||||
| </view> | |||||
| <view> | |||||
| <uv-upload :fileList="fileList" :maxCount="5" multiple width="150rpx" height="150rpx" | |||||
| @delete="deleteImage" @afterRead="afterRead" :previewFullImage="true"></uv-upload> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 联系电话 --> | |||||
| <view class="item5"> | |||||
| <view class="phone"> | |||||
| <view>联系电话</view> | |||||
| <view> | |||||
| <uv-input placeholder="请输入联系电话" border="none" clearable></uv-input> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| </view> | |||||
| <!-- 底部按钮 --> | |||||
| <!--商品选择--> | |||||
| <uv-popup ref="spPopup" :round="30"> | |||||
| <commoditySelect | |||||
| :commodityList="commodityList" | |||||
| @selectSp="selectCommodity" | |||||
| /> | |||||
| </uv-popup> | |||||
| </view> | |||||
| </template> | |||||
| <script> | |||||
| import commoditySelect from "../components/commodity/commoditySelect.vue" | |||||
| export default { | |||||
| onLoad(option) { | |||||
| this.titleIndex = option.index | |||||
| }, | |||||
| components: { | |||||
| commoditySelect | |||||
| }, | |||||
| data() { | |||||
| return { | |||||
| titleIndex: 0, | |||||
| title: ['申请换货', '申请退货'], | |||||
| fileList: [], | |||||
| bottomBtnStyle: { | |||||
| color: '#FFF', | |||||
| backgroundColor: '#fd5100', | |||||
| fontSize: '34rpx', | |||||
| text: '提交申请', | |||||
| width: '400rpx', | |||||
| height: '80rpx', | |||||
| borderRadius: '100rpx', | |||||
| bottom: '40rpx' | |||||
| }, | |||||
| commodityList: [ | |||||
| { | |||||
| title: '商品名称', | |||||
| smallTitle: '产品规格：120*4*75【桌子尺寸】', | |||||
| total:1, | |||||
| }, | |||||
| { | |||||
| title: '商品名称1', | |||||
| smallTitle: '产品规格：120*4*75【桌子尺寸】', | |||||
| total:1, | |||||
| }, | |||||
| { | |||||
| title: '商品名称2', | |||||
| smallTitle: '产品规格：120*4*75【桌子尺寸】', | |||||
| total:1, | |||||
| } | |||||
| ], | |||||
| commodity: { | |||||
| title: '商品名称', | |||||
| smallTitle: '产品规格：120*4*75【桌子尺寸】', | |||||
| total:1, | |||||
| }, | |||||
| } | |||||
| }, | |||||
| mounted() { | |||||
| }, | |||||
| methods: { | |||||
| openSpPopup() { | |||||
| this.$refs.spPopup.open('bottom'); | |||||
| }, | |||||
| // 选择退换货商品回调 | |||||
| selectCommodity(e) { | |||||
| console.log(e, "selectCommodity--e") | |||||
| this.commodity = e | |||||
| this.$refs.spPopup.close() | |||||
| }, | |||||
| confirm() { | |||||
| console.log("==="); | |||||
| }, | |||||
| deleteImage(e) { | |||||
| this.fileList.splice(e.index, 1) | |||||
| }, | |||||
| afterRead(e) { | |||||
| let self = this | |||||
| e.file.forEach(file => { | |||||
| self.$Oss.ossUpload(file.url).then(url => { | |||||
| self.fileList.push({ | |||||
| url | |||||
| }) | |||||
| }) | |||||
| }) | |||||
| }, | |||||
| } | |||||
| } | |||||
| </script> | |||||
| <style lang="scss" scoped> | |||||
| * { | |||||
| box-sizing: border-box; | |||||
| } | |||||
| .refundsOrExchange { | |||||
| .frame { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| gap: 30rpx; | |||||
| width: 100%; | |||||
| padding-top: 40rpx; | |||||
| background-color: #f5f5f5; | |||||
| .itme1 { | |||||
| display: flex; | |||||
| height: 200rpx; | |||||
| background-color: #ffffff; | |||||
| .left { | |||||
| padding: 40rpx; | |||||
| width: 20%; | |||||
| border-radius: 10rpx; | |||||
| background-color: #ffffff; | |||||
| } | |||||
| .center { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| justify-content: center; | |||||
| gap: 20rpx; | |||||
| width: 60%; | |||||
| padding: 0rpx 0 0 20rpx; | |||||
| background-color: #ffffff; | |||||
| // 给第一个 view 设置样式 | |||||
| > view:first-of-type { | |||||
| font-size: 36rpx; | |||||
| color: #333; | |||||
| } | |||||
| // 给第二个 view 设置样式 | |||||
| > view:nth-of-type(2) { | |||||
| font-size: 28rpx; | |||||
| color: #666666; | |||||
| } | |||||
| } | |||||
| .right { | |||||
| display: flex; | |||||
| justify-content: center; | |||||
| align-items: center; | |||||
| width: 10%; | |||||
| color: #666666; | |||||
| background-color: #ffffff; | |||||
| } | |||||
| } | |||||
| .item2 { | |||||
| width: 100vw; | |||||
| .type { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| background-color: #FFF; | |||||
| height: 80rpx; | |||||
| padding: 0 0 0 20rpx; | |||||
| > span:nth-of-type(1) { | |||||
| width: 30%; | |||||
| } | |||||
| > span:nth-of-type(2) { | |||||
| width: 70%; | |||||
| } | |||||
| } | |||||
| .reason { | |||||
| 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%; | |||||
| } | |||||
| > view:nth-of-type(2) { | |||||
| width: 70%; | |||||
| padding: 0 20rpx 0 0; | |||||
| } | |||||
| } | |||||
| } | |||||
| .item3 { | |||||
| width: 100vw; | |||||
| .type { | |||||
| display: flex; | |||||
| align-items: center; | |||||
| background-color: #FFF; | |||||
| height: 80rpx; | |||||
| padding: 0 0 0 20rpx; | |||||
| > span:nth-of-type(1) { | |||||
| width: 70%; | |||||
| } | |||||
| > span:nth-of-type(2) { | |||||
| width: 30%; | |||||
| } | |||||
| } | |||||
| .reason { | |||||
| 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%; | |||||
| } | |||||
| > view:nth-of-type(2) { | |||||
| width: 70%; | |||||
| padding: 0 20rpx 0 0; | |||||
| } | |||||
| } | |||||
| } | |||||
| .item4 { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| padding: 10rpx 0 0 20rpx; | |||||
| background-color: #FFF; | |||||
| > view:nth-of-type(1) { | |||||
| background-color: #FFF; | |||||
| } | |||||
| > view:nth-of-type(2) { | |||||
| margin: 10rpx 0 10rpx 0; | |||||
| background-color: #FFF; | |||||
| } | |||||
| } | |||||
| .item5 { | |||||
| display: flex; | |||||
| flex-direction: column; | |||||
| padding: 0 0 0 20rpx; | |||||
| background-color: #FFF; | |||||
| .phone { | |||||
| 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%; | |||||
| } | |||||
| > view:nth-of-type(2) { | |||||
| width: 70%; | |||||
| padding: 0 20rpx 0 0; | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| } | |||||
| </style> | |||||