zhuce
/
lilishop-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: ✨ 商家端使用最新地址选择器，默认在config关闭高德地图功能，开启后可继续使用

master
Yer 2023-08-02 10:53:14 +08:00
parent a4d17102f1
commit 8a43335b75
10 changed files with 342 additions and 481 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
seller/src/config/index.js
View File

@ -10,6 +10,7 @@ module.exports = {
aMapSecurityJsCode: "2bd0fbf621881f4c77be74f0e76495f3", // 高德web端js申请的安全密钥
aMapKey: "7f11113750315d8543daaf5c3ba353ca", //高德web端js申请的api key
website: "https://www.pickmall.cn", //官网地址
aMapSwitch:false, //是否开启高德定位
enableCDN: true, //生产环境 是否启用cdn加载 vue等js
port: 10002, //端口
inputMaxLength: "140", //全局输入框默认最大输入长度字

4
seller/src/main.js
View File

@ -19,7 +19,7 @@ import {
} from "@/libs/axios";
import {setStore, getStore, removeStore} from "@/libs/storage";
import i18nBox from '@/views/lili-components/i18n-translate'
import util from "@/libs/util";
import VueLazyload from "vue-lazyload";
@ -55,7 +55,7 @@ copyViewUi.Input.props.maxlength.default = inputMaxLength // 挂载最大输入
Vue.use(copyViewUi);
Vue.component('liliDialog', liliDialog)
Vue.component('i18nBox', i18nBox)
Vue.component('liliDialog', liliDialog)
Vue.component("vue-qr", vueQr); //此处将vue-qr添加为全局组件

55
seller/src/views/lili-components/i18n-translate.vue
View File

@ -1,55 +0,0 @@
<template>
<div>
<Button @click="enable = true">语言设定</Button>
<Modal v-model="enable" draggable sticky scrollable :mask="false" :title="title">
<Tabs closable type="card" @on-tab-remove="handleTabRemove" :value="language[0].title">
<TabPane v-for="(item,index) in language" :key="index" :label="item.title" :name="item.title">
<Input v-model="item.___i18n" />
</TabPane>
</Tabs>
</Modal>
</div>
</template>
<script>
import {language} from "./languages";
export default {
/**
* tabs 循环的语言内容格式 [{'title':'test','value':'val'}]
*/
props: {
value: {
type: null,
default: "",
},
},
watch: {
language: {
handler(val) {
this.$emit("language", { language: [...val], val: this.value });
},
deep: true,
},
},
data() {
return {
language,
tabVal: "",
enable: false, //是否开启modal
title: "转换语言",
};
},
methods: {
// 删除tab标签将没有用的语音进行删除
handleTabRemove(tab) {
this.language = this.language.filter((item) => {
return item.value != tab;
});
},
},
};
</script>
<style lang="scss" scoped>
</style>

1
seller/src/views/lili-components/languages.js
View File

@ -1 +0,0 @@
export const language = [{ title: "中文",value:1 }, { title: "英文" ,value:2}];

119
seller/src/views/lili-components/region.vue
View File

@ -1,119 +0,0 @@
<template>
<div>
<Cascader
:data="data"
:load-data="loadData"
change-on-select
@on-visible-change="handleChangeOnSelect"
@on-change="change"
></Cascader>
</div>
</template>
<script>
import * as API_Setup from "@/api/common.js";
export default {
data() {
return {
dd:"",
data: [], // 地区数据
selected: [], // 已选地区
changeOnSelect: false, // 选择时的变化
id: 0 // 0层id
};
},
mounted() {
this.init();
},
props: ['addressId'],
methods: {
// 选择地区回显
change(val, selectedData) {
/**
* @returns [regionId,region]
*/
this.$emit("selected", [
val,
selectedData[selectedData.length - 1].__label.split("/"),
]);
},
/**
* 动态设置change-on-select的值
* 当级联选择器弹窗展开时，设置change-on-select为true，即可以点选菜单选项值发生变化
* 当级联选择器弹窗关闭时，设置change-on-select为false，即能够设置初始值
*/
handleChangeOnSelect(value) {
this.changeOnSelect = value;
},
// 动态加载数据
loadData(item, callback) {
item.loading = true;
API_Setup.getChildRegion(item.value).then((res) => {
if (res.result.length <= 0) {
item.loading = false;
this.selected = item;
/**
* 处理数据并返回
*/
} else {
res.result.forEach((child) => {
item.loading = false;
let data = {
value: child.id,
label: child.name,
loading: false,
children: [],
};
if (
child.level == "street" ||
item.label == "香港特别行政区" ||
item.label == "澳门特别行政区"
) {
item.children.push({
value: child.id,
label: child.name,
});
} else {
item.children.push(data);
}
});
this.selected = item;
callback();
}
});
},
// 初始化数据
init() {
API_Setup.getChildRegion(this.id).then((res) => {
let way = [];
res.result.forEach((item) => {
let data;
// 台湾省做处理
if (item.name == "台湾省") {
data = {
value: item.id,
label: item.name,
};
} else {
data = {
value: item.id,
label: item.name,
loading: false,
children: [],
};
}
way.push(data);
});
this.data = way;
});
},
},
};
</script>

89
seller/src/views/my-components/map/index.vue
View File

@ -1,31 +1,23 @@
<template>
<div class="map">
<Modal v-model="showMap" title="选择地址" width="800">
<div class="address">{{ addrContent.address }}</div>
<div id="map-container"></div>
<div class="search-con">
<Input
placeholder="输入关键字搜索"
id="input-map"
v-model="mapSearch"
/>
<ul>
<li
v-for="(tip, index) in tips"
:key="index"
@click="selectAddr(tip.location)"
>
<p>{{ tip.name }}</p>
<p>{{ tip.district + tip.address }}</p>
</li>
</ul>
</div>
<div slot="footer">
<Button type="default" @click="showMap = false">取消</Button>
<Button type="primary" :loading="loading" @click="ok">确定</Button>
</div>
</Modal>
<div class="address">{{ addrContent.address }}</div>
<div id="map-container"></div>
<div class="search-con">
<Input placeholder="输入关键字搜索" id="input-map" v-model="mapSearch" />
<ul>
<li v-for="(tip, index) in tips" :key="index" @click="selectAddr(tip.location)">
<p>{{ tip.name }}</p>
<p>{{ tip.district + tip.address }}</p>
</li>
</ul>
</div>
<div slot="footer" class="footer">
<Button type="primary" :loading="loading" @click="ok">确定</Button>
</div>
</div>
</template>
<script>
@ -56,21 +48,25 @@ export default {
},
methods: {
ok() {
// 确定选择
this.loading = true;
const params = {
cityCode: this.addrContent.regeocode.addressComponent.citycode,
townName: this.addrContent.regeocode.addressComponent.township,
};
getRegion(params).then((res) => {
if (res.success) {
this.addrContent.addr = res.result.name.replace(/,/g, " ");
this.addrContent.addrId = res.result.id;
this.loading = false;
this.showMap = false;
this.$emit("getAddress", this.addrContent);
}
});
if (this.addrContent && this.addrContent.regeocode) {
const params = {
cityCode: this.addrContent.regeocode.addressComponent.citycode,
townName: this.addrContent.regeocode.addressComponent.township,
};
getRegion(params).then((res) => {
if (res.success) {
this.addrContent.addr = res.result.name.replace(/,/g, " ");
this.addrContent.addrId = res.result.id;
this.loading = false;
this.$emit("getAddress", this.addrContent);
}
});
} else {
this.$Message.error('未获取到坐标信息！请查看高德API配置是否正确')
}
},
init() {
AMapLoader.load({
@ -122,7 +118,7 @@ export default {
that.addrContent = positionResult;
});
})
.catch((e) => {});
.catch((e) => { });
},
searchOfMap(val) {
// 地图搜索
@ -162,16 +158,20 @@ export default {
right: 20px;
top: 64px;
width: 260px;
ul {
width: 260px;
height: 400px;
height: 360px;
overflow: scroll;
li {
padding: 5px;
p:nth-child(2) {
color: #999;
font-size: 12px;
}
&:hover {
background-color: #eee;
cursor: pointer;
@ -185,4 +185,9 @@ export default {
// color: $theme_color;
font-weight: bold;
}
.footer {
text-align: right;
margin: 10px 0;
}
</style>

143
seller/src/views/my-components/map/multiple-map.vue Normal file
View File

@ -0,0 +1,143 @@
<template>
<Modal width="800" footer-hide v-model="enableMap">
<RadioGroup @on-change="changeMap" v-model="mapDefault" type="button">
<Radio label="select">级联选择</Radio>
<Radio label="map" v-if="aMapSwitch">高德地图</Radio>
</RadioGroup>
<div>
<div v-if="mapDefault === 'select'">
<div class="selector">
<div class="selector-item" v-for="(plant, plantIndex) in Object.keys(data)" :key="plantIndex">
<div :class="{ 'active': chiosend[plantIndex].id == item.id }" v-for="(item, index) in data[plant]"
:key="index"
@click="init(item, plantIndex != Object.keys(data).length - 1 ? Object.keys(data)[plantIndex + 1] : 0, plantIndex)"
class="map-item">
{{ item.name }}
</div>
</div>
</div>
<div class="footer">
<Button type="primary" @click="finished">确定</Button>
</div>
</div>
<mapping v-if="mapDefault === 'map'" ref="map" @getAddress="getAddress" />
</div>
</Modal>
</template>
<script>
import { aMapSwitch } from '@/config/index'
import mapping from "@/views/my-components/map/index.vue";
import * as API_Setup from "@/api/common.js";
export default {
components: { mapping },
data() {
return {
aMapSwitch,
enableMap: false,
mapDefault: "select",
data: {
province: [], //省
city: [], //市
area: [], //区
street: [], //街道
},
chiosend: [],
};
},
mounted() {
this.chiosend = new Array(4).fill("");
},
methods: {
open() {
this.enableMap = true
this.init({ id: 0 }, 'province');
},
changeMap(val) {
this.mapDefault = val
},
init(val, level = 'province', index) {
if (level == 0) {
// 说明选择到了街道，将街道id存入数组
this.chiosend.splice(3, 1, val);
}
else {
API_Setup.getChildRegion(val.id).then((res) => {
if (res.result.length && val.id !== 0) {
this.chiosend[index] = val
}
this.data[level] = res.result;
if (level == 'city') {
this.data.area = []
this.data.street = []
}
if (level == 'area') {
this.data.street = []
}
});
}
},
getAddress(center) {
this.$emit('callback', {
type: this.mapDefault,
data: center
})
this.enableMap = false;
},
// 选择完成
finished() {
const params = this.chiosend.filter((item) => item.value !== "");
this.enableMap = false;
this.$emit('callback', {
type: this.mapDefault,
data: params
})
},
},
}
</script>
<style lang="scss" scoped>
.selector {
height: 400px;
padding: 10px 0;
display: flex;
}
.selector-item {
width: 100%;
flex: 1;
overflow: auto;
}
.map-item {
width: 100%;
padding: 10px;
border-bottom: 1px solid #eee;
cursor: pointer;
&:hover {
background: #eee;
}
}
.active {
background: #eee;
}
.footer {
text-align: right;
margin: 10px 0;
}
</style>

60
seller/src/views/order/order/orderDetail.vue
View File

@ -12,7 +12,7 @@
<Button @click="sfPrint" type="primary" ghost
v-if="allowOperation.showLogistics && logisticsType == 'SHUNFENG'">下载面单</Button>
<Button @click="Toprint" type="primary" ghost
<Button @click="toPrint" type="primary" ghost
v-if="allowOperation.ship && logisticsType != 'SHUNFENG'">打印电子面单</Button>
</div>
</Card>
@ -290,11 +290,11 @@
<Input v-model="addressForm.consigneeMobile" size="large" maxlength="11"></Input>
</FormItem>
<FormItem label="地址信息" prop="consigneeAddressPath">
<Input v-model="addressForm.consigneeAddressPath" disabled style="width: 325px" v-if="showRegion == false" />
<Button v-if="showRegion == false" size="small" @click="regionClick" :loading="submitLoading" type="primary"
<span>{{ addressForm.consigneeAddressPath }}</span>
<Button size="small" type="default" @click="$refs.map.open()"
style="margin-left: 8px">修改
</Button>
<region style="width: 400px" @selected="selectedRegion" v-if="showRegion == true" />
</FormItem>
<FormItem label="详细地址" prop="consigneeDetail">
<Input v-model="addressForm.consigneeDetail" size="large" maxlength="11"></Input>
@ -471,24 +471,27 @@
<Button type="primary" v-print="printInfoObj">打印发货单</Button>
</div>
</Modal>
<multipleMap ref="map" @callback="getAddress"></multipleMap>
</div>
</template>
<script>
import * as API_Order from "@/api/order";
import * as API_Logistics from "@/api/logistics";
import liliMap from "@/views/my-components/map/index";
import * as RegExp from "@/libs/RegExp.js";
import region from "@/views/lili-components/region";
import multipleMap from "@/views/my-components/map/multiple-map";
export default {
name: "orderDetail",
components: {
liliMap,
region,
multipleMap,
},
data () {
return {
loading:false,
typeList: [],
showPrices: false,
printHiddenFlag: false,//隐藏信息
@ -498,10 +501,8 @@ export default {
extraHead: '',//头部文字 默认空
},
submitLoading: false, // 添加或编辑提交状态
region: [], //地区
regionId: [], //地区id
logisticsType: 'KUAIDINIAO', //物流类型
showRegion: false,
someJSONdata: '',
faceSheetForm: {
logisticsId: '',
@ -692,11 +693,20 @@ export default {
};
},
methods: {
//修改地址
regionClick () {
this.showRegion = true;
this.regionId = "";
// 回调地址信息
getAddress(val){
if(val.type === 'select'){
const paths = val.data.map(item => item.name).join(',')
const ids = val.data.map(item => item.id).join(',')
this.$set(this.addressForm, 'consigneeAddressPath', paths)
this.$set(this.addressForm, 'consigneeAddressIdPath', ids)
}
else{
this.$set(this.addressForm, 'consigneeAddressPath', val.data.addr)
this.$set(this.addressForm, 'consigneeAddressIdPath', val.data.addrId)
}
},
//弹出订单核销框
orderTake () {
this.orderTakeForm.qrCode = this.orderInfo.order.verificationCode;
@ -766,7 +776,7 @@ export default {
}
});
},
Toprint () {
toPrint () {
this.facesheetFlag = true;
API_Logistics.getCheckedOn().then(res => {
if (res.success) {
@ -797,11 +807,6 @@ export default {
}
});
},
// 选中的地址
selectedRegion (val) {
this.region = val[1];
this.regionId = val[0];
},
//查询物流
logistics () {
this.logisticsModal = true;
@ -869,7 +874,7 @@ export default {
}
})
},
Toprints () {
toPrints () {
if (this.form.logisticsId != null && this.form.logisticsId != '') {
this.orderDeliverModal = false;
}
@ -882,7 +887,7 @@ export default {
API_Order.getOrderFaceSheet(this.sn, this.faceSheetForm).then(res => {
if (res.success) {
this.someJSONdata = res.result.printTemplate;
this.Toprints();
this.toPrints();
}
})
}
@ -906,9 +911,6 @@ export default {
//弹出修改收货地址框
editAddress () {
this.addressModal = true;
this.showRegion = false;
this.regionId = this.orderInfo.order.consigneeAddressIdPath;
this.region = this.orderInfo.order.consigneeAddressPath;
this.addressForm.consigneeName = this.orderInfo.order.consigneeName;
this.addressForm.consigneeMobile = this.orderInfo.order.consigneeMobile;
this.addressForm.consigneeDetail = this.orderInfo.order.consigneeDetail;
@ -919,12 +921,6 @@ export default {
},
//修改收货地址
editAddressSubmit () {
if (this.regionId == "") {
this.$Message.error("请选择地址");
return;
}
this.addressForm.consigneeAddressPath = this.region;
this.addressForm.consigneeAddressIdPath = this.regionId;
this.$refs.addressForm.validate((valid) => {
if (valid) {
API_Order.editOrderConsignee(this.sn, this.addressForm).then(

27
seller/src/views/shop/shopAddress.vue
View File

@ -36,7 +36,8 @@
<Input v-model="form.addressName" clearable style="width: 90%"/>
</FormItem>
<FormItem label="详细地址" prop="address">
<Input v-model="form.address" @on-focus="$refs.liliMap.showMap = true" clearable style="width: 90%"/>
<span>{{ form.address || '暂无地址' }}</span>
<Button type="default" style="margin-left: 10px;" @click="$refs.map.open()">选择地址</Button>
</FormItem>
<FormItem label="联系电话" prop="mobile">
<Input v-model="form.mobile" clearable style="width: 90%" maxlength="11"/>
@ -50,20 +51,21 @@
>
</div>
</Modal>
<liliMap ref="liliMap" @getAddress="getAddress"></liliMap>
<multipleMap ref="map" @callback="getAddress"></multipleMap>
</div>
</template>
<script>
import * as API_Shop from "@/api/shops";
import { validateMobile } from "@/libs/validate";
import liliMap from "@/views/my-components/map/index";
import multipleMap from "@/views/my-components/map/multiple-map";
export default {
name: "shopAddress",
components: {
liliMap
multipleMap
},
data() {
return {
@ -224,10 +226,19 @@
this.getDataList();
},
//获取地址
getAddress(item){
this.$set(this.form, 'address', item.addr)
this.form.address = item.address
this.form.center = item.position.lat + "," + item.position.lng
getAddress(val){
if(val.type === 'select'){
const paths = val.data.map(item => item.name).join(',')
this.$set(this.form, 'address', paths)
this.form.center = val.data[val.data.length - 1].center
}
else{
this.$set(this.form, 'address', val.data.addr)
this.form.address = val.data.address
this.form.center = val.data.position.lng + "," + val.data.position.lat
}
},
// 获取数据
getDataList() {

324
seller/src/views/shop/shopSetting.vue
View File

@ -3,115 +3,50 @@
<Card style="margin-left: 10px">
<Tabs v-model="type" @on-click="handleClickType">
<TabPane label="基本信息" name="INFO">
<Form
ref="form"
:model="form"
:label-width="100"
:rules="formValidate"
>
<Form ref="form" :model="form" :label-width="100" :rules="formValidate">
<FormItem label="店铺名称">
<Input
v-model="storeName"
disabled
clearable
style="width: 20%"
/>
<Input v-model="storeName" disabled clearable style="width: 20%" />
</FormItem>
<FormItem label="店铺地址" prop="address">
<Input
v-model="form.address"
@on-focus="$refs.liliMap.showMap = true"
clearable
style="width: 20%"
/>
<FormItem label="店铺地址" prop="storeAddressPath">
<span>{{ form.storeAddressPath }}</span>
<Button style="margin-left: 10px;" @click="handleChangeAddress('storeAddress')">选择</Button>
</FormItem>
<FormItem label="详细地址" prop="shopAddressDetail">
<Input
v-model="form.storeAddressDetail"
clearable
style="width: 20%"
maxlength="50"
/>
<Input v-model="form.storeAddressDetail" clearable style="width: 20%" maxlength="50" />
</FormItem>
<FormItem label="店铺LOGO：">
<upload-pic-thumb
v-model="form.storeLogo"
:multiple="false"
></upload-pic-thumb>
<upload-pic-thumb v-model="form.storeLogo" :multiple="false"></upload-pic-thumb>
</FormItem>
<FormItem label="店铺简介" prop="content" class="wangEditor">
<Input
type="textarea"
:rows="8"
v-model="form.storeDesc"
style="width: 30%"
></Input>
<Input type="textarea" :rows="8" v-model="form.storeDesc" style="width: 30%"></Input>
</FormItem>
<FormItem label="店铺楼层" prop="content" class="wangEditor">
<i-switch v-model="form.pageShow" @on-change="pageShow"></i-switch>
<span class="desc">店铺楼层装修是否开启，开启后移动端PC端将会自动展示装修的内容</span>
<span class="desc">店铺楼层装修是否开启，开启后移动端PC端将会自动展示装修的内容</span>
</FormItem>
<FormItem label="开启自提" prop="content" class="wangEditor">
<i-switch v-model="form.selfPickFlag" @on-change="changeSelfPickFlag"></i-switch>
<span class="desc">店铺是否开启自提功能</span>
<span class="desc">店铺是否开启自提功能</span>
</FormItem>
<Form-item>
<Button
@click="handleSubmit"
:loading="submitLoading"
type="primary"
style="margin-right: 5px"
>修改
<Button @click="handleSubmit" :loading="submitLoading" type="primary" style="margin-right: 5px">修改
</Button>
</Form-item>
</Form>
</TabPane>
<TabPane label="发货地址">
<Form
ref="addressGoods"
:model="addressGoods"
:label-width="100"
:rules="addressGoodsValidate"
>
<Form ref="addressGoods" :model="addressGoods" :label-width="100" :rules="addressGoodsValidate">
<FormItem label="发货人姓名" prop="salesConsignorName">
<Input
v-model="addressGoods.salesConsignorName"
maxlength="11"
clearable
style="width: 20%"
>
<Input v-model="addressGoods.salesConsignorName" maxlength="11" clearable style="width: 20%">
</Input>
</FormItem>
<FormItem label="发货人手机号" prop="salesConsignorMobile">
<Input
v-model="addressGoods.salesConsignorMobile"
maxlength="11"
clearable
style="width: 20%"
>
<Input v-model="addressGoods.salesConsignorMobile" maxlength="11" clearable style="width: 20%">
</Input>
</FormItem>
<FormItem label="地址" prop="salesConsignorAddressId">
<Input
v-model="regionGoods"
clearable
disabled
style="width: 20%"
v-if="showRegion == false"
>
</Input>
<regionMap
style="width: 20%"
@selected="selectedRegionGoods"
v-if="showRegion == true"
/>
<Button
v-if="showRegion == false"
@click="regionClicks"
type="primary"
style="margin-left: 8px"
>修改
</Button>
<span>{{ addressGoods.salesConsignorAddressPath }}</span>
<Button style="margin-left: 10px;" @click="handleChangeAddress('addressGoods')">选择</Button>
</FormItem>
<!-- <FormItem label="地址名称" prop="salesConsignorAddressPath">
<Input
@ -122,110 +57,45 @@
</Input>
</FormItem> -->
<FormItem label="详细地址" prop="salesConsignorDetail">
<Input
v-model="addressGoods.salesConsignorDetail"
clearable
style="width: 20%"
>
<Input v-model="addressGoods.salesConsignorDetail" clearable style="width: 20%">
</Input>
</FormItem>
<Button
@click="SetAddressGoods"
type="primary"
style="margin-left: 8px"
>确认
<Button @click="setAddressGoods" type="primary" style="margin-left: 8px">确认
</Button>
</Form>
</TabPane>
<TabPane label="退货地址" name="REFUND_GOODS_ADDRESS">
<Form
ref="addressForm"
:model="addressForm"
:label-width="100"
:rules="afterFormValidate"
>
<Form ref="addressForm" :model="addressForm" :label-width="100" :rules="afterFormValidate">
<FormItem label="收货人" prop="salesConsigneeName">
<Input
v-model="addressForm.salesConsigneeName"
maxlength="11"
clearable
style="width: 20%"
/>
<Input v-model="addressForm.salesConsigneeName" maxlength="11" clearable style="width: 20%" />
</FormItem>
<FormItem label="收货人电话" prop="salesConsigneeMobile">
<Input
v-model="addressForm.salesConsigneeMobile"
maxlength="11"
style="width: 20%"
/>
<Input v-model="addressForm.salesConsigneeMobile" maxlength="11" style="width: 20%" />
</FormItem>
<FormItem label="售后地址">
<Input
v-model="region"
disabled
style="width: 20%"
v-if="showRegion == false"
/>
<Button
v-if="showRegion == false"
@click="regionClick"
:loading="submitLoading"
type="primary"
style="margin-left: 8px"
>修改
</Button>
<regionMap
style="width: 20%"
@selected="selectedRegion"
v-if="showRegion == true"
/>
<span>{{ addressForm.salesConsigneeAddressPath }}</span>
<Button style="margin-left: 10px;" @click="handleChangeAddress('salesConsigneeAddressPath')">选择</Button>
</FormItem>
<FormItem label="详细地址" prop="salesConsigneeDetail">
<Input
v-model="addressForm.salesConsigneeDetail"
clearable
style="width: 20%"
maxlength="50"
/>
<Input v-model="addressForm.salesConsigneeDetail" clearable style="width: 20%" maxlength="50" />
</FormItem>
<Form-item>
<Button
@click="afterHandleSubmit"
:loading="submitLoading"
type="primary"
style="margin-right: 5px"
>修改
<Button @click="afterHandleSubmit" :loading="submitLoading" type="primary" style="margin-right: 5px">修改
</Button>
</Form-item>
</Form>
</TabPane>
<TabPane label="库存预警" name="STOCK_WARNING">
<Form
ref="stockWarningForm"
:model="stockWarningForm"
:label-width="100"
:rules="stockWarningFormValidate"
>
<Form ref="stockWarningForm" :model="stockWarningForm" :label-width="100" :rules="stockWarningFormValidate">
<FormItem label="预警数" prop="stockWarning">
<InputNumber
:min="0"
:max="99999"
v-model="stockWarningForm.stockWarning"
type="number"
maxlength="6"
clearable
style="width: 20%"
/>
<InputNumber :min="0" :max="99999" v-model="stockWarningForm.stockWarning" type="number" maxlength="6"
clearable style="width: 20%" />
</FormItem>
<Form-item>
<Button
@click="stockWarningHandleSubmit"
:loading="submitLoading"
type="primary"
style="margin-right: 5px"
>修改
<Button @click="stockWarningHandleSubmit" :loading="submitLoading" type="primary"
style="margin-right: 5px">修改
</Button>
</Form-item>
</Form>
@ -260,7 +130,7 @@
</Tabs>
</Card>
<liliMap ref="liliMap" @getAddress="getAddress"></liliMap>
<multipleMap ref="map" @callback="callbackAddress" />
</div>
</template>
@ -268,23 +138,25 @@
import * as API_Shop from "@/api/shops";
import { validateMobile } from "@/libs/validate";
import uploadPicThumb from "@/views/my-components/lili/upload-pic-thumb";
import liliMap from "@/views/my-components/map/index";
import regionMap from "@/views/lili-components/region";
import multipleMap from "@/views/my-components/map/multiple-map";
import * as RegExp from "@/libs/RegExp.js";
import Cookies from "js-cookie";
export default {
name: "shopSetting",
components: {
uploadPicThumb,
liliMap,
regionMap,
multipleMap
},
data() {
return {
currentKey: "", //存储当前点击地址的key
showMap: false, // 是否展示地图
type: "INFO",
showRegion: false, // 选择地址模态框显隐
storeName: "", //店铺名称
region: "", // 地区名称
regionId: [], // 地区id
addressForm: {
// 退货地址
@ -304,7 +176,7 @@ export default {
},
stockWarningFormValidate: {
stockWarning: [
{ required: true, type:'number', message: "请输入库存预警数", trigger: "blur" },
{ required: true, type: 'number', message: "请输入库存预警数", trigger: "blur" },
],
},
udeskFormValidate: {
@ -386,13 +258,13 @@ export default {
submitLoading: false, // 添加或编辑提交状态
//发货地址
addressGoods: {
salesConsignorName:" ",
salesConsignorMobile:" ",
salesConsignorName: " ",
salesConsignorMobile: " ",
salesConsignorAddressId: " ",
salesConsignorAddressPath: " ",
salesConsignorDetail: " ",
},
regionGoods:"",//发货地址
addressGoodsValidate: {
salesConsignorName: [
{ required: true, message: "请输入发货人姓名", trigger: "blur" },
@ -412,31 +284,63 @@ export default {
};
},
methods: {
// 回调地址
callbackAddress(val) {
if (val.type === 'select') {
const paths = val.data.map(item => item.name).join(',')
const ids = val.data.map(item => item.id).join(',')
if (this.currentKey === 'storeAddress') {
this.form.storeAddressPath = paths
this.form.storeAddressIdPath = ids
this.form.storeCenter = val.data[val.data.length - 1].center
}
if (this.currentKey === 'addressGoods') {
this.addressGoods.salesConsignorAddressPath = paths
this.addressGoods.salesConsignorAddressId = ids
}
if (this.currentKey === 'salesConsigneeAddressPath') {
this.addressForm.salesConsigneeAddressPath = paths
this.addressForm.salesConsigneeAddressId = ids
}
}
else {
if (this.currentKey === 'storeAddressstoreAddress') {
this.form.storeAddressPath = val.data.addr;
this.form.storeAddressIdPath = val.data.addrId;
this.form.storeCenter = val.data.position.lng + "," + val.data.position.lat;
}
if (this.currentKey === 'addressGoods') {
this.addressGoods.salesConsignorAddressPath = val.data.addr;
this.addressGoods.salesConsignorAddressId = val.data.addrId;
}
if (this.currentKey === 'salesConsigneeAddressPath') {
this.addressForm.salesConsigneeAddressPath = val.data.addr;
this.addressForm.salesConsigneeAddressId = val.data.addrId;
}
}
},
// 修改地址
handleChangeAddress(key) {
this.currentKey = key
this.$refs.map.open();
},
// 初始化数据
init() {
this.getShopInfo();
this.getDeliverAddress()
},
selectedRegionGoods(val){
this.regionGoods = val[1];
this.regionIdS = val[0];
},
regionClicks(){
this.showRegion = true;
this.regionIdS = "";
},
SetAddressGoods(){
setAddressGoods() {
console.log(this.$refs.addressGoods)
if (this.regionIdS == "") {
this.$Message.error("请选择地址");
return;
}
this.$refs.addressGoods.validate((valid) => {
if (valid) {
this.addressGoods.salesConsignorAddressPath = this.regionGoods;
this.addressGoods.salesConsignorAddressId = this.regionIdS;
API_Shop.editDeliverAddress(this.addressGoods).then(res=>{
if(res.success){
API_Shop.editDeliverAddress(this.addressGoods).then(res => {
if (res.success) {
this.$Message.success("修改成功")
}
})
@ -450,7 +354,7 @@ export default {
this.loading = false;
if (res.success) {
this.form = res.result;
this.$set(this.form, "address", res.result.storeAddressPath);
this.storeName = res.result.storeName;
this.form.storeCenter = res.result.storeCenter;
Cookies.set("userInfoSeller", JSON.stringify(res.result));
@ -468,15 +372,15 @@ export default {
pageShow(type) {
this.form.pageShow = type
},
changeSelfPickFlag(item){
if(item){
changeSelfPickFlag(item) {
if (item) {
this.form.selfPickFlag = item
}
},
getDeliverAddress(){
API_Shop.getDeliverAddress().then(res=>{
if(res.success){
if(res.result!= '' && res.result != null){
getDeliverAddress() {
API_Shop.getDeliverAddress().then(res => {
if (res.success) {
if (res.result != '' && res.result != null) {
this.addressGoods = res.result;
this.regionGoods = res.result.salesConsignorAddressPath;
this.regionIdS = res.result.salesConsignorAddressId;
@ -484,11 +388,7 @@ export default {
}
})
},
//修改售后地址
regionClick() {
this.showRegion = true;
this.regionId = "";
},
//重置
handleReset() {
this.$refs.form.resetFields();
@ -537,11 +437,7 @@ export default {
}
});
},
// 选中的地址
selectedRegion(val) {
this.region = val[1];
this.regionId = val[0];
},
//tab切换
handleClickType(v) {
//退款
@ -558,40 +454,24 @@ export default {
API_Shop.getRefundGoodsAddress().then((res) => {
if (res.result != null) {
this.addressForm = res.result;
this.regionId = res.result.salesConsigneeAddressId;
this.region = res.result.salesConsigneeAddressPath;
}
});
},
//提交保存
afterHandleSubmit() {
if (this.regionId == "") {
this.$Message.error("请选择地址");
return;
}
this.$refs.addressForm.validate((valid) => {
if (valid) {
this.addressForm.salesConsigneeAddressPath = this.region;
this.addressForm.salesConsigneeAddressId = this.regionId;
this.submitLoading = true;
API_Shop.saveRefundGoodsAddress(this.addressForm).then((res) => {
this.submitLoading = false;
if (res.success) {
this.$Message.success("修改成功");
this.getRefundGoodsAddress();
this.showRegion = false;
}
});
}
});
},
//获取地址
getAddress(item) {
this.$set(this.form, "address", item.addr);
this.form.storeAddressPath = item.addr;
this.form.storeAddressIdPath = item.addrId;
this.form.storeCenter = item.position.lng + "," + item.position.lat;
},
},
mounted() {
this.init();
@ -599,7 +479,7 @@ export default {
};
</script>
<style scoped lang="scss">
.desc{
.desc {
margin-left: 10px;
color: #999;
}