|
|
@@ -0,0 +1,797 @@
|
|
|
+<template>
|
|
|
+ <view class="container">
|
|
|
+ <view class="order-type-info">
|
|
|
+ <view class="order-type-title">{{orderType.title}}</view>
|
|
|
+ <view class="order-type-text">{{orderType.text}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="address-info-box">
|
|
|
+ <view class="address-icon">
|
|
|
+ <text class="iconfont icondizhi"></text>
|
|
|
+ </view>
|
|
|
+ <view class="address-content">
|
|
|
+ <text class="address-info">
|
|
|
+ <text class="address-name">{{orderData.recName}}</text>
|
|
|
+ <text class="address-phone">{{orderData.recMobile}}</text>
|
|
|
+ </text>
|
|
|
+ <view class="address-detail">{{orderData.address}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="goods-info-box">
|
|
|
+ <view class="shop-info">
|
|
|
+ <text class="iconfont icondianpu"></text>
|
|
|
+ <text class="shop-name">{{orderData.merchantInfoResVO.supplierName}}</text>
|
|
|
+ <text class="iconfont iconfangxiang"></text>
|
|
|
+ </view>
|
|
|
+ <view class="goods-list">
|
|
|
+ <view class="goods-row" v-for="(item, index) in orderData.merchantInfoResVO.products" :key="index">
|
|
|
+ <cover-image class="goods-img" :src="item.imgUrl"></cover-image>
|
|
|
+ <view class="goods-info">
|
|
|
+ <view class="goods-name">{{item.productName}}</view>
|
|
|
+ <view class="goods-type">
|
|
|
+ 类型：{{item.productType == 1 ? '普通商品' : (item.productType == 2 ? '拍卖商品' : (item.productType == 3 ? '自助采摘' : '共享种植'))}}
|
|
|
+ </view>
|
|
|
+ <view class="plant-area" v-if="item.productType == 4">面积：{{item.areaSize}}㎡</view>
|
|
|
+ <view class="goods-price-number">
|
|
|
+ <text class="goods-unit">￥</text>
|
|
|
+ <text class="goods-price">{{item.bizPrice}}</text>
|
|
|
+ <text class="goods-number">x{{item.buyNum}}</text>
|
|
|
+ <text class="plant-text" v-if="item.productType == 4">有效期：{{item.term}}天</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="order-info">
|
|
|
+ <u-cell-group :border="false">
|
|
|
+ <u-cell-item title="商品金额" :value="'￥' + orderData.orderSum" :arrow="false" :border-bottom="false"></u-cell-item>
|
|
|
+ <u-cell-item title="积分抵扣" :value="'-￥' + orderData.integralAmount" :arrow="false" :border-bottom="false" v-if="goodType == 1"></u-cell-item>
|
|
|
+ <u-cell-item title="优惠卷" :value="'-￥' + orderData.couponDiscountAmount" :arrow="false" :border-bottom="false" v-if="goodType == 1"></u-cell-item>
|
|
|
+ <u-cell-item title="备注" :value="orderData.notes" :arrow="false" :border-bottom="false"></u-cell-item>
|
|
|
+ </u-cell-group>
|
|
|
+ </view>
|
|
|
+ <view class="pay-info">
|
|
|
+ <text class="pay-text">实付款</text>
|
|
|
+ <text class="pay-price">￥{{orderData.paySum}}</text>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="order-info-box" @click="goToMessage()">
|
|
|
+ <view class="info-title-box">
|
|
|
+ <view class="info-title">留言板</view>
|
|
|
+ <text class="iconfont iconfangxiang"></text>
|
|
|
+ </view>
|
|
|
+ <view class="info-content-box">
|
|
|
+ <view class="message-row" v-for="(item, index1) in orderData.leas" :key="index1">
|
|
|
+ <cover-image class="message-head" :src="item.imgUrl"></cover-image>
|
|
|
+ <view class="message-info-box">
|
|
|
+ <view class="message-name">{{item.leaMsgType}}</view>
|
|
|
+ <view class="message-date">{{item.leaMsgTime}}</view>
|
|
|
+ <view class="message-text">{{item.leaMsgContent}}</view>
|
|
|
+ <view class="message-img-box" v-for="(site, index2) in item.orderLeaImgResVOs" :key="index2">
|
|
|
+ <cover-image class="message-img" :src="site.imgUrl"></cover-image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="order-info-box">
|
|
|
+ <view class="info-title-box">
|
|
|
+ <view class="info-title">订单信息</view>
|
|
|
+ </view>
|
|
|
+ <view class="info-content-box">
|
|
|
+ <view class="order-info-row">订单编号：{{orderData.orderCode}}</view>
|
|
|
+ <view class="order-info-row">创建时间：{{orderData.addOrderTime}}</view>
|
|
|
+ <view class="order-info-row" v-if="orderData.orderStatus > 1 && orderData.orderStatus != 6">支付时间：{{orderData.payTime}}</view>
|
|
|
+ <view class="order-info-row" v-if="orderData.orderStatus > 2 && orderData.orderStatus != 6">发货时间：{{orderData.sendTime}}</view>
|
|
|
+ <view class="order-info-row" v-if="orderData.orderStatus > 3 && orderData.orderStatus != 6">收货时间：{{orderData.confirmTime}}</view>
|
|
|
+ <view class="order-info-row" v-if="orderData.orderStatus == 6">取消时间：{{orderData.cancelTime}}</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <uni-goods-nav :fill="true" :options="[]" @click="" @buttonClick="orderHandle" class="order-handle" :buttonGroup="buttonGroup" />
|
|
|
+ <u-modal v-model="modalShow" :content="modalContent" @confirm="submitHandle" :async-close="true" :show-cancel-button="true"></u-modal>
|
|
|
+ <u-top-tips ref="uTips"></u-top-tips>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ const NET = require('@/utils/request')
|
|
|
+ const API = require('@/config/api')
|
|
|
+ export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ orderType: {
|
|
|
+ title: '',
|
|
|
+ text: '',
|
|
|
+ },
|
|
|
+ orderData: {
|
|
|
+ orderId: '',
|
|
|
+ orderStatus: 1,
|
|
|
+ addOrderTime: '',
|
|
|
+ recName: '',
|
|
|
+ recMobile: '',
|
|
|
+ address: '',
|
|
|
+ merchantInfoResVO: {
|
|
|
+ supplierName: '',
|
|
|
+ products: [],
|
|
|
+ },
|
|
|
+ orderSum: 0,
|
|
|
+ integralAmount: 0,
|
|
|
+ couponDiscountAmount: 0,
|
|
|
+ notes: 'xxxxx',
|
|
|
+ paySum: 0,
|
|
|
+ leas: [],
|
|
|
+ orderCode: '',
|
|
|
+ payTime: '',
|
|
|
+ sendTime: '',
|
|
|
+ confirmTime: '',
|
|
|
+ cancelTime: '',
|
|
|
+ tenantCode: '',
|
|
|
+ evaluateReplyStatus: 1,
|
|
|
+ },
|
|
|
+ goodType: 1,
|
|
|
+ buttonGroup: [],
|
|
|
+ modalShow: false,
|
|
|
+ handleType: '',
|
|
|
+ modalContent: '',
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(options) {
|
|
|
+ this.userData = uni.getStorageSync("userData")
|
|
|
+ this.orderStatus = options.orderStatus
|
|
|
+ switch (this.orderStatus) {
|
|
|
+ case '1':
|
|
|
+ this.buttonGroup = [{
|
|
|
+ text: '取消订单',
|
|
|
+ backgroundColor: '#75BD60',
|
|
|
+ color: '#fff'
|
|
|
+ }, {
|
|
|
+ text: '立即支付',
|
|
|
+ backgroundColor: '#52A63A',
|
|
|
+ color: '#fff'
|
|
|
+ }]
|
|
|
+ break;
|
|
|
+ case '2':
|
|
|
+ this.buttonGroup = [{
|
|
|
+ text: '申请售后',
|
|
|
+ backgroundColor: '#75BD60',
|
|
|
+ color: '#fff'
|
|
|
+ }, {
|
|
|
+ text: '自助采摘',
|
|
|
+ backgroundColor: '#52A63A',
|
|
|
+ color: '#fff'
|
|
|
+ }]
|
|
|
+ break;
|
|
|
+ case '3':
|
|
|
+ this.buttonGroup = [{
|
|
|
+ text: '申请售后',
|
|
|
+ backgroundColor: '#52A63A',
|
|
|
+ color: '#fff'
|
|
|
+ }, {
|
|
|
+ text: '确认收货',
|
|
|
+ backgroundColor: '#52A63A',
|
|
|
+ color: '#fff'
|
|
|
+ }, {
|
|
|
+ text: '追踪物流',
|
|
|
+ backgroundColor: '#52A63A',
|
|
|
+ color: '#fff'
|
|
|
+ }]
|
|
|
+ break;
|
|
|
+ case '4':
|
|
|
+ this.buttonGroup = [{
|
|
|
+ text: '申请售后',
|
|
|
+ backgroundColor: '#75BD60',
|
|
|
+ color: '#fff'
|
|
|
+ }]
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ this.buttonGroup = [{
|
|
|
+ text: '申请售后',
|
|
|
+ backgroundColor: '#52A63A',
|
|
|
+ color: '#fff'
|
|
|
+ }]
|
|
|
+ }
|
|
|
+ NET.request(API.getOrderDetail, {
|
|
|
+ flag: 1,
|
|
|
+ orderId: options.orderId,
|
|
|
+ orderStatus: options.orderStatus,
|
|
|
+ }, 'GET').then(res => {
|
|
|
+ this.orderData = res.data
|
|
|
+ if (this.orderData.merchantInfoResVO.products.length && this.orderData.merchantInfoResVO.products[0].productType !=
|
|
|
+ 2 && this.orderData.merchantInfoResVO.products[0].productType != 4) {
|
|
|
+ this.goodType = 1
|
|
|
+ } else {
|
|
|
+ this.goodType = 2
|
|
|
+ }
|
|
|
+ if (this.orderStatus == 4 && this.orderData.evaluateReplyStatus == 1) {
|
|
|
+ this.buttonGroup.push({
|
|
|
+ text: '评价',
|
|
|
+ backgroundColor: '#52A63A',
|
|
|
+ color: '#fff'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }).catch(error => {
|
|
|
+ this.$refs.uTips.show({
|
|
|
+ title: error.data.msg,
|
|
|
+ type: 'warning',
|
|
|
+ })
|
|
|
+ })
|
|
|
+ this.getOrderType()
|
|
|
+ },
|
|
|
+ onShow() {},
|
|
|
+ methods: {
|
|
|
+ // 获取订单类型
|
|
|
+ getOrderType() {
|
|
|
+ switch (this.orderData.orderStatus) {
|
|
|
+ case 1:
|
|
|
+ this.orderType = {
|
|
|
+ title: '等待买家付款',
|
|
|
+ text: '订单将于' + this.orderData.addOrderTime + '关闭',
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case 2:
|
|
|
+ this.orderType = {
|
|
|
+ title: '等待卖家发货',
|
|
|
+ text: '您的商品正在打包等待发货',
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case 3:
|
|
|
+ this.orderType = {
|
|
|
+ title: '等待商品送达',
|
|
|
+ text: '您的商品已发出正在路上，请耐心等待',
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case 4:
|
|
|
+ this.orderType = {
|
|
|
+ title: '商品已送达',
|
|
|
+ text: '',
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case 5:
|
|
|
+ this.orderType = {
|
|
|
+ title: '交易已完成',
|
|
|
+ text: '',
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ this.orderType = {
|
|
|
+ title: '交易已取消',
|
|
|
+ text: '',
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 操作
|
|
|
+ orderHandle(e) {
|
|
|
+ if (this.orderStatus == 1) {
|
|
|
+ if (e.index == 0) {
|
|
|
+ // 取消订单
|
|
|
+ this.modalContent = '请确定是否取消订单'
|
|
|
+ this.handleType = 1
|
|
|
+ this.modalShow = true
|
|
|
+ } else if (e.index == 1) {
|
|
|
+ // 立即支付
|
|
|
+ this.modalContent = '请确定是否立即支付'
|
|
|
+ this.handleType = 2
|
|
|
+ this.modalShow = true
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (e.index == 0) {
|
|
|
+ // 申请售后
|
|
|
+ NET.request(API.applyService, {
|
|
|
+ tenantCode: this.orderData.tenantCode
|
|
|
+ }, 'GET').then(res => {
|
|
|
+ uni.makePhoneCall({
|
|
|
+ phoneNumber: res.data.contactTel
|
|
|
+ });
|
|
|
+ }).catch(error => {
|
|
|
+ this.$refs.uTips.show({
|
|
|
+ title: error.data.msg,
|
|
|
+ type: 'warning',
|
|
|
+ })
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ if (this.orderStatus == 2) {
|
|
|
+ // 自助采摘
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pagesGood/pickVideo?orderId=' + this.orderData.orderId
|
|
|
+ });
|
|
|
+ } else if (this.orderStatus == 3) {
|
|
|
+ if (e.index == 1) {
|
|
|
+ // 确认收货
|
|
|
+ this.modalContent = '请确定是否确认收货'
|
|
|
+ this.handleType = 3
|
|
|
+ this.modalShow = true
|
|
|
+ } else {
|
|
|
+ // 追踪物流
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pagesMain/logisticsDeatil?orderId=' + this.orderData.orderId
|
|
|
+ });
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ // 评价
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pagesMain/evaluateForm?orderId=' + this.orderData.orderId + '&tenantCode=' + this.orderData.tenantCode +
|
|
|
+ '&productIds=' + this.orderData.merchantInfoResVO.products.map(site => {
|
|
|
+ return site.productId
|
|
|
+ }).join(',')
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 状态流转
|
|
|
+ submitHandle() {
|
|
|
+ if (this.handleType == 1) {
|
|
|
+ // 取消订单
|
|
|
+ NET.request(API.cancelOrder, {
|
|
|
+ orderId: this.orderData.orderId
|
|
|
+ }, 'GET').then(res => {
|
|
|
+ this.modalShow = false
|
|
|
+ this.$refs.uTips.show({
|
|
|
+ title: '取消订单成功',
|
|
|
+ type: 'success',
|
|
|
+ })
|
|
|
+ setTimeout(() => {
|
|
|
+ uni.reLaunch({
|
|
|
+ url: '/pagesMain/orderList?type=' + 1
|
|
|
+ });
|
|
|
+ }, 1000)
|
|
|
+ }).catch(error => {
|
|
|
+ this.modalShow = false
|
|
|
+ this.$refs.uTips.show({
|
|
|
+ title: error.data.msg,
|
|
|
+ type: 'warning',
|
|
|
+ })
|
|
|
+ })
|
|
|
+ } else if (this.handleType == 2) {
|
|
|
+ // 立即支付
|
|
|
+ this.modalShow = false
|
|
|
+ setTimeout(() => {
|
|
|
+ uni.reLaunch({
|
|
|
+ url: '/pagesMain/orderList?type=' + 3
|
|
|
+ });
|
|
|
+ }, 1000)
|
|
|
+ } else if (this.handleType == 3) {
|
|
|
+ // 确认收货
|
|
|
+ NET.request(API.confirmOrder, {
|
|
|
+ orderId: this.orderData.orderId
|
|
|
+ }, 'GET').then(res => {
|
|
|
+ this.modalShow = false
|
|
|
+ this.$refs.uTips.show({
|
|
|
+ title: '确认收货成功',
|
|
|
+ type: 'success',
|
|
|
+ })
|
|
|
+ setTimeout(() => {
|
|
|
+ uni.reLaunch({
|
|
|
+ url: '/pagesMain/orderList?type=' + 5
|
|
|
+ });
|
|
|
+ }, 1000)
|
|
|
+ }).catch(error => {
|
|
|
+ this.modalShow = false
|
|
|
+ this.$refs.uTips.show({
|
|
|
+ title: error.data.msg,
|
|
|
+ type: 'warning',
|
|
|
+ })
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 跳转留言列表
|
|
|
+ goToMessage(){
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pagesMain/messageList?orderId=' + this.orderData.orderId + '&tenantCode=' + this.orderData.tenantCode
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+<style lang="less" scoped>
|
|
|
+ page {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+
|
|
|
+ .container {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ float: left;
|
|
|
+ background-color: #f7f7f7;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding-bottom: 50px;
|
|
|
+ overflow-y: auto;
|
|
|
+
|
|
|
+ .order-type-info {
|
|
|
+ width: 100%;
|
|
|
+ height: 115px;
|
|
|
+ float: left;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 22px 100px 0 15px;
|
|
|
+ background: #52A63A;
|
|
|
+ border-radius: 0px 0px 20px 20px;
|
|
|
+ background-size: 62px;
|
|
|
+ background-position: calc(100% - 48px) 12px;
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ background-image: url(@/static/images/orderDetail.png);
|
|
|
+
|
|
|
+ .order-type-title {
|
|
|
+ width: 100%;
|
|
|
+ float: left;
|
|
|
+ height: 20px;
|
|
|
+ line-height: 20px;
|
|
|
+ font-size: 15px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ color: #FFFFFF;
|
|
|
+ margin-bottom: 4px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .order-type-text {
|
|
|
+ width: 100%;
|
|
|
+ float: left;
|
|
|
+ height: 20px;
|
|
|
+ line-height: 20px;
|
|
|
+ font-size: 12px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ color: #FFFFFF;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .address-info-box {
|
|
|
+ width: calc(100% - 30px);
|
|
|
+ float: left;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 16px 18px 16px 16px;
|
|
|
+ margin: -34px 15px 10px 15px;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 10px;
|
|
|
+
|
|
|
+ .address-icon {
|
|
|
+ width: 36px;
|
|
|
+ height: 40px;
|
|
|
+ float: left;
|
|
|
+ align-items: center;
|
|
|
+ display: flex;
|
|
|
+
|
|
|
+ .iconfont {
|
|
|
+ color: #52A63A;
|
|
|
+ font-size: 36px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .address-content {
|
|
|
+ width: calc(100% - 56px);
|
|
|
+ height: 40px;
|
|
|
+ float: left;
|
|
|
+ margin: 0 8px 0 12px;
|
|
|
+
|
|
|
+ .address-info {
|
|
|
+ height: 20px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ line-height: 20px;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+
|
|
|
+ .address-name {
|
|
|
+ font-size: 16px;
|
|
|
+ color: #333333;
|
|
|
+ margin-right: 14px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .address-phone {
|
|
|
+ font-size: 12px;
|
|
|
+ color: #666666;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .address-detail {
|
|
|
+ height: 20px;
|
|
|
+ font-size: 16px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ color: #333333;
|
|
|
+ line-height: 20px;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .goods-info-box {
|
|
|
+ width: calc(100% - 30px);
|
|
|
+ float: left;
|
|
|
+ margin: 0 15px 10px 15px;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 10px;
|
|
|
+
|
|
|
+ .shop-info {
|
|
|
+ width: 100%;
|
|
|
+ height: 48px;
|
|
|
+ float: left;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 13px 15px 12px 15px;
|
|
|
+ border-bottom: 1px solid #EEEEEE;
|
|
|
+ line-height: 22px;
|
|
|
+
|
|
|
+ .icondianpu {
|
|
|
+ font-size: 22px;
|
|
|
+ color: #333333;
|
|
|
+ }
|
|
|
+
|
|
|
+ .shop-name {
|
|
|
+ font-size: 15px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ color: #333333;
|
|
|
+ margin: 0 8px 0 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .iconshangjia {
|
|
|
+ font-size: 12px;
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .goods-list {
|
|
|
+ width: 100%;
|
|
|
+ float: left;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 10px 15px 0 15px;
|
|
|
+
|
|
|
+ .goods-row {
|
|
|
+ width: 100%;
|
|
|
+ height: 90px;
|
|
|
+ float: left;
|
|
|
+ display: flex;
|
|
|
+ margin-bottom: 10px;
|
|
|
+
|
|
|
+ .goods-img {
|
|
|
+ width: 90px;
|
|
|
+ height: 90px;
|
|
|
+ border-radius: 5px;
|
|
|
+ object-fit: cover;
|
|
|
+ }
|
|
|
+
|
|
|
+ .goods-info {
|
|
|
+ width: calc(100% - 106px);
|
|
|
+ height: 90px;
|
|
|
+ margin-left: 16px;
|
|
|
+
|
|
|
+ .goods-name {
|
|
|
+ width: 100%;
|
|
|
+ height: 36px;
|
|
|
+ float: left;
|
|
|
+ font-size: 14px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ color: #333333;
|
|
|
+ line-height: 18px;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ display: -webkit-box;
|
|
|
+ -webkit-line-clamp: 2;
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
+ word-wrap: break-word;
|
|
|
+ }
|
|
|
+
|
|
|
+ .goods-type {
|
|
|
+ height: 20px;
|
|
|
+ float: left;
|
|
|
+ background: #F0F0F0;
|
|
|
+ border-radius: 4px;
|
|
|
+ padding: 0 8px;
|
|
|
+ margin: 6px 0;
|
|
|
+ font-size: 10px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ color: #666666;
|
|
|
+ line-height: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .plant-area {
|
|
|
+ height: 20px;
|
|
|
+ float: right;
|
|
|
+ margin: 6px 0;
|
|
|
+ font-size: 12px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ color: #333333;
|
|
|
+ }
|
|
|
+
|
|
|
+ .goods-price-number {
|
|
|
+ width: 100%;
|
|
|
+ height: 20px;
|
|
|
+ float: left;
|
|
|
+ line-height: 20px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ color: #333333;
|
|
|
+
|
|
|
+ .goods-unit {
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .goods-price {
|
|
|
+ font-size: 15px;
|
|
|
+ margin-right: 6px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .goods-number {
|
|
|
+ font-size: 12px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .plant-text {
|
|
|
+ float: right;
|
|
|
+ font-size: 12px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ color: #333333;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .order-info {
|
|
|
+ width: 100%;
|
|
|
+ float: left;
|
|
|
+
|
|
|
+ /deep/.u-cell {
|
|
|
+ padding: 6px 16px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .pay-info {
|
|
|
+ width: 100%;
|
|
|
+ height: 46px;
|
|
|
+ float: left;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border-top: 1px solid #EEEEEE;
|
|
|
+ padding-right: 15px;
|
|
|
+ line-height: 44px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ font-size: 14px;
|
|
|
+ text-align: right;
|
|
|
+ white-space: nowrap;
|
|
|
+
|
|
|
+ .pay-text {
|
|
|
+ float: left;
|
|
|
+ color: #333333;
|
|
|
+ margin-left: 15px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .pay-price {
|
|
|
+ color: #52A63A;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .order-info-box {
|
|
|
+ width: calc(100% - 30px);
|
|
|
+ float: left;
|
|
|
+ margin: 0 15px 10px 15px;
|
|
|
+ background: #FFFFFF;
|
|
|
+ border-radius: 10px;
|
|
|
+
|
|
|
+ .info-title-box {
|
|
|
+ width: 100%;
|
|
|
+ height: 48px;
|
|
|
+ float: left;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 15px 15px 14px 15px;
|
|
|
+ border-bottom: 1px solid #EEEEEE;
|
|
|
+ line-height: 18px;
|
|
|
+ white-space: nowrap;
|
|
|
+
|
|
|
+ .info-title {
|
|
|
+ height: 18px;
|
|
|
+ float: left;
|
|
|
+ font-size: 15px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ color: #333333;
|
|
|
+ margin-right: 8px;
|
|
|
+ padding-left: 10px;
|
|
|
+ border-left: 2px solid #74BD60;
|
|
|
+ }
|
|
|
+
|
|
|
+ .iconfangxiang {
|
|
|
+ float: right;
|
|
|
+ font-size: 12px;
|
|
|
+ color: #999999;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .info-content-box {
|
|
|
+ width: 100%;
|
|
|
+ float: left;
|
|
|
+ padding: 15px 0;
|
|
|
+
|
|
|
+ .message-row {
|
|
|
+ width: 100%;
|
|
|
+ float: left;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0 15px;
|
|
|
+ margin-bottom: 15px;
|
|
|
+
|
|
|
+ .message-head {
|
|
|
+ width: 50px;
|
|
|
+ height: 50px;
|
|
|
+ object-fit: cover;
|
|
|
+ float: left;
|
|
|
+ border-radius: 50%;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+
|
|
|
+ .message-info-box {
|
|
|
+ width: calc(100% - 75px);
|
|
|
+ float: right;
|
|
|
+
|
|
|
+ .message-name {
|
|
|
+ width: 50%;
|
|
|
+ height: 30px;
|
|
|
+ float: left;
|
|
|
+ font-size: 15px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ color: #333333;
|
|
|
+ line-height: 30px;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+
|
|
|
+ .message-date {
|
|
|
+ width: 50%;
|
|
|
+ height: 30px;
|
|
|
+ float: left;
|
|
|
+ font-size: 12px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ color: #666666;
|
|
|
+ text-align: right;
|
|
|
+ line-height: 30px;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+
|
|
|
+ .message-text {
|
|
|
+ width: 100%;
|
|
|
+ height: 20px;
|
|
|
+ float: left;
|
|
|
+ font-size: 12px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ color: #666666;
|
|
|
+ line-height: 20px;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
+ }
|
|
|
+
|
|
|
+ .message-img-box {
|
|
|
+ width: 100%;
|
|
|
+ float: left;
|
|
|
+ .message-img{
|
|
|
+ width: 76px;
|
|
|
+ height: 76px;
|
|
|
+ object-fit: cover;
|
|
|
+ float: left;
|
|
|
+ margin: 0 10px 10px 0;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .message-row:last-child {
|
|
|
+ margin-bottom: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .order-info-row {
|
|
|
+ width: 100%;
|
|
|
+ height: 26px;
|
|
|
+ float: left;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0 15px;
|
|
|
+ font-size: 12px;
|
|
|
+ font-family: PingFang SC;
|
|
|
+ color: #333333;
|
|
|
+ line-height: 26px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .order-handle {
|
|
|
+ width: 100%;
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0px;
|
|
|
+ border-top: 1px solid #cccccc;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
liuboyan
