|
@@ -1,5 +1,5 @@
|
|
<template>
|
|
<template>
|
|
- <a-modal class="CarWashModal" :title="mtitle" :width="1000" :footer="null" :destroyOnClose="true" @cancel="isShow=false" v-model="isShow">
|
|
|
|
|
|
+ <a-modal class="CarWashModal" :title="pageType == 'add' ? '新增' : pageType == 'edit' ? '编辑' : ''" :width="1000" :footer="null" :destroyOnClose="true" @cancel="isShow=false" v-model="isShow">
|
|
<!-- 表单 -->
|
|
<!-- 表单 -->
|
|
<a-form-model ref="ruleForm" :model="form" :rules="rules" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
|
|
<a-form-model ref="ruleForm" :model="form" :rules="rules" :label-col="{ span: 6 }" :wrapper-col="{ span: 18 }">
|
|
<a-row :gutter="20">
|
|
<a-row :gutter="20">
|
|
@@ -61,7 +61,7 @@
|
|
<a-form-model-item label="经度" prop="lng" class="default-form-item">
|
|
<a-form-model-item label="经度" prop="lng" class="default-form-item">
|
|
<a-row :gutter="20">
|
|
<a-row :gutter="20">
|
|
<a-col :span="17">
|
|
<a-col :span="17">
|
|
- <a-input v-model="form.lng" placeholder="请输入经度坐标" />
|
|
|
|
|
|
+ <a-input-number v-model="form.lng" :min="0" :max="999" placeholder="请输入经度坐标" class="input-number-all" />
|
|
</a-col>
|
|
</a-col>
|
|
<a-col :span="6">
|
|
<a-col :span="6">
|
|
<a href="https://lbs.qq.com/tool/getpoint/" target="_blank">
|
|
<a href="https://lbs.qq.com/tool/getpoint/" target="_blank">
|
|
@@ -73,7 +73,7 @@
|
|
</a-col>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-col :span="12">
|
|
<a-form-model-item label="纬度" prop="lat">
|
|
<a-form-model-item label="纬度" prop="lat">
|
|
- <a-input v-model="form.lat" placeholder="请输入纬度坐标" />
|
|
|
|
|
|
+ <a-input-number v-model="form.lat" :min="0" :max="999" placeholder="请输入纬度坐标" class="input-number-all" />
|
|
</a-form-model-item>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
</a-col>
|
|
<a-col :span="12">
|
|
<a-col :span="12">
|
|
@@ -129,7 +129,6 @@
|
|
<a-row :gutter="20">
|
|
<a-row :gutter="20">
|
|
<a-col :span="8" v-for="(priceItem, subInd) in item.currentPrices" :key="subInd">
|
|
<a-col :span="8" v-for="(priceItem, subInd) in item.currentPrices" :key="subInd">
|
|
<a-form-model-item :prop="'storeItemPriceDTOList.'+ ind +'.currentPrices.'+ subInd + '.price'" :rules="{required: true, message: `请输入【${priceItem.name}】单价`, trigger: 'blur'}">
|
|
<a-form-model-item :prop="'storeItemPriceDTOList.'+ ind +'.currentPrices.'+ subInd + '.price'" :rules="{required: true, message: `请输入【${priceItem.name}】单价`, trigger: 'blur'}">
|
|
- <!-- <a-input v-model="priceItem.price" :placeholder="'【'+ priceItem.name +'】单价'" suffix="元" /> -->
|
|
|
|
<a-input-number v-model="priceItem.price" :min="0" :max="999999" :placeholder="'【'+ priceItem.name +'】单价'" class="input-number-s" />
|
|
<a-input-number v-model="priceItem.price" :min="0" :max="999999" :placeholder="'【'+ priceItem.name +'】单价'" class="input-number-s" />
|
|
<span class="unit">元</span>
|
|
<span class="unit">元</span>
|
|
</a-form-model-item>
|
|
</a-form-model-item>
|
|
@@ -156,8 +155,8 @@
|
|
</a-col>
|
|
</a-col>
|
|
<a-col :span="24">
|
|
<a-col :span="24">
|
|
<a-form-model-item :label-col="{ span: 3 }" :wrapper-col="{ span: 21 }" class="btn-cont">
|
|
<a-form-model-item :label-col="{ span: 3 }" :wrapper-col="{ span: 21 }" class="btn-cont">
|
|
- <a-button type="primary" @click="onSubmit('ruleForm')">保存</a-button>
|
|
|
|
- <a-button class="resetForm" @click="resetForm">取消</a-button>
|
|
|
|
|
|
+ <a-button type="primary" @click="onSubmit">保存</a-button>
|
|
|
|
+ <a-button class="cancel" @click="cancel">取消</a-button>
|
|
</a-form-model-item>
|
|
</a-form-model-item>
|
|
</a-col>
|
|
</a-col>
|
|
</a-row>
|
|
</a-row>
|
|
@@ -178,7 +177,7 @@
|
|
import Editor from '@/components/WEeditor'
|
|
import Editor from '@/components/WEeditor'
|
|
import moment from 'moment'
|
|
import moment from 'moment'
|
|
import { getProvince, getCityByPro, getDistrictByCity } from '@/api/lookup'
|
|
import { getProvince, getCityByPro, getDistrictByCity } from '@/api/lookup'
|
|
- import { itemQuery, storeSave } from '@/api/car-wash'
|
|
|
|
|
|
+ import { itemQuery, storeSave, storeFind, findItem } from '@/api/car-wash'
|
|
export default{
|
|
export default{
|
|
name: 'AddCarWashModal',
|
|
name: 'AddCarWashModal',
|
|
components: { VSelect, Editor, ChooseEquipment },
|
|
components: { VSelect, Editor, ChooseEquipment },
|
|
@@ -187,13 +186,13 @@
|
|
type: Boolean,
|
|
type: Boolean,
|
|
default: false
|
|
default: false
|
|
},
|
|
},
|
|
- mtitle: { // 弹框标题
|
|
|
|
|
|
+ pageType: { // 页面类型
|
|
type: String,
|
|
type: String,
|
|
default: ''
|
|
default: ''
|
|
},
|
|
},
|
|
- carWashInfo: { // 网点详情
|
|
|
|
- type: Object,
|
|
|
|
- default: ()=>{}
|
|
|
|
|
|
+ carWashId: { // 网点id
|
|
|
|
+ type: String,
|
|
|
|
+ default: ''
|
|
}
|
|
}
|
|
},
|
|
},
|
|
data(){
|
|
data(){
|
|
@@ -274,38 +273,30 @@
|
|
moment,
|
|
moment,
|
|
// 文本编辑器 change
|
|
// 文本编辑器 change
|
|
editorChange (html, text) {
|
|
editorChange (html, text) {
|
|
- console.log(html, text,'===')
|
|
|
|
this.form.guidance = html
|
|
this.form.guidance = html
|
|
- // 点击查看详情时给文本编辑器赋值
|
|
|
|
|
|
+ },
|
|
|
|
+ // 网点详情
|
|
|
|
+ getCarWashInfo(id){
|
|
|
|
+ storeFind({ id: id }).then(res => {
|
|
|
|
+ if(res.status == 200){
|
|
|
|
+ // 查询门店的服务时段价格
|
|
|
|
+ findItem({ id: id }).then(result => {
|
|
|
|
+ if(result.status == 200){
|
|
|
|
+ let carWashInfo = Object.assign(res.data, {storeItemPriceDTOList: result.data})
|
|
|
|
+ this.setVal(carWashInfo)
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ })
|
|
},
|
|
},
|
|
// 表单赋值
|
|
// 表单赋值
|
|
setVal(item){
|
|
setVal(item){
|
|
const _this = this
|
|
const _this = this
|
|
console.log(item)
|
|
console.log(item)
|
|
- let arr = [
|
|
|
|
- 'name',
|
|
|
|
- 'addrProvince',
|
|
|
|
- 'addrProvinceName',
|
|
|
|
- // 'addrCity',
|
|
|
|
- 'addrCityName',
|
|
|
|
- // 'addrDistrict',
|
|
|
|
- 'addrDistrictName',
|
|
|
|
- // 'addrDetail',
|
|
|
|
- // 'deviceDTOList',
|
|
|
|
- 'featuredServiceLabel',
|
|
|
|
- 'lng',
|
|
|
|
- 'lat',
|
|
|
|
- 'serviceType',
|
|
|
|
- // 'beginTime',
|
|
|
|
- // 'endTime',
|
|
|
|
- // 'storeItemPriceDTOList',
|
|
|
|
- 'guidance',
|
|
|
|
- 'reminder'
|
|
|
|
- ]
|
|
|
|
|
|
+ let arr = [ 'id', 'name', 'addrProvince', 'addrProvinceName', 'addrCityName', 'addrDistrictName', 'featuredServiceLabel', 'lng', 'lat', 'serviceType', 'guidance', 'reminder' ]
|
|
arr.map(k => {
|
|
arr.map(k => {
|
|
this.form[k] = item[k]
|
|
this.form[k] = item[k]
|
|
})
|
|
})
|
|
- // this.form.addrProvince = item.addrProvince
|
|
|
|
this.getCityList(item.addrProvince) // 获取市区下拉数据
|
|
this.getCityList(item.addrProvince) // 获取市区下拉数据
|
|
this.form.addrCity = item.addrCity // 市区赋值
|
|
this.form.addrCity = item.addrCity // 市区赋值
|
|
this.getAreaList(item.addrCity) // 获取区县下拉数据
|
|
this.getAreaList(item.addrCity) // 获取区县下拉数据
|
|
@@ -314,15 +305,36 @@
|
|
this.form.deviceDTOList = [{id: item.deviceVOList[0].id}] // 设备
|
|
this.form.deviceDTOList = [{id: item.deviceVOList[0].id}] // 设备
|
|
this.deviceNo = item.deviceVOList[0].deviceNo // 设备序列号
|
|
this.deviceNo = item.deviceVOList[0].deviceNo // 设备序列号
|
|
this.featuredServiceLabel = item.featuredServiceLabel.split(',') // 网点标签
|
|
this.featuredServiceLabel = item.featuredServiceLabel.split(',') // 网点标签
|
|
- this.form.serviceType =
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- this.$refs.editor.setHtml(item.guidance) // 文本编辑器赋值
|
|
|
|
|
|
+ this.form.beginTime = moment(item.beginTime, 'HH:mm') // 营业时间 开始时间
|
|
|
|
+ this.form.endTime = moment(item.endTime, 'HH:mm') // 营业时间 结束时间
|
|
|
|
+ this.setPeriodPrice(item.storeItemPriceDTOList) // 时段价格
|
|
|
|
+ this.isShow ? this.$refs.editor.setHtml(item.guidance) : null // 文本编辑器赋值
|
|
|
|
+ },
|
|
|
|
+ // 时段价格 赋值处理
|
|
|
|
+ setPeriodPrice(storeItemPriceDTOList){
|
|
|
|
+ let arrInd = 0
|
|
|
|
+ this.form.storeItemPriceDTOList = []
|
|
|
|
+ for (var key in storeItemPriceDTOList) {
|
|
|
|
+ if (storeItemPriceDTOList.hasOwnProperty(key)) {
|
|
|
|
+ this.form.storeItemPriceDTOList.push({
|
|
|
|
+ beginTime: moment(key.split(',')[0], 'HH:mm'),
|
|
|
|
+ endTime: moment(key.split(',')[1], 'HH:mm'),
|
|
|
|
+ currentPrices: []
|
|
|
|
+ })
|
|
|
|
+ let idArr = []
|
|
|
|
+ storeItemPriceDTOList[key].map((k, ind) => {
|
|
|
|
+ this.form.storeItemPriceDTOList[arrInd].currentPrices.push({ name: k.itemName, price: k.currentPrice, itemId: k.itemId })
|
|
|
|
+ idArr.push(k.itemId)
|
|
|
|
+ })
|
|
|
|
+ this.form.serviceType = idArr // 服务类型
|
|
|
|
+ arrInd++
|
|
|
|
+ }
|
|
|
|
+ }
|
|
},
|
|
},
|
|
// 保存
|
|
// 保存
|
|
- onSubmit(formName){
|
|
|
|
|
|
+ onSubmit(){
|
|
const _this = this
|
|
const _this = this
|
|
- _this.$refs[formName].validate(valid => {
|
|
|
|
|
|
+ _this.$refs.ruleForm.validate(valid => {
|
|
if (valid) {
|
|
if (valid) {
|
|
let formData = JSON.parse(JSON.stringify(_this.form))
|
|
let formData = JSON.parse(JSON.stringify(_this.form))
|
|
// 校验营业时间结束时间是否与时段价格一致
|
|
// 校验营业时间结束时间是否与时段价格一致
|
|
@@ -331,17 +343,21 @@
|
|
_this.$message.error('时段价格与营业时间不一致,请修改后再保存!')
|
|
_this.$message.error('时段价格与营业时间不一致,请修改后再保存!')
|
|
return
|
|
return
|
|
}
|
|
}
|
|
- formData.beginTime = _this.timeFormat(formData.beginTime) + ':00'
|
|
|
|
- formData.endTime = _this.timeFormat(formData.endTime) + ':00'
|
|
|
|
|
|
+ formData.beginTime = _this.timeFormat(formData.beginTime)
|
|
|
|
+ formData.endTime = _this.timeFormat(formData.endTime)
|
|
|
|
+ let arr = []
|
|
formData.storeItemPriceDTOList.map(item => {
|
|
formData.storeItemPriceDTOList.map(item => {
|
|
- item.beginTime = _this.timeFormat(item.beginTime) + ':00'
|
|
|
|
- item.endTime = _this.timeFormat(item.endTime) + ':00'
|
|
|
|
- let arr = []
|
|
|
|
item.currentPrices.map(k => {
|
|
item.currentPrices.map(k => {
|
|
- arr.push(Number(k.price))
|
|
|
|
|
|
+ arr.push({
|
|
|
|
+ beginTime: _this.timeFormat(item.beginTime),
|
|
|
|
+ endTime: _this.timeFormat(item.endTime),
|
|
|
|
+ itemId: k.itemId,
|
|
|
|
+ name: k.name,
|
|
|
|
+ currentPrice: k.price
|
|
|
|
+ })
|
|
})
|
|
})
|
|
- item.currentPrices = arr
|
|
|
|
})
|
|
})
|
|
|
|
+ formData.storeItemPriceDTOList = arr
|
|
// 提交前时间格式还需转换
|
|
// 提交前时间格式还需转换
|
|
delete formData.serviceType
|
|
delete formData.serviceType
|
|
storeSave(formData).then(res => {
|
|
storeSave(formData).then(res => {
|
|
@@ -370,12 +386,42 @@
|
|
return v < 10 ? '0' + v : v
|
|
return v < 10 ? '0' + v : v
|
|
},
|
|
},
|
|
// 取消
|
|
// 取消
|
|
- resetForm(){
|
|
|
|
- this.$refs.ruleForm.resetFields()
|
|
|
|
|
|
+ cancel(){
|
|
|
|
+ this.resetForm()
|
|
this.isShow = false
|
|
this.isShow = false
|
|
},
|
|
},
|
|
|
|
+ // 重置表单数据
|
|
|
|
+ resetForm(){
|
|
|
|
+ this.serviceType = [] // 服务类型 change前的值
|
|
|
|
+ this.beginTime = null // 营业时间开始时间 change前的值
|
|
|
|
+ this.endTime = null // 营业时间结束时间 change前的值
|
|
|
|
+ this.subendTime = [] // 时段价格 时段区间结束时间 change前的值
|
|
|
|
+ this.featuredServiceLabel = [] // 网点标签
|
|
|
|
+ this.deviceNo = '' // 已选设备序列号
|
|
|
|
+ // this.$refs.ruleForm.resetFields() 无效
|
|
|
|
+ this.form.id = null
|
|
|
|
+ this.form.name = '' // 网点名称
|
|
|
|
+ this.form.addrProvince = undefined // 省 编码
|
|
|
|
+ this.form.addrProvinceName = '' // 省
|
|
|
|
+ this.form.addrCity = undefined // 市 编码
|
|
|
|
+ this.form.addrCityName = '' // 市
|
|
|
|
+ this.form.addrDistrict = undefined // 区 编码
|
|
|
|
+ this.form.addrDistrictName = '' // 区
|
|
|
|
+ this.form.addrDetail = '' // 详细地址
|
|
|
|
+ this.form.deviceDTOList = [] // 设备序列号
|
|
|
|
+ this.form.featuredServiceLabel = '' // 网点标签
|
|
|
|
+ this.form.lng = '' // 经度
|
|
|
|
+ this.form.lat = '' // 纬度
|
|
|
|
+ this.form.serviceType = [] // 服务类型
|
|
|
|
+ this.form.beginTime = null // 营业时间开始时间
|
|
|
|
+ this.form.endTime = null // 营业时间结束时间
|
|
|
|
+ this.form.storeItemPriceDTOList = [] // 时段价格
|
|
|
|
+ this.form.guidance = '' // 路线指引
|
|
|
|
+ this.form.reminder = '' // 温馨提示
|
|
|
|
+ },
|
|
// 是否重置时段价格 (更改服务类型、营业开始结束时间)
|
|
// 是否重置时段价格 (更改服务类型、营业开始结束时间)
|
|
isResetstoreItemPriceDTOList(type, val){
|
|
isResetstoreItemPriceDTOList(type, val){
|
|
|
|
+ console.log(type, val)
|
|
// type: serviceType 服务类型 beginTime 营业时间 开始时间 endTime 营业时间 结束时间
|
|
// type: serviceType 服务类型 beginTime 营业时间 开始时间 endTime 营业时间 结束时间
|
|
const _this = this
|
|
const _this = this
|
|
setTimeout(()=>{
|
|
setTimeout(()=>{
|
|
@@ -452,11 +498,10 @@
|
|
}
|
|
}
|
|
arr.beginTime = moment(timeStr, 'HH:mm')
|
|
arr.beginTime = moment(timeStr, 'HH:mm')
|
|
arr.endTime = null
|
|
arr.endTime = null
|
|
- arr.itemIds = this.form.serviceType
|
|
|
|
arr.currentPrices = []
|
|
arr.currentPrices = []
|
|
this.form.serviceType.map((item, index) => {
|
|
this.form.serviceType.map((item, index) => {
|
|
let i = this.itemQueryList.findIndex(k => k.id == item)
|
|
let i = this.itemQueryList.findIndex(k => k.id == item)
|
|
- arr.currentPrices.push({ name: this.itemQueryList[i].itemName, price: '' })
|
|
|
|
|
|
+ arr.currentPrices.push({ name: this.itemQueryList[i].itemName, price: '', itemId: item })
|
|
})
|
|
})
|
|
this.form.storeItemPriceDTOList.push(arr)
|
|
this.form.storeItemPriceDTOList.push(arr)
|
|
},
|
|
},
|
|
@@ -581,16 +626,16 @@
|
|
if (!val){
|
|
if (!val){
|
|
this.$emit('close')
|
|
this.$emit('close')
|
|
}else{
|
|
}else{
|
|
|
|
+ this.resetForm() // 重置表单数据
|
|
this.getProvinceList() // 获取省下拉
|
|
this.getProvinceList() // 获取省下拉
|
|
this.getItemQuery() // 服务类型 列表
|
|
this.getItemQuery() // 服务类型 列表
|
|
}
|
|
}
|
|
},
|
|
},
|
|
- // 网点详情 数据
|
|
|
|
- carWashInfo: {
|
|
|
|
- handler: function (item) {
|
|
|
|
- this.setVal(item)
|
|
|
|
- },
|
|
|
|
- deep: true
|
|
|
|
|
|
+ carWashId (newValue, oldValue){
|
|
|
|
+ console.log(newValue,'-----新增编辑')
|
|
|
|
+ if(newValue){
|
|
|
|
+ this.getCarWashInfo(newValue)
|
|
|
|
+ }
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
@@ -630,7 +675,7 @@
|
|
}
|
|
}
|
|
.btn-cont{
|
|
.btn-cont{
|
|
text-align: center;
|
|
text-align: center;
|
|
- .resetForm{
|
|
|
|
|
|
+ .cancel{
|
|
margin-left: 10px;
|
|
margin-left: 10px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
@@ -638,6 +683,9 @@
|
|
width: 40%;
|
|
width: 40%;
|
|
color: #19be6b;
|
|
color: #19be6b;
|
|
}
|
|
}
|
|
|
|
+ .input-number-all{
|
|
|
|
+ width: 100%;
|
|
|
|
+ }
|
|
.input-number-s{
|
|
.input-number-s{
|
|
width: 90%;
|
|
width: 90%;
|
|
}
|
|
}
|
|
@@ -645,6 +693,8 @@
|
|
display: inline-block;
|
|
display: inline-block;
|
|
width: 10%;
|
|
width: 10%;
|
|
text-align: right;
|
|
text-align: right;
|
|
|
|
+ padding-left: 5px;
|
|
|
|
+ box-sizing: border-box;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|