|
@@ -1,1020 +0,0 @@
|
|
|
-<template>
|
|
|
- <view class="search-container">
|
|
|
- <!-- <or-search :theme="themeClass" @getSearchText="getSearchText"></or-search> -->
|
|
|
- <view class="search-main">
|
|
|
- <view class="search">
|
|
|
- <view class="search-input">
|
|
|
- <text class="iconfont icon-iconfonticonfontsousuo1"></text>
|
|
|
- <input
|
|
|
- maxlength="20"
|
|
|
- focus
|
|
|
- type="text"
|
|
|
- value=""
|
|
|
- confirm-type="search"
|
|
|
- @focus="onFocus"
|
|
|
- @input="onShowClose"
|
|
|
- @confirm="subMitSearch()"
|
|
|
- placeholder="请输入商品关键词"
|
|
|
- v-model.trim="listQuery.searchWord"
|
|
|
- />
|
|
|
- <text class="iconfont icon-shanchu1" v-if="isShowClose" @click="delInputText()"></text>
|
|
|
- </view>
|
|
|
- <view class="search-btn" @click="subMitSearch()">搜索</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="search-container-history" v-if="!isShowWrapper">
|
|
|
- <view :class="'s-' + themeClass" v-if="serachRecordList.length > 0">
|
|
|
- <view class="header">
|
|
|
- 搜索历史 <text class="iconfont icon-shanchu" @click="confirmDetele"></text>
|
|
|
- </view>
|
|
|
- <view class="list">
|
|
|
- <view
|
|
|
- v-for="(item, index) in serachRecordList"
|
|
|
- :key="index"
|
|
|
- @click="keywordsClick(item.searchWord)"
|
|
|
- >{{ item.searchWord }}</view
|
|
|
- >
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view
|
|
|
- class=" order-container"
|
|
|
- v-if="isShowWrapper"
|
|
|
- :style="{ overflow: 'auto', height: showSkeleton ? windowHeight + 'px' : 'auto' }"
|
|
|
- >
|
|
|
- <scroll-view
|
|
|
- class="tui-skeleton"
|
|
|
- :style="{ height: scrollHeight + 'px' }"
|
|
|
- @scrolltolower="scrolltolower"
|
|
|
- scroll-y
|
|
|
- >
|
|
|
- <view :class="{ 'tui-order-list': scrollTop >= 0 }" class="tui-skeleton clearfix">
|
|
|
- <!-- 空白页 -->
|
|
|
- <empty v-if="isShowEmpty" :navbarHeight="navbarHeight"></empty>
|
|
|
- <!-- 列表 -->
|
|
|
- <view v-else class="tui-order-content">
|
|
|
- <view
|
|
|
- class="tui-order-item"
|
|
|
- v-for="(order, orderIndex) in orderList"
|
|
|
- :key="orderIndex"
|
|
|
- @click.stop="detail(order.orderId)"
|
|
|
- >
|
|
|
- <view class="order-title">
|
|
|
- <view class="order-title-t">
|
|
|
- <text
|
|
|
- class="bage-buss tui-skeleton-fillet"
|
|
|
- v-if="order.orderSubmitType == 3 || order.orderSubmitType == 4"
|
|
|
- >协销</text
|
|
|
- >
|
|
|
- <text
|
|
|
- class="bage-auto tui-skeleton-fillet"
|
|
|
- v-if="
|
|
|
- order.orderSubmitType == 0 ||
|
|
|
- order.orderSubmitType == 1 ||
|
|
|
- order.orderSubmitType == 2
|
|
|
- "
|
|
|
- >自主</text
|
|
|
- >
|
|
|
- <text class="bage-text tui-skeleton-fillet">订单编号:{{ order.orderNo }}</text>
|
|
|
- <image
|
|
|
- class="bage-icon"
|
|
|
- src="https://static.caimei365.com/app/img/icon/icon-type@3x.png"
|
|
|
- mode="widthFix"
|
|
|
- v-if="order.secondHandOrderFlag == 1"
|
|
|
- ></image>
|
|
|
- </view>
|
|
|
- <view class="order-title-b">
|
|
|
- <view class="order-title-btxt tui-skeleton-fillet"
|
|
|
- >下单时间:{{ order.orderTime }}</view
|
|
|
- >
|
|
|
- <view class="order-title-tip tui-skeleton-fillet">{{
|
|
|
- StateExpFormat(order.status)
|
|
|
- }}</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <block v-for="(shop, index) in order.shopOrderList" :key="index">
|
|
|
- <view class="goods-title">
|
|
|
- <view v-if="shop.shopPromotion" class="floor-item-act">
|
|
|
- <view class="floor-tags">{{ shop.shopPromotion.name }}</view>
|
|
|
- </view>
|
|
|
- <view class="title-text tui-skeleton-fillet">{{ shop.shopName }}</view>
|
|
|
- </view>
|
|
|
- <view
|
|
|
- class="goods-item"
|
|
|
- v-for="(pros, prosIndex) in shop.orderProductList"
|
|
|
- :key="prosIndex"
|
|
|
- >
|
|
|
- <view class="goods-pros-t">
|
|
|
- <view class="pros-img tui-skeleton-fillet">
|
|
|
- <image :src="pros.image" alt="" />
|
|
|
- <text class="tips" v-if="pros.productType == 2 || pros.productType == 1"
|
|
|
- >赠品</text
|
|
|
- >
|
|
|
- </view>
|
|
|
- <view class="pros-product">
|
|
|
- <view class="producttitle tui-skeleton-fillet">{{ pros.name }}</view>
|
|
|
- <view
|
|
|
- class="productspec tui-skeleton-fillet"
|
|
|
- v-if="pros.productCategory != 2"
|
|
|
- >规格:{{ pros.productUnit }}</view
|
|
|
- >
|
|
|
- <view class="productprice">
|
|
|
- <view
|
|
|
- class="price tui-skeleton-fillet"
|
|
|
- :class="
|
|
|
- pros.svipPriceFlag == 1 ||
|
|
|
- PromotionsFormat(pros.productPromotion)
|
|
|
- ? 'none'
|
|
|
- : ''
|
|
|
- "
|
|
|
- >
|
|
|
- <text>¥{{ pros.price | NumFormat }}</text>
|
|
|
- </view>
|
|
|
- <view class="count tui-skeleton-fillet">
|
|
|
- <text class="small">x</text>{{ pros.num }}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="floor-item-act">
|
|
|
- <template v-if="pros.productPromotion">
|
|
|
- <view
|
|
|
- v-if="PromotionsFormat(pros.productPromotion)"
|
|
|
- class="floor-tags"
|
|
|
- @click.stop="clickPopupShow(pros.productPromotion)"
|
|
|
- >
|
|
|
- {{ pros.productPromotion.name }}
|
|
|
- <text
|
|
|
- v-if="
|
|
|
- pros.productPromotion != null &&
|
|
|
- pros.productPromotion.type != 3
|
|
|
- "
|
|
|
- >
|
|
|
- :¥{{
|
|
|
- pros.productPromotion == null
|
|
|
- ? '0.00'
|
|
|
- : pros.productPromotion.touchPrice | NumFormat
|
|
|
- }}
|
|
|
- </text>
|
|
|
- </view>
|
|
|
- <view
|
|
|
- v-else-if="pros.productPromotion.type != 3"
|
|
|
- class="floor-tags"
|
|
|
- @click.stop="clickPopupShow(pros.productPromotion)"
|
|
|
- >{{ pros.productPromotion.name }}</view
|
|
|
- >
|
|
|
- </template>
|
|
|
- <template v-if="pros.svipPriceFlag == 1">
|
|
|
- <view class="svip-tags">
|
|
|
- <view class="tags">SVIP</view>
|
|
|
- <view class="price">{{ pros.svipPriceTag }}</view>
|
|
|
- </view>
|
|
|
- </template>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </block>
|
|
|
- <view class="order-footer">
|
|
|
- <view class="order-footer-top" v-if="order.discountFee != 0"
|
|
|
- >经理折扣:¥{{ order.discountFee | NumFormat }}</view
|
|
|
- >
|
|
|
- <view class="order-footer-bot">
|
|
|
- <view class="count tui-skeleton-fillet">共{{ order.productCount }}件商品</view>
|
|
|
- <view
|
|
|
- class="money tui-skeleton-fillet"
|
|
|
- v-if="order.status == 31 || order.status == 32 || order.status == 33"
|
|
|
- >
|
|
|
- 已支付:<label style="color:#f94b4b ;"
|
|
|
- >¥{{ order.receiptAmount | NumFormat }}</label
|
|
|
- >
|
|
|
- </view>
|
|
|
- <view class="money tui-skeleton-fillet" v-else>
|
|
|
- 待付总额:<label style="color:#f94b4b ;"
|
|
|
- >¥{{ order.pendingPayments | NumFormat }}</label
|
|
|
- >
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 底部button -->
|
|
|
- <order-button
|
|
|
- ref="orderButton"
|
|
|
- :status="order.status"
|
|
|
- :order="order"
|
|
|
- :onlinePayFlag="order.onlinePayFlag"
|
|
|
- @buttonConfirm="handButtonConfirm"
|
|
|
- >
|
|
|
- </order-button>
|
|
|
- </view>
|
|
|
- <!--加载loadding-->
|
|
|
- <tui-loadmore :visible="loadding" :index="3" type="black"></tui-loadmore>
|
|
|
- <tui-nomore :visible="!pullUpOn" :backgroundColor="'#ffffff'" :text="nomoreText"></tui-nomore>
|
|
|
- <!--加载loadding-->
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </scroll-view>
|
|
|
- </view>
|
|
|
- <!-- 分享弹窗 -->
|
|
|
- <share-alert v-if="isShareModal" :orderId="btnoRderID" @shareConfirm="onShareAppMessage"> </share-alert>
|
|
|
- <!-- 透明模态层 -->
|
|
|
- <modal-layer v-if="isModalLayer"></modal-layer>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
-import orSearch from '@/components/uni-search/or-search.vue'
|
|
|
-import orderButton from '@/components/cm-module/orderDetails/orderListButton' //按钮
|
|
|
-import modalLayer from '@/components/modal-layer'
|
|
|
-import empty from './components/empty'
|
|
|
-import shareAlert from '@/components/cm-module/modelAlert/shareAlert' //分享弹窗
|
|
|
-import authorize from '@/common/config/authorize.js'
|
|
|
-const defaultListQuery = {
|
|
|
- pageNum: 1, // 页码
|
|
|
- pageSize: 10, // 每页条数
|
|
|
- userId: 0, // 用户Id
|
|
|
- searchWord: '' // 搜索关键词
|
|
|
-}
|
|
|
-export default {
|
|
|
- components: {
|
|
|
- orSearch,
|
|
|
- orderButton,
|
|
|
- empty,
|
|
|
- shareAlert,
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- listQuery: Object.assign({}, defaultListQuery),
|
|
|
- themeClass: 'block',
|
|
|
- isShowClose: false, // 是否显示清空输入框图标
|
|
|
- isSearchHistory: false, // 是都显示搜索历史
|
|
|
- serachRecordList: [],
|
|
|
- isShowWrapper: false,
|
|
|
- isModallayer: false,
|
|
|
- isShowEmpty: false,
|
|
|
- windowHeight: '',
|
|
|
- showSkeleton: true,
|
|
|
- orderList: [],
|
|
|
- btnoRderID: 0, // 点击按钮传入的的订单ID
|
|
|
- scrollTop: 0,
|
|
|
- skeletonShow: true,
|
|
|
- isShareModal: false, // 控制分享弹窗
|
|
|
- isCenceModal: false, // 控制取消订单弹窗
|
|
|
- isShowDelModal: false, // 控制删除订单弹窗
|
|
|
- isModalLayer: false,
|
|
|
- loadding: false,
|
|
|
- pullUpOn: true,
|
|
|
- hasNextPage: false,
|
|
|
- pullFlag: true,
|
|
|
- navbarHeight: '',
|
|
|
- nomoreText: '上拉显示更多',
|
|
|
- scrollHeight: '',
|
|
|
- beansType: 1,
|
|
|
- beanNumber: 0,
|
|
|
- isActivityBean: false
|
|
|
- }
|
|
|
- },
|
|
|
- onLoad() {
|
|
|
- this.initGetSerachRecord()
|
|
|
- },
|
|
|
- filters: {
|
|
|
- NumFormat(value) {
|
|
|
- //处理金额
|
|
|
- return Number(value).toFixed(2)
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- subMitSearch() {
|
|
|
- if (this.listQuery.searchWord == '') {
|
|
|
- this.$util.msg('请输入商品关键词', 2000)
|
|
|
- } else {
|
|
|
- this.commodityList = []
|
|
|
- this.getOrderDatainit()
|
|
|
- }
|
|
|
- },
|
|
|
- async initGetSerachRecord() {
|
|
|
- const userInfo = await this.$api.getStorage()
|
|
|
- this.listQuery.userId = userInfo.userId ? userInfo.userId : 0
|
|
|
- this.OrderService.SearchOrderHistory({ userId: this.listQuery.userId })
|
|
|
- .then(response => {
|
|
|
- this.serachRecordList = response.data
|
|
|
- if (this.serachRecordList.length > 0) {
|
|
|
- this.isSearchHistory = true
|
|
|
- } else {
|
|
|
- this.isSearchHistory = false
|
|
|
- }
|
|
|
- })
|
|
|
- .catch(error => {
|
|
|
- this.$util.msg(error.msg, 2000)
|
|
|
- })
|
|
|
- },
|
|
|
- onShowClose() {
|
|
|
- //输入框失去焦点时触发
|
|
|
- this.inputEmpty(this.listQuery.searchWord)
|
|
|
- },
|
|
|
- onFocus() {
|
|
|
- //输入框获取焦点时触发
|
|
|
- this.inputEmpty(this.listQuery.searchWord)
|
|
|
- this.initGetSerachRecord()
|
|
|
- },
|
|
|
- delInputText() {
|
|
|
- //清除输入框内容
|
|
|
- this.listQuery.searchWord = ''
|
|
|
- this.isShowClose = false
|
|
|
- this.isShowWrapper = false
|
|
|
- this.inputEmpty(this.listQuery.searchWord)
|
|
|
- this.initGetSerachRecord()
|
|
|
- },
|
|
|
- keywordsClick(item) {
|
|
|
- //关键词搜索与历史搜索
|
|
|
- this.listQuery.searchWord = item
|
|
|
- this.isShowClose = true
|
|
|
- this.subMitSearch()
|
|
|
- },
|
|
|
- confirmDetele() {
|
|
|
- //清空历史记录
|
|
|
- this.$util.modal('提示', '确定删除历史记录?', '确定', '取消', true, () => {
|
|
|
- this.OrderService.ClearOrderHistory({ userId: this.listQuery.userId })
|
|
|
- .then(response => {
|
|
|
- this.$util.msg('删除记录成功', 2000, true, 'success')
|
|
|
- this.serachRecordList = []
|
|
|
- })
|
|
|
- .catch(error => {
|
|
|
- this.$util.msg(error.msg, 2000)
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
- inputEmpty(val) {
|
|
|
- this.isShowWrapper = false
|
|
|
- if (val != '') {
|
|
|
- this.isShowClose = true
|
|
|
- } else {
|
|
|
- this.isShowClose = false
|
|
|
- }
|
|
|
- },
|
|
|
- getOrderDatainit(index, source) {
|
|
|
- this.OrderService.SearchOrderInfo(this.listQuery)
|
|
|
- .then(response => {
|
|
|
- this.isShowWrapper = true
|
|
|
- this.showSkeleton = true
|
|
|
- let data = response.data
|
|
|
- if (data && data.list.length > 0) {
|
|
|
- let filrerData = data.list.filter(item => {
|
|
|
- //添加不同状态下订单的表现形式
|
|
|
- item = Object.assign(item, this.StateExpFormat(item.status))
|
|
|
- return item
|
|
|
- })
|
|
|
- this.orderList = []
|
|
|
- filrerData.forEach(item => {
|
|
|
- this.orderList.push(item)
|
|
|
- })
|
|
|
- this.hasNextPage = data
|
|
|
- if (this.hasNextPage) {
|
|
|
- this.pullUpOn = false
|
|
|
- this.nomoreText = '上拉显示更多'
|
|
|
- } else {
|
|
|
- if (this.orderList.length < 2) {
|
|
|
- this.pullUpOn = true
|
|
|
- } else {
|
|
|
- this.pullUpOn = false
|
|
|
- this.nomoreText = '已至底部'
|
|
|
- }
|
|
|
- }
|
|
|
- this.isShowEmpty = false
|
|
|
- } else {
|
|
|
- this.isShowEmpty = true
|
|
|
- }
|
|
|
- })
|
|
|
- .catch(error => {
|
|
|
- this.$util.msg(error.msg, 2000)
|
|
|
- })
|
|
|
- },
|
|
|
- getOnReachBottomData() {
|
|
|
- //上拉加载
|
|
|
- this.listQuery.pageNum += 1
|
|
|
- this.OrderService.SearchOrderInfo(this.listQuery)
|
|
|
- .then(response => {
|
|
|
- let data = response.data
|
|
|
- this.hasNextPage = data.hasNextPage
|
|
|
- this.orderList = this.orderList.concat(data.list)
|
|
|
- this.pullFlag = false // 防上拉暴滑
|
|
|
- setTimeout(() => {
|
|
|
- this.pullFlag = true
|
|
|
- }, 500)
|
|
|
- if (this.hasNextPage) {
|
|
|
- this.pullUpOn = false
|
|
|
- this.nomoreText = '上拉显示更多'
|
|
|
- } else {
|
|
|
- this.loadding = false
|
|
|
- this.pullUpOn = false
|
|
|
- this.nomoreText = '已至底部'
|
|
|
- }
|
|
|
- })
|
|
|
- .catch(error => {
|
|
|
- this.$util.msg(error.msg, 2000)
|
|
|
- })
|
|
|
- },
|
|
|
- scrolltolower() {
|
|
|
- if (this.hasNextPage) {
|
|
|
- this.loadding = true
|
|
|
- this.pullUpOn = true
|
|
|
- this.showSkeleton = false
|
|
|
- this.getOnReachBottomData()
|
|
|
- }
|
|
|
- },
|
|
|
- detail(orderId) {
|
|
|
- //订单详情跳转
|
|
|
- this.isModalLayer = true
|
|
|
- this.$api.navigateTo(`/pages/user/order/order-details?type=search&orderId=${orderId}`)
|
|
|
- },
|
|
|
- handButtonConfirm(data) {
|
|
|
- //获取点击
|
|
|
- this.handShowAlert(data)
|
|
|
- this.btnoRderID = data.orderId
|
|
|
- },
|
|
|
- handShowAlert(data) {
|
|
|
- //执行
|
|
|
- switch (data.type) {
|
|
|
- case 'delete':
|
|
|
- this.handOrderDetele(data.orderId)
|
|
|
- break
|
|
|
- case 'cancel':
|
|
|
- this.handCenceConfirm(data.orderId)
|
|
|
- break
|
|
|
- case 'query':
|
|
|
- this.isModalLayer = true
|
|
|
- this.$api.navigateTo('/pages/user/order/order-logistics?orderId=' + data.orderId)
|
|
|
- break
|
|
|
- case 'confirm':
|
|
|
- this.handOrderConfirm(data.orderId)
|
|
|
- break
|
|
|
- case 'confirmation':
|
|
|
- this.handOrderConfirmation(data.orderId)
|
|
|
- break
|
|
|
- }
|
|
|
- },
|
|
|
- handOrderConfirm(orderId) {
|
|
|
- //确认收货
|
|
|
- this.$util.modal('提示', '是否确认收货', '确定', '取消', true, () => {
|
|
|
- this.OrderService.ConfirmReceipt({ orderId: orderId })
|
|
|
- .then(response => {
|
|
|
- this.beansType = 7
|
|
|
- this.beanNumber = 100
|
|
|
- this.isActivityBean = true
|
|
|
- })
|
|
|
- .catch(error => {
|
|
|
- this.$util.msg(error.msg, 2000)
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
- handOrderConfirmation(orderId) {
|
|
|
- //确认订单
|
|
|
- this.$util.modal('提示', '确认此订单?', '确定', '取消', true, () => {
|
|
|
- this.OrderService.AffirmOrder({ orderId: orderId })
|
|
|
- .then(response => {
|
|
|
- this.$util.msg(response.msg, 2000, true, 'success')
|
|
|
- setTimeout(() => {
|
|
|
- this.getOrderDatainit()
|
|
|
- }, 2000)
|
|
|
- })
|
|
|
- .catch(error => {
|
|
|
- this.$util.msg(error.msg, 2000)
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
- handOrderDetele(orderId) {
|
|
|
- //删除订单
|
|
|
- this.$util.modal('提示', '确认删除该订单吗?', '确定', '取消', true, () => {
|
|
|
- this.OrderService.DeleteOrder({ orderId: orderId })
|
|
|
- .then(response => {
|
|
|
- this.$util.msg(response.msg, 2000, true, 'success')
|
|
|
- setTimeout(() => {
|
|
|
- this.getOrderDatainit()
|
|
|
- }, 2000)
|
|
|
- })
|
|
|
- .catch(error => {
|
|
|
- this.$util.msg(error.msg, 2000)
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
- handCenceConfirm(orderId) {
|
|
|
- //取消订单
|
|
|
- this.$util.modal('提示', '确认取消该订单吗?', '确定', '取消', true, () => {
|
|
|
- this.OrderService.CancelOrder({ orderId: orderId , userIdentity : 0})
|
|
|
- .then(response => {
|
|
|
- this.$util.msg(response.msg, 2000, true, 'success')
|
|
|
- setTimeout(() => {
|
|
|
- this.getOrderDatainit()
|
|
|
- }, 2000)
|
|
|
- })
|
|
|
- .catch(error => {
|
|
|
- this.$util.msg(error.msg, 2000)
|
|
|
- })
|
|
|
- })
|
|
|
- },
|
|
|
- onShareAppMessage(res) {
|
|
|
- //分享转发
|
|
|
- this.isShareModal = false
|
|
|
- if (res.from === 'button') {
|
|
|
- // 来自页面内转发按钮
|
|
|
- }
|
|
|
- return {
|
|
|
- title: '您有新的分享订单,快来查看吧~',
|
|
|
- path: `/pages/user/order/order-sharelogin?orderID=${this.btnoRderID}&userId=${this.listQuery.userId}`,
|
|
|
- imageUrl: 'https://static.caimei365.com/app/img/bg/min-banner.jpg'
|
|
|
- }
|
|
|
- },
|
|
|
- setScrollHeight() {
|
|
|
- const { windowHeight, pixelRatio } = wx.getSystemInfoSync()
|
|
|
- this.windowHeight = windowHeight - 1
|
|
|
- this.scrollHeight = windowHeight - 1
|
|
|
- },
|
|
|
- PromotionsFormat(promo) {
|
|
|
- //促销活动类型数据处理
|
|
|
- if (promo != null) {
|
|
|
- if (promo.type == 1 && promo.mode == 1) {
|
|
|
- return true
|
|
|
- } else {
|
|
|
- return false
|
|
|
- }
|
|
|
- }
|
|
|
- return false
|
|
|
- },
|
|
|
- StateExpFormat(state) {
|
|
|
- //订单状态文字和颜色
|
|
|
- var HtmlStateText = '',
|
|
|
- stateTextObject = {
|
|
|
- 0: '待确认',
|
|
|
- 4: '交易完成',
|
|
|
- 5: '订单完成',
|
|
|
- 6: '已关闭',
|
|
|
- 7: '交易全退',
|
|
|
- 77: '交易全退',
|
|
|
- 11: '待付款待发货',
|
|
|
- 12: '待付款部分发货',
|
|
|
- 13: '待付款已发货',
|
|
|
- 21: '部分付款待发货',
|
|
|
- 22: '部分付款部分发货',
|
|
|
- 23: '部分付款已发货',
|
|
|
- 31: '已付款待发货',
|
|
|
- 32: '已付款部分发货',
|
|
|
- 33: '已付款已发货',
|
|
|
- 111: '待付款待发货'
|
|
|
- }
|
|
|
- Object.keys(stateTextObject).forEach(function(key) {
|
|
|
- if (key == state) {
|
|
|
- HtmlStateText = stateTextObject[key]
|
|
|
- }
|
|
|
- })
|
|
|
- return HtmlStateText
|
|
|
- },
|
|
|
- handleBeanlClick() {
|
|
|
- //关闭采美豆弹窗
|
|
|
- this.isActivityBean = false
|
|
|
- this.getOrderDatainit()
|
|
|
- }
|
|
|
- },
|
|
|
- onPageScroll(e) {
|
|
|
- this.scrollTop = e.scrollTop
|
|
|
- },
|
|
|
- onShow() {
|
|
|
- this.setScrollHeight()
|
|
|
- }
|
|
|
-}
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="scss">
|
|
|
-@import '@/uni.scss';
|
|
|
-page {
|
|
|
- background-color: #f7f7f7 !important;
|
|
|
-}
|
|
|
-.search {
|
|
|
- width: 702rpx;
|
|
|
- height: 70rpx;
|
|
|
- padding: 12rpx 24rpx;
|
|
|
- border-bottom: 1px solid #f0f0f0;
|
|
|
- position: fixed;
|
|
|
- top: 0;
|
|
|
- left: 0;
|
|
|
- background: #ffffff;
|
|
|
- z-index: 1001;
|
|
|
- .search-input {
|
|
|
- width: 448rpx;
|
|
|
- height: 70rpx;
|
|
|
- padding: 0 68rpx;
|
|
|
- line-height: 70rpx;
|
|
|
- border-radius: 40rpx;
|
|
|
- position: relative;
|
|
|
- background: #f0f0f0;
|
|
|
- float: left;
|
|
|
- .icon-iconfonticonfontsousuo1 {
|
|
|
- font-size: 36rpx;
|
|
|
- color: #8a8a8a;
|
|
|
- position: absolute;
|
|
|
- left: 24rpx;
|
|
|
- z-index: 10;
|
|
|
- }
|
|
|
- .icon-shanchu1 {
|
|
|
- font-size: 36rpx;
|
|
|
- color: #8a8a8a;
|
|
|
- position: absolute;
|
|
|
- right: 24rpx;
|
|
|
- top: 0;
|
|
|
- padding: 0 10rpx;
|
|
|
- z-index: 10;
|
|
|
- }
|
|
|
- input {
|
|
|
- width: 448rpx;
|
|
|
- height: 70rpx;
|
|
|
- background-color: #f0f0f0;
|
|
|
- font-size: 26rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- .search-btn {
|
|
|
- width: 118rpx;
|
|
|
- height: 70rpx;
|
|
|
- line-height: 70rpx;
|
|
|
- color: $color-system;
|
|
|
- font-size: 30rpx;
|
|
|
- text-align: center;
|
|
|
- float: left;
|
|
|
- }
|
|
|
- .voice-icon {
|
|
|
- width: 36rpx;
|
|
|
- height: 36rpx;
|
|
|
- padding: 16rpx 20rpx 16rpx 0;
|
|
|
- position: absolute;
|
|
|
- left: 16rpx;
|
|
|
- top: 4rpx;
|
|
|
- z-index: 10;
|
|
|
- }
|
|
|
-}
|
|
|
-.search-container {
|
|
|
- padding-top: 106rpx;
|
|
|
-}
|
|
|
-.s-block {
|
|
|
- background: #ffffff;
|
|
|
- .header {
|
|
|
- font-size: 32rpx;
|
|
|
- padding: 40rpx 24rpx 22rpx 24rpx;
|
|
|
- line-height: 42rpx;
|
|
|
- font-size: 30rpx;
|
|
|
- font-weight: bold;
|
|
|
- position: relative;
|
|
|
- .icon-shanchu {
|
|
|
- font-size: 36rpx;
|
|
|
- color: #333333;
|
|
|
- float: right;
|
|
|
- padding: 0 10rpx;
|
|
|
- z-index: 10;
|
|
|
- font-weight: normal;
|
|
|
- }
|
|
|
- }
|
|
|
- .list {
|
|
|
- display: flex;
|
|
|
- flex-wrap: wrap;
|
|
|
- padding-bottom: 40rpx;
|
|
|
- view {
|
|
|
- color: #8a8a8a;
|
|
|
- font-size: 24rpx;
|
|
|
- box-sizing: border-box;
|
|
|
- text-align: center;
|
|
|
- height: 48rpx;
|
|
|
- line-height: 48rpx;
|
|
|
- border-radius: 24rpx;
|
|
|
- margin: 12rpx;
|
|
|
- padding: 0 30rpx;
|
|
|
- overflow: hidden;
|
|
|
- white-space: nowrap;
|
|
|
- text-overflow: ellipsis;
|
|
|
- background-color: #f3f3f3;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-.s-circle {
|
|
|
- margin-top: 30rpx;
|
|
|
- .header {
|
|
|
- font-size: 32rpx;
|
|
|
- padding: 30rpx;
|
|
|
- border-bottom: 2rpx solid #f9f9f9;
|
|
|
- position: relative;
|
|
|
- image {
|
|
|
- width: 36rpx;
|
|
|
- height: 36rpx;
|
|
|
- padding: 10rpx;
|
|
|
- position: absolute;
|
|
|
- right: 40rpx;
|
|
|
- top: 24rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- .list {
|
|
|
- display: flex;
|
|
|
- flex-wrap: wrap;
|
|
|
- padding: 0 30rpx 20rpx;
|
|
|
- view {
|
|
|
- padding: 8rpx 30rpx;
|
|
|
- margin: 20rpx 30rpx 0 0;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #8a8a8a;
|
|
|
- background-color: #f7f7f7;
|
|
|
- box-sizing: border-box;
|
|
|
- text-align: center;
|
|
|
- border-radius: 20rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-.wanted-block {
|
|
|
- margin-top: 30rpx;
|
|
|
- .header {
|
|
|
- font-size: 32rpx;
|
|
|
- padding: 30rpx;
|
|
|
- }
|
|
|
- .list {
|
|
|
- display: flex;
|
|
|
- flex-wrap: wrap;
|
|
|
- view {
|
|
|
- width: 50%;
|
|
|
- color: #8a8a8a;
|
|
|
- font-size: 28rpx;
|
|
|
- box-sizing: border-box;
|
|
|
- text-align: center;
|
|
|
- padding: 20rpx 0;
|
|
|
- border-top: 2rpx solid #fff;
|
|
|
- border-left: 2rpx solid #fff;
|
|
|
- background-color: #f7f7f7;
|
|
|
- overflow: hidden;
|
|
|
- white-space: nowrap;
|
|
|
- text-overflow: ellipsis;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-.wanted-circle {
|
|
|
- margin-top: 30rpx;
|
|
|
- .header {
|
|
|
- font-size: 32rpx;
|
|
|
- padding: 30rpx;
|
|
|
- }
|
|
|
- .list {
|
|
|
- display: flex;
|
|
|
- flex-wrap: wrap;
|
|
|
- padding: 0 30rpx 20rpx;
|
|
|
- view {
|
|
|
- padding: 8rpx 30rpx;
|
|
|
- margin: 20rpx 30rpx 0 0;
|
|
|
- font-size: 28rpx;
|
|
|
- color: #8a8a8a;
|
|
|
- background-color: #f7f7f7;
|
|
|
- box-sizing: border-box;
|
|
|
- text-align: center;
|
|
|
- border-radius: 20rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-.order-container {
|
|
|
- scroll-view {
|
|
|
- height: 100%;
|
|
|
- overflow: scroll;
|
|
|
- }
|
|
|
-}
|
|
|
-.container {
|
|
|
- padding-bottom: env(safe-area-inset-bottom);
|
|
|
- height: auto;
|
|
|
- position: relative;
|
|
|
-}
|
|
|
-.tui-order-content {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
-}
|
|
|
-.tui-order-list {
|
|
|
- width: 100%;
|
|
|
- position: relative;
|
|
|
-}
|
|
|
-.tui-order-item {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- width: 702rpx;
|
|
|
- padding: 20rpx 24rpx 0 24rpx;
|
|
|
- background: #fff;
|
|
|
- border-bottom: 20rpx solid #f7f7f7;
|
|
|
-}
|
|
|
-.order-title {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
- .order-title-t {
|
|
|
- width: 100%;
|
|
|
- height: 68rpx;
|
|
|
- float: left;
|
|
|
- line-height: 68rpx;
|
|
|
- position: relative;
|
|
|
- .bage-icon {
|
|
|
- width: 50rpx;
|
|
|
- height: 50rpx;
|
|
|
- display: block;
|
|
|
- position: absolute;
|
|
|
- right: 0;
|
|
|
- top: 9rpx;
|
|
|
- }
|
|
|
- .bage-buss {
|
|
|
- display: inline-block;
|
|
|
- width: 72rpx;
|
|
|
- height: 30rpx;
|
|
|
- background: radial-gradient(circle, rgba(255, 39, 180, 1) 0%, rgba(193, 77, 245, 1) 100%);
|
|
|
- border-radius: 4rpx;
|
|
|
- line-height: 30rpx;
|
|
|
- font-size: $font-size-22;
|
|
|
- text-align: center;
|
|
|
- color: #ffffff;
|
|
|
- }
|
|
|
- .bage-auto {
|
|
|
- display: inline-block;
|
|
|
- width: 72rpx;
|
|
|
- height: 30rpx;
|
|
|
- background: radial-gradient(circle, rgba(255, 180, 39, 1) 0%, rgba(245, 142, 77, 1) 100%);
|
|
|
- border-radius: 4rpx;
|
|
|
- line-height: 30rpx;
|
|
|
- font-size: $font-size-22;
|
|
|
- text-align: center;
|
|
|
- color: #ffffff;
|
|
|
- }
|
|
|
- .bage-text {
|
|
|
- display: inline-block;
|
|
|
- font-size: $font-size-28;
|
|
|
- line-height: 68rpx;
|
|
|
- text-align: left;
|
|
|
- color: $color-system;
|
|
|
- margin-left: 10rpx;
|
|
|
- }
|
|
|
- }
|
|
|
- .order-title-b {
|
|
|
- width: 100%;
|
|
|
- height: 40rpx;
|
|
|
- float: left;
|
|
|
- margin-top: 8rpx;
|
|
|
- .order-title-btxt {
|
|
|
- float: left;
|
|
|
- font-size: $font-size-28;
|
|
|
- line-height: 40rpx;
|
|
|
- color: #999999;
|
|
|
- text-align: lef;
|
|
|
- }
|
|
|
- .order-title-tip {
|
|
|
- float: right;
|
|
|
- font-size: $font-size-28;
|
|
|
- line-height: 40rpx;
|
|
|
- text-align: right;
|
|
|
- color: #ff2a2a;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-.goods-title {
|
|
|
- width: 100%;
|
|
|
- height: 56rpx;
|
|
|
- float: left;
|
|
|
- margin-top: 10rpx;
|
|
|
- .floor-item-act {
|
|
|
- height: 56rpx;
|
|
|
- text-align: center;
|
|
|
- box-sizing: border-box;
|
|
|
- float: left;
|
|
|
- padding: 10rpx 0;
|
|
|
- margin-right: 12rpx;
|
|
|
- }
|
|
|
- .title-text {
|
|
|
- width: 400rpx;
|
|
|
- overflow: hidden;
|
|
|
- text-overflow: ellipsis;
|
|
|
- white-space: nowrap;
|
|
|
- float: left;
|
|
|
- font-size: $font-size-28;
|
|
|
- color: $text-color;
|
|
|
- text-align: left;
|
|
|
- line-height: 56rpx;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
-}
|
|
|
-.goods-item {
|
|
|
- width: 100%;
|
|
|
- height: auto;
|
|
|
-}
|
|
|
-.goods-pros-t {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- width: 100%;
|
|
|
- height: 217rpx;
|
|
|
- padding: 24rpx 0;
|
|
|
- .pros-img {
|
|
|
- float: left;
|
|
|
- width: 210rpx;
|
|
|
- height: 100%;
|
|
|
- border-radius: 10rpx;
|
|
|
- margin: 0 26rpx 0 0;
|
|
|
- position: relative;
|
|
|
- .tips {
|
|
|
- display: inline-block;
|
|
|
- width: 80rpx;
|
|
|
- height: 40rpx;
|
|
|
- background-image: linear-gradient(214deg, #ff4500 0%, #ff5800 53%, #ff4367 100%);
|
|
|
- line-height: 40rpx;
|
|
|
- text-align: center;
|
|
|
- font-size: $font-size-24;
|
|
|
- color: #ffffff;
|
|
|
- border-radius: 10rpx 0 10rpx 0;
|
|
|
- position: absolute;
|
|
|
- top: 0;
|
|
|
- left: 0;
|
|
|
- }
|
|
|
- image {
|
|
|
- width: 210rpx;
|
|
|
- height: 210rpx;
|
|
|
- border-radius: 10rpx;
|
|
|
- border: 1px solid #f3f3f3;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-.pros-product {
|
|
|
- width: 468rpx;
|
|
|
- height: 100%;
|
|
|
- line-height: 36rpx;
|
|
|
- font-size: $font-size-26;
|
|
|
- position: relative;
|
|
|
- .producttitle {
|
|
|
- width: 100%;
|
|
|
- display: inline-block;
|
|
|
- height: auto;
|
|
|
- text-overflow: ellipsis;
|
|
|
- display: -webkit-box;
|
|
|
- word-break: break-all;
|
|
|
- -webkit-box-orient: vertical;
|
|
|
- -webkit-line-clamp: 2;
|
|
|
- overflow: hidden;
|
|
|
- margin-bottom: 8rpx;
|
|
|
- }
|
|
|
- .productspec {
|
|
|
- height: 36rpx;
|
|
|
- color: #999999;
|
|
|
- }
|
|
|
- .productprice {
|
|
|
- height: 48rpx;
|
|
|
- position: absolute;
|
|
|
- width: 100%;
|
|
|
- bottom: 0;
|
|
|
- .price {
|
|
|
- line-height: 48rpx;
|
|
|
- font-size: $font-size-28;
|
|
|
- width: 48%;
|
|
|
- color: #ff2a2a;
|
|
|
- float: left;
|
|
|
- font-weight: bold;
|
|
|
- &.none {
|
|
|
- text-decoration: line-through;
|
|
|
- color: #999999;
|
|
|
- }
|
|
|
- }
|
|
|
- .count {
|
|
|
- height: 100%;
|
|
|
- float: right;
|
|
|
- position: relative;
|
|
|
- .small {
|
|
|
- color: #666666;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .floor-item-act {
|
|
|
- width: 100%;
|
|
|
- height: 56rpx;
|
|
|
- text-align: center;
|
|
|
- box-sizing: border-box;
|
|
|
- float: left;
|
|
|
- padding: 0 0 10rpx 0;
|
|
|
- }
|
|
|
-}
|
|
|
-.order-footer {
|
|
|
- width: 100%;
|
|
|
- height: 78rpx;
|
|
|
- float: left;
|
|
|
- .order-footer-top {
|
|
|
- width: 100%;
|
|
|
- height: 34rpx;
|
|
|
- line-height: 34rpx;
|
|
|
- font-size: $font-size-24;
|
|
|
- color: #999999;
|
|
|
- text-align: right;
|
|
|
- }
|
|
|
- .order-footer-bot {
|
|
|
- width: 100%;
|
|
|
- float: left;
|
|
|
- height: 48rpx;
|
|
|
- line-height: 48rpx;
|
|
|
- font-size: $font-size-28;
|
|
|
- font-weight: bold;
|
|
|
- color: $text-color;
|
|
|
- .count {
|
|
|
- width: 50%;
|
|
|
- float: left;
|
|
|
- text-align: left;
|
|
|
- }
|
|
|
- .money {
|
|
|
- width: 50%;
|
|
|
- float: right;
|
|
|
- text-align: right;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|