zhangdan 4 年之前
父節點
當前提交
dc39f98c71
共有 3 個文件被更改,包括 348 次插入329 次删除
  1. 324 315
      src/views/Order/OrderCenter.vue
  2. 22 13
      src/views/Order/OrderDetailModal.vue
  3. 2 1
      vue.config.js

+ 324 - 315
src/views/Order/OrderCenter.vue

@@ -1,333 +1,341 @@
 <template>
 <template>
-	<a-card :bordered="false">
-		<!-- 搜索条件 -->
-		<div class="orderCenter-searchForm">
-			<a-form ref="searchForm">
-				<a-row :gutter="48">
-					<a-col :span="8">
-						<a-form-item label="下单时间" :label-col="{ span:4 }" :wrapper-col="{ span:12}">
-							<a-range-picker v-model="time" :format="dateFormat" :placeholder="['开始时间','结束时间']" @change="onChange" />
-						</a-form-item>
-					</a-col>
-					<a-col :span="6">
-						<a-form-item label="网点名称" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-							<a-select placeholder="请选择" allowClear v-model="storeId" mode="multiple">
-								<a-select-option v-for="item in storeOptionData" :key="item.id" :value="item.id">{{ item.name }}</a-select-option>
-							</a-select>
-						</a-form-item>
-					</a-col>
-					<a-col :span="6">
-						<a-form-item label="单号" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-							<a-input v-model.trim="searchForm.orderNo" placeholder="请输入" allowClear />
-						</a-form-item>
-					</a-col>
-					<a-col :span="4">
-						<a-button style="margin-right: 10px;" type="primary" @click="handleSearch">查询</a-button>
-						<a-button type="" @click="handleRest">重置</a-button>
-					</a-col>
-				</a-row>
-				<a-row :gutter="48">
-					<a-col :span="8">
-						<a-form-item label="服务项目" :label-col="{ span:4 }" :wrapper-col="{ span:12}">
-							<a-select placeholder="请选择" allowClear v-model="searchForm.itemId">
-								<a-select-option v-for="item in itemOptionData" :key="item.id" :value="item.id">{{ item.itemName }}</a-select-option>
-							</a-select>
-						</a-form-item>
-					</a-col>
-					<a-col :span="6">
-						<a-form-item label="手机号码" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-							<a-input v-model.trim="searchForm.customerMobile" placeholder="请输入" allowClear :maxLength="11" />
-						</a-form-item>
-					</a-col>
-					<a-col :span="6">
-						<a-form-item label="状态" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
-							<v-select v-model="searchForm.orderStatus" ref="orderStatus" code="ORDER_STATUS" placeholder="请选择" allowClear></v-select>
-						</a-form-item>
-					</a-col>
-				</a-row>
-			</a-form>
-		</div>
-		<!-- 合计 -->
-		<div class="total">
-			<a-icon type="info-circle" class="iconImg" />
-			<strong>合计:</strong><span v-model="orderTotal">{{orderTotal || 0}} 单</span><strong style="margin-left: 15px;">实收:</strong><span
-			 v-model="paymentAmountTotal">{{paymentAmountTotal || 0}} 元</span>
-		</div>
-		<!-- 列表 -->
-		<s-table ref="table" size="default" :rowKey="(record) => record.id" :columns="columns" :data="loadData" bordered>
-			<!-- 状态 -->
-			<span slot="orderStatus" slot-scope="text, record" :nowStatus="detailStatus">
-				{{ $refs.orderStatus.getNameByCode(text) }}
-			</span>
-			<!-- 实收金额 -->
-			<span slot="paymentAmount" slot-scope="text, record">
-				<template v-if=" record.payStatus == 'PAID' ">{{ record.paymentAmount }}</template>
-				<template v-else-if=" record.payStatus != 'PAID' ">{{ 0 }}</template>
-			</span>
-			<!-- 操作 -->
-			<span slot="action" slot-scope="text, record">
-				<a-button type="primary" @click="seeDetail(record)">查看</a-button>
-				<!-- 本期暂不做 -->
-				<!-- <a-button type="danger" @click="refund(record)">退款</a-button> -->
-			</span>
-		</s-table>
-		<!-- 查看详情弹窗 -->
-		<order-detail-modal :openModal="openDetailModal" :nowId="detailId" @close="openDetailModal=false" />
-	</a-card>
+  <a-card :bordered="false">
+    <!-- 搜索条件 -->
+    <div class="orderCenter-searchForm">
+      <a-form ref="searchForm">
+        <a-row :gutter="48">
+          <a-col :span="8">
+            <a-form-item label="下单时间" :label-col="{ span:4 }" :wrapper-col="{ span:12}">
+              <a-range-picker v-model="time" :format="dateFormat" :placeholder="['开始时间','结束时间']" @change="onChange" />
+            </a-form-item>
+          </a-col>
+          <a-col :span="6">
+            <a-form-item label="网点名称" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
+              <a-select placeholder="请选择" allowClear v-model="storeId" mode="multiple">
+                <a-select-option v-for="item in storeOptionData" :key="item.id" :value="item.id">{{ item.name }}</a-select-option>
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <a-col :span="6">
+            <a-form-item label="单号" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
+              <a-input v-model.trim="searchForm.orderNo" placeholder="请输入" allowClear />
+            </a-form-item>
+          </a-col>
+          <a-col :span="4">
+            <a-button style="margin-right: 10px;" type="primary" @click="handleSearch">查询</a-button>
+            <a-button type="" @click="handleRest">重置</a-button>
+          </a-col>
+        </a-row>
+        <a-row :gutter="48">
+          <a-col :span="8">
+            <a-form-item label="服务项目" :label-col="{ span:4 }" :wrapper-col="{ span:12}">
+              <a-select placeholder="请选择" allowClear v-model="searchForm.itemId">
+                <a-select-option v-for="item in itemOptionData" :key="item.id" :value="item.id">{{ item.itemName }}</a-select-option>
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <a-col :span="6">
+            <a-form-item label="手机号码" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
+              <a-input v-model.trim="searchForm.customerMobile" placeholder="请输入" allowClear :maxLength="11" />
+            </a-form-item>
+          </a-col>
+          <a-col :span="6">
+            <a-form-item label="状态" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
+              <v-select v-model="searchForm.orderStatus" ref="orderStatus" code="ORDER_STATUS" placeholder="请选择" allowClear></v-select>
+            </a-form-item>
+          </a-col>
+        </a-row>
+      </a-form>
+    </div>
+    <!-- 合计 -->
+    <div class="total">
+      <a-icon type="info-circle" class="iconImg" />
+      <strong>合计:</strong><span v-model="orderTotal">{{ orderTotal || 0 }} 单</span><strong style="margin-left: 15px;">实收:</strong><span
+        v-model="paymentAmountTotal">{{ paymentAmountTotal || 0 }} 元</span>
+    </div>
+    <!-- 列表 -->
+    <s-table
+      ref="table"
+      size="default"
+      :rowKey="(record) => record.id"
+      :columns="columns"
+      :data="loadData"
+      bordered>
+      <!-- 状态 -->
+      <span slot="orderStatus" slot-scope="text">
+        {{ $refs.orderStatus.getNameByCode(text) }}
+      </span>
+      <!-- 实收金额 -->
+      <span slot="paymentAmount" slot-scope="text, record">
+        <template v-if=" record.payStatus == 'PAID' ">{{ record.paymentAmount }}</template>
+        <template v-else-if=" record.payStatus != 'PAID' ">{{ 0 }}</template>
+      </span>
+      <!-- 操作 -->
+      <span slot="action" slot-scope="text, record">
+        <a-button type="primary" @click="seeDetail(record)">查看</a-button>
+        <!-- 本期暂不做 -->
+        <!-- <a-button type="danger" @click="refund(record)">退款</a-button> -->
+      </span>
+    </s-table>
+    <!-- 查看详情弹窗 -->
+    <order-detail-modal :openModal="openDetailModal" :nowId="detailId" @close="openDetailModal=false" />
+  </a-card>
 </template>
 </template>
 
 
 <script>
 <script>
-	import {
-		STable,
-		VSelect
-	} from '@/components'
-	import getDate from '../../libs/getDate.js'
-	import {
-		orderCenterList,
-		itemList,
-		storeList,
-		orderTotal
-	} from '../../api/order.js'
-	import OrderDetailModal from './OrderDetailModal.vue'
-	import moment from 'moment'
-	export default {
-		name: 'OrderCenter',
-		components: {
-			STable,
-			VSelect,
-			OrderDetailModal
-		},
-		data() {
-			return {
-				storeId: [], // 网点名称
-				// 查询参数
-				searchForm: {
-					beginDate: null, // 创建的开始时间
-					endDate: null, // 创建的结束时间
-					storeIdList: [], // 网点名称
-					orderNo: '', // 单号
-					itemId: undefined, // 服务项目
-					customerMobile: '', // 手机号码
-					orderStatus: '' // 状态
-				},
-				orderTotal: '', // 合计开单数量
-				paymentAmountTotal: '', // 合计实收金额
-				itemOptionData: [], // 服务项目数据
-				storeOptionData: [], // 网点名称数据
-				openDetailModal: false, // 查看详情弹窗 默认关闭
-				detailId: null, // 初始化id
-				// 将默认当天时间日期回显在时间选择框中
-				time: [
-					moment(getDate.getToday().starttime, this.dateFormat),
-					moment(getDate.getToday().endtime, this.dateFormat)
-				],
-				dateFormat: 'YYYY-MM-DD',
-				columns: [{
-						title: '下单时间',
-						dataIndex: 'orderTime',
-						minWidth: '40',
-						align: 'center'
-					},
-					{
-						title: '单号',
-						dataIndex: 'orderNo',
-						minWidth: '40',
-						align: 'center'
-					},
-					{
-						title: '网点名称',
-						dataIndex: 'storeName',
-						minWidth: '40',
-						align: 'center'
-					},
-					{
-						title: '服务项目',
-						dataIndex: 'itemName',
-						minWidth: '40',
-						align: 'center'
-					},
-					{
-						title: '手机号码',
-						dataIndex: 'customerMobile',
-						minWidth: '40',
-						align: 'center'
-					},
-					{
-						title: '应收(¥)',
-						dataIndex: 'payableAmount',
-						minWidth: '40',
-						align: 'center'
-					},
-					{
-						title: '实收(¥)',
-						dataIndex: 'paymentAmount',
-						minWidth: '40',
-						align: 'center',
-						scopedSlots: {
-							customRender: 'paymentAmount'
-						}
+import {
+  STable,
+  VSelect
+} from '@/components'
+import getDate from '../../libs/getDate.js'
+import {
+  orderCenterList,
+  itemList,
+  storeList,
+  orderTotal
+} from '../../api/order.js'
+import OrderDetailModal from './OrderDetailModal.vue'
+import moment from 'moment'
+export default {
+  name: 'OrderCenter',
+  components: {
+    STable,
+    VSelect,
+    OrderDetailModal
+  },
+  data () {
+    return {
+      storeId: [], // 网点名称
+      // 查询参数
+      searchForm: {
+        beginDate: null, // 创建的开始时间
+        endDate: null, // 创建的结束时间
+        storeIdList: [], // 网点名称
+        orderNo: '', // 单号
+        itemId: undefined, // 服务项目
+        customerMobile: '', // 手机号码
+        orderStatus: '' // 状态
+      },
+      orderTotal: '', // 合计开单数量
+      paymentAmountTotal: '', // 合计实收金额
+      itemOptionData: [], // 服务项目数据
+      storeOptionData: [], // 网点名称数据
+      openDetailModal: false, // 查看详情弹窗 默认关闭
+      detailId: null, // 初始化id
+      // 将默认当天时间日期回显在时间选择框中
+      time: [
+        moment(getDate.getToday().starttime, this.dateFormat),
+        moment(getDate.getToday().endtime, this.dateFormat)
+      ],
+      dateFormat: 'YYYY-MM-DD',
+      columns: [{
+        title: '下单时间',
+        dataIndex: 'orderTime',
+        minWidth: '40',
+        align: 'center'
+      },
+      {
+        title: '单号',
+        dataIndex: 'orderNo',
+        minWidth: '40',
+        align: 'center'
+      },
+      {
+        title: '网点名称',
+        dataIndex: 'storeName',
+        minWidth: '40',
+        align: 'center'
+      },
+      {
+        title: '服务项目',
+        dataIndex: 'itemName',
+        minWidth: '40',
+        align: 'center'
+      },
+      {
+        title: '手机号码',
+        dataIndex: 'customerMobile',
+        minWidth: '40',
+        align: 'center'
+      },
+      {
+        title: '应收(¥)',
+        dataIndex: 'payableAmount',
+        minWidth: '40',
+        align: 'center'
+      },
+      {
+        title: '实收(¥)',
+        dataIndex: 'paymentAmount',
+        minWidth: '40',
+        align: 'center',
+        scopedSlots: {
+          customRender: 'paymentAmount'
+        }
 
 
-					},
-					// {
-					//   title: '优惠(¥)',
-					//   dataIndex: 'couponAmount',
-					//   minWidth: '40',
-					//   align: 'center'
-					// },
-					{
-						title: '状态',
-						dataIndex: 'orderStatus',
-						minWidth: '40',
-						align: 'center',
-						scopedSlots: {
-							customRender: 'orderStatus'
-						}
-					},
-					{
-						title: '操作',
-						dataIndex: 'action',
-						minWidth: '40',
-						align: 'center',
-						scopedSlots: {
-							customRender: 'action'
-						}
+      },
+      // {
+      //   title: '优惠(¥)',
+      //   dataIndex: 'couponAmount',
+      //   minWidth: '40',
+      //   align: 'center'
+      // },
+      {
+        title: '状态',
+        dataIndex: 'orderStatus',
+        minWidth: '40',
+        align: 'center',
+        scopedSlots: {
+          customRender: 'orderStatus'
+        }
+      },
+      {
+        title: '操作',
+        dataIndex: 'action',
+        minWidth: '40',
+        align: 'center',
+        scopedSlots: {
+          customRender: 'action'
+        }
 
 
-					}
-				],
-				// 加载数据方法 必须为 Promise 对象
-				loadData: parameter => {
-					this.searchForm.beginDate == null ? this.searchForm.beginDate = getDate.getToday().starttime : null
-					this.searchForm.endDate == null ? this.searchForm.endDate = getDate.getToday().endtime : null
-					this.searchForm.storeIdList = this.storeId
-					return orderCenterList(Object.assign(parameter, this.searchForm)).then(res => {
-						// console.log(res,'0000000000000000000')
-						if (res.status == 200) {
-							return res.data
-							this.getTotal()
-						}
-					})
-				}
-			}
-		},
+      }
+      ],
+      // 加载数据方法 必须为 Promise 对象
+      loadData: parameter => {
+        this.searchForm.beginDate == null ? this.searchForm.beginDate = getDate.getToday().starttime : null
+        this.searchForm.endDate == null ? this.searchForm.endDate = getDate.getToday().endtime : null
+        this.searchForm.storeIdList = this.storeId
+        return orderCenterList(Object.assign(parameter, this.searchForm)).then(res => {
+          // console.log(res,'0000000000000000000')
+          if (res.status == 200) {
+            return res.data
+            this.getTotal()
+          }
+        })
+      }
+    }
+  },
 
 
-		methods: {
-			moment,
-			// 创建时间change
-			onChange(dates, dateStrings) {
-				if ((dates, dateStrings)) {
-					this.searchForm.beginDate = dateStrings[0]
-					this.searchForm.endDate = dateStrings[1]
-				}
-				console.log(this.searchForm.beginDate, this.searchForm.endDate)
-			},
-			// 获取服务项目数据
-			getItemListData() {
-				itemList({
-					pageNo: 1,
-					pageSize: 1000
-				}).then(res => {
-					// console.log(res, '-----------')
-					if (res.status == 200) {
-						this.itemOptionData = res.data.list || []
-					} else {
-						this.itemOptionData = []
-					}
-				})
-			},
-			// 获取网点名称数据
-			getStoreListData() {
-				storeList({
-					pageNo: 1,
-					pageSize: 1000
-				}).then(res => {
-					// console.log(res, '-----------')
-					if (res.status == 200) {
-						this.storeOptionData = res.data.list || []
-					} else {
-						this.storeOptionData = []
-					}
-				})
-			},
-			// 合计
-			getTotal() {
-				let params = {
-					beginDate: this.searchForm.beginDate,
-					endDate: this.searchForm.endDate,
-					storeIdList: this.searchForm.storeIdList,
-					orderNo: this.searchForm.orderNo,
-					itemId: this.searchForm.itemId,
-					customerMobile: this.searchForm.customerMobile,
-					orderStatus: this.searchForm.orderStatus
-				}
-				params.beginDate == null ? params.beginDate = getDate.getToday().starttime : null
-				params.endDate == null ? params.endDate = getDate.getToday().endtime : null
-				params.storeIdList = this.storeId
-				orderTotal(params).then(res => {
-					console.log(res, '--------')
-					if (res.status == 200) {
-						this.orderTotal = res.data.orderNum || 0
-						this.paymentAmountTotal = res.data.paymentAmount || 0
-					}
-				})
-			},
-			// 查看详情--跳转到对应的详情页
-			seeDetail(record) {
-				// 将当前行的id传递给详情页 
-				this.openDetailModal = true
-				this.detailId = record.id
-			},
-			// 退款---暂不做
-			// refund(row) {
-			//   const _this = this
-			//   this.$confirm({
-			//     title: '警告',
-			//     content: '确认退款后 款项将通过原渠道退回 且不可撤回,确认退款?',
-			//     okText: '确定',
-			//     cancelText: '取消',
-			//     // onOk() {
-			//     
-			//     // }
-			//   })
-			// },
-			// 查询
-			handleSearch() {
-				this.$refs.table.refresh()
-				this.getTotal()
-			},
-			// 重置
-			handleRest() {
-				this.searchForm.beginDate = getDate.getToday().starttime
-				this.searchForm.endDate = getDate.getToday().endtime
-				this.time = [
-					moment(getDate.getToday().starttime, this.dateFormat),
-					moment(getDate.getToday().endtime, this.dateFormat)
-				]
-				this.storeId = []
-				this.searchForm.orderNo = ''
-				this.searchForm.itemId = undefined
-				this.searchForm.customerMobile = ''
-				this.searchForm.orderStatus = ''
-				// this.$refs.searchForm.resetFields()
-				this.$refs.table.refresh()
-				this.getTotal()
-			}
-		},
-		beforeRouteEnter(to, from, next) {
-			next(vm => {
-				vm.getItemListData()
-				vm.handleRest()
-				vm.getStoreListData()
-			})
-		}
-	}
+  methods: {
+    moment,
+    // 创建时间change
+    onChange (dates, dateStrings) {
+      if ((dates, dateStrings)) {
+        this.searchForm.beginDate = dateStrings[0]
+        this.searchForm.endDate = dateStrings[1]
+      }
+      console.log(this.searchForm.beginDate, this.searchForm.endDate)
+    },
+    // 获取服务项目数据
+    getItemListData () {
+      itemList({
+        pageNo: 1,
+        pageSize: 1000
+      }).then(res => {
+        // console.log(res, '-----------')
+        if (res.status == 200) {
+          this.itemOptionData = res.data.list || []
+        } else {
+          this.itemOptionData = []
+        }
+      })
+    },
+    // 获取网点名称数据
+    getStoreListData () {
+      storeList({
+        pageNo: 1,
+        pageSize: 1000
+      }).then(res => {
+        // console.log(res, '-----------')
+        if (res.status == 200) {
+          this.storeOptionData = res.data.list || []
+        } else {
+          this.storeOptionData = []
+        }
+      })
+    },
+    // 合计
+    getTotal () {
+      const params = {
+        beginDate: this.searchForm.beginDate,
+        endDate: this.searchForm.endDate,
+        storeIdList: this.searchForm.storeIdList,
+        orderNo: this.searchForm.orderNo,
+        itemId: this.searchForm.itemId,
+        customerMobile: this.searchForm.customerMobile,
+        orderStatus: this.searchForm.orderStatus
+      }
+      params.beginDate == null ? params.beginDate = getDate.getToday().starttime : null
+      params.endDate == null ? params.endDate = getDate.getToday().endtime : null
+      params.storeIdList = this.storeId
+      orderTotal(params).then(res => {
+        console.log(res, '--------')
+        if (res.status == 200) {
+          this.orderTotal = res.data.orderNum || 0
+          this.paymentAmountTotal = res.data.paymentAmount || 0
+        }
+      })
+    },
+    // 查看详情--跳转到对应的详情页
+    seeDetail (record) {
+      // 将当前行的id传递给详情页
+      this.openDetailModal = true
+      this.detailId = record.id
+    },
+    // 退款---暂不做
+    // refund(row) {
+    //   const _this = this
+    //   this.$confirm({
+    //     title: '警告',
+    //     content: '确认退款后 款项将通过原渠道退回 且不可撤回,确认退款?',
+    //     okText: '确定',
+    //     cancelText: '取消',
+    //     // onOk() {
+    //
+    //     // }
+    //   })
+    // },
+    // 查询
+    handleSearch () {
+      this.$refs.table.refresh()
+      this.getTotal()
+    },
+    // 重置
+    handleRest () {
+      this.searchForm.beginDate = getDate.getToday().starttime
+      this.searchForm.endDate = getDate.getToday().endtime
+      this.time = [
+        moment(getDate.getToday().starttime, this.dateFormat),
+        moment(getDate.getToday().endtime, this.dateFormat)
+      ]
+      this.storeId = []
+      this.searchForm.orderNo = ''
+      this.searchForm.itemId = undefined
+      this.searchForm.customerMobile = ''
+      this.searchForm.orderStatus = ''
+      // this.$refs.searchForm.resetFields()
+      this.$refs.table.refresh()
+      this.getTotal()
+    }
+  },
+  beforeRouteEnter (to, from, next) {
+    next(vm => {
+      vm.getItemListData()
+      vm.handleRest()
+      vm.getStoreListData()
+    })
+  }
+}
 </script>
 </script>
 <style lang="less">
 <style lang="less">
 	.orderCenter-searchForm {
 	.orderCenter-searchForm {
+
 		// 搜索框的下间距
 		// 搜索框的下间距
 		.ant-form-item {
 		.ant-form-item {
 			margin-bottom: 10px;
 			margin-bottom: 10px;
 		}
 		}
 	}
 	}
+
 	// 合计
 	// 合计
 	.total {
 	.total {
 		margin: 15px 0 25px;
 		margin: 15px 0 25px;
@@ -336,6 +344,7 @@
 		border: 1px solid #91d5ff;
 		border: 1px solid #91d5ff;
 		padding: 8px 15px 8px 27px;
 		padding: 8px 15px 8px 27px;
 		border-radius: 4px;
 		border-radius: 4px;
+
 		.iconImg {
 		.iconImg {
 			color: #1890FF;
 			color: #1890FF;
 			margin-right: 10px;
 			margin-right: 10px;

+ 22 - 13
src/views/Order/OrderDetailModal.vue

@@ -53,20 +53,27 @@
             <a-col :span="8">
             <a-col :span="8">
               <a-form-item label="实付(¥)" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
               <a-form-item label="实付(¥)" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
                 <span v-if=" orderDetailData.payStatus == 'PAID' ">{{ orderDetailData.paymentAmount }} 元</span>
                 <span v-if=" orderDetailData.payStatus == 'PAID' ">{{ orderDetailData.paymentAmount }} 元</span>
-                <span v-else-if=" orderDetailData.payStatus != 'PAID' ">{{ 0 }} 元</span>
+                <span v-if=" orderDetailData.payStatus != 'PAID' ">{{ 0 }} 元</span>
               </a-form-item>
               </a-form-item>
             </a-col>
             </a-col>
-            <a-col :span="8" v-if="orderDetailData.beginImage || orderDetailData.endImage">
+            <a-col :span="8">
               <a-form-item label="洗车照片" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
               <a-form-item label="洗车照片" :label-col="{ span:6 }" :wrapper-col="{ span:12}">
                 <div style="display: flex;">
                 <div style="display: flex;">
-                  <div v-if="orderDetailData.beginImage">
-                    <img class="imgCar" :src="orderDetailData.beginImage" alt="" @click="isShowBeginImageModal=true">
-                    <div style="text-align: center;">洗车前</div>
+                  <div class="imgBox">
+                    <div>
+                      <img v-if="orderDetailData.beginImage" class="imgCar" :src="orderDetailData.beginImage" alt="" @click="isShowBeginImageModal=true">
+                      <div v-if="!orderDetailData.beginImage" class="imgCar">--</div>
+                    </div>
+                    <div>洗车前</div>
                   </div>
                   </div>
-                  <div v-if="orderDetailData.endImage">
-                    <img class="imgCar" :src="orderDetailData.endImage" alt="" @click="isShowEndImageModal=true">
-                    <div style="text-align: center;">洗车后</div>
+                  <div class="imgBox">
+                    <div>
+                      <img v-if="orderDetailData.endImage" class="imgCar" :src="orderDetailData.endImage" alt="" @click="isShowEndImageModal=true">
+                      <div v-if="!orderDetailData.endImage" class="imgCar">--</div>
+                    </div>
+                    <div>洗车后</div>
                   </div>
                   </div>
+
                 </div>
                 </div>
               </a-form-item>
               </a-form-item>
             </a-col>
             </a-col>
@@ -185,12 +192,14 @@ export default {
 		margin-bottom: 20px;
 		margin-bottom: 20px;
 	}
 	}
 
 
-	.imgCar {
-		width: 100px;
-		height: auto;
-		margin: 0 10px;
+	.imgBox {
+		text-align: center;
+		margin-left: 10px;
+		.imgCar {
+			height: 50px;
+			width: auto;
+		}
 	}
 	}
-
 	.pic {
 	.pic {
 		transform: scale(1);
 		transform: scale(1);
 		display: block;
 		display: block;

+ 2 - 1
vue.config.js

@@ -108,7 +108,8 @@ const vueConfig = {
     // If you want to turn on the proxy, please remove the mockjs /src/main.jsL11
     // If you want to turn on the proxy, please remove the mockjs /src/main.jsL11
     proxy: {
     proxy: {
       '/api': {
       '/api': {
-        target: 'http://192.168.16.103:8101/cw-admin/',
+        target: 'http://carwash.test.zyucgj.com/cw-admin/',
+        // target: 'http://192.168.16.102:8101/cw-admin/',
         // target: 'http://carwash.test.zyucgj.com/cw-admin/',
         // target: 'http://carwash.test.zyucgj.com/cw-admin/',
         ws: false,
         ws: false,
         changeOrigin: true,
         changeOrigin: true,