From 151dcafcc9b5a91b544b65bd6a0e822cbd60e19b Mon Sep 17 00:00:00 2001
From: zhaoxiaoqiang <287285524@qq.com>
Date: Mon, 30 Aug 2021 14:43:43 +0800
Subject: [PATCH] 门店名称长度限制，以及升档
---
src/views/mine/stores/stores-add.vue | 234 ++++++++++++++++++++++++++--------------------------------
1 files changed, 104 insertions(+), 130 deletions(-)
diff --git a/src/views/mine/stores/stores-add.vue b/src/views/mine/stores/stores-add.vue
index d0d8376..11ef058 100644
--- a/src/views/mine/stores/stores-add.vue
+++ b/src/views/mine/stores/stores-add.vue
@@ -1,173 +1,151 @@
-
<!--
新增门店
-->
<template>
<div class="stores-add-box h-100-g">
-
<v-navbar title="新增门店" fixed></v-navbar>
<div class="cell-group">
- <v-cell v-model="form.storeName" :max="20" label='门店名称' icon='iconyonghu' placeholder='请输入门店名称'></v-cell>
- <v-cell label='所在地区' icon='icondingwei' @click.native="isShowArea = true;" placeholder='请选择'>
+ <v-cell v-model="form.storeName" :max="100" label="门店名称" icon="iconyonghu" placeholder="请输入门店名称"></v-cell>
+ <v-cell label="所在地区" icon="icondingwei" @click.native="isShowArea = true" placeholder="请选择">
<div slot="v-cell-right" class="flex-center-g">
- <div v-if="form.areaText">{{form.areaText}}</div>
- <div v-else style="color: #a2a2a2">请选择 </div>
+ <div v-if="form.areaText">{{ form.areaText }}</div>
+ <div v-else style="color: #a2a2a2">请选择</div>
<svg class="icon" aria-hidden="true" style="width:18px;height:18px;fill:#999;">
<use xlink:href="#iconyou"></use>
</svg>
</div>
</v-cell>
- <v-cell v-model="form.dtlAddr" :max="30" label='详细地址' icon='icontishi' placeholder='请输入详细地址'></v-cell>
+ <v-cell v-model="form.dtlAddr" :max="30" label="详细地址" icon="icontishi" placeholder="请输入详细地址"></v-cell>
</div>
<div class="cell-group">
- <v-cell v-model="form.priName" :max="6" label='负责人姓名' placeholder='请输入姓名'></v-cell>
- <v-cell v-model="form.priMblNo" :max="11" type="tel" label='负责人手机号' placeholder='请输入手机号'></v-cell>
- <v-cell v-model="form.priIdNo" :max="18" label='负责人身份证号' placeholder='请输入身份证号'></v-cell>
- <v-cell v-model="form.outChanNo" :max="20" label='渠道编码' placeholder='请输入渠道编码'></v-cell>
+ <v-cell v-model="form.priName" :max="6" label="负责人姓名" placeholder="请输入姓名"></v-cell>
+ <v-cell v-model="form.priMblNo" :max="11" type="tel" label="负责人手机号" placeholder="请输入手机号"></v-cell>
+ <v-cell v-model="form.priIdNo" :max="18" label="负责人身份证号" placeholder="请输入身份证号"></v-cell>
+ <v-cell v-model="form.outChanNo" :max="20" label="渠道编码" placeholder="请输入渠道编码"></v-cell>
</div>
<p class="tip">*该手机号将作为登录用户名，密码将通过短信发至手机</p>
<div class="cell-group">
- <v-cell v-model="form.priEmail" :max="50" label='联系邮箱' placeholder='请输入邮箱地址'></v-cell>
+ <v-cell v-model="form.priEmail" :max="50" label="联系邮箱" placeholder="请输入邮箱地址"></v-cell>
</div>
<footer class="flex-center-g footer">
<van-button class="btn" @click="addStore">新增门店</van-button>
</footer>
-
<van-popup v-model="isShowArea" position="bottom" :close-on-click-overlay="false">
- <van-area ref='Area' :area-list='areaList' @cancel="closeAreaModal" @confirm="setAreaValue"></van-area>
+ <van-area ref="Area" :area-list="areaList" @cancel="closeAreaModal" @confirm="setAreaValue"></van-area>
</van-popup>
-
</div>
</template>
<script>
- import { mapState } from 'vuex';
- export default {
- name: "stores-add",
- data(){
- return {
- isShowArea:false,
- Btn:false,
- form:{
- areaText:'', //地区文字展示
- storeName:'', //门店名称
- dtlAddr:'', //详细地址
- priName:'', //负责人姓名
- priEmail:'', //联系邮箱
- priMblNo:'', //负责人手机
- priIdNo: '', //身份证号
- provCode: '',
- cityCode: '',
- areaCode: '',
- outChanNo: '',
- },
+import { mapState } from "vuex";
+export default {
+ name: "stores-add",
+ data() {
+ return {
+ isShowArea: false,
+ Btn: false,
+ form: {
+ areaText: "", //地区文字展示
+ storeName: "", //门店名称
+ dtlAddr: "", //详细地址
+ priName: "", //负责人姓名
+ priEmail: "", //联系邮箱
+ priMblNo: "", //负责人手机
+ priIdNo: "", //身份证号
+ provCode: "",
+ cityCode: "",
+ areaCode: "",
+ outChanNo: "",
+ },
- rule:[
- {key:"storeName",message:"请输入门店名称",type:"isEmpty"},
- {key:"areaText",message:"请选择地址",type:"isEmpty"},
- {key:"dtlAddr",message:"请输入详细地址",type:"isEmpty"},
- {key:"priName",message:"请输入负责人姓名",type:"isEmpty"},
- {key:"priName",message:"请输入正确的负责人姓名",rule:/^[\u4e00-\u9fa50-9a-zA-Z]{1,6}$/},
- {key:"priMblNo",message:"请输入负责人手机号",type:"isEmpty"},
- {key:"priMblNo",message:"请输入正确的手机号",type:"isTel"},
- {key:"priIdNo",message:"请输入负责人身份证号",type:"isEmpty"},
- {key:"priIdNo",message:"请输入正确的身份证号",type:"checkIDCard"},
- {key:"priEmail",message:"请输入联系邮箱",type:"isEmpty"},
- {key:"priEmail",message:"请输入正确的联系邮箱",type:"isEmail"},
- ]
-
+ rule: [{ key: "storeName", message: "请输入门店名称", type: "isEmpty" }, { key: "areaText", message: "请选择地址", type: "isEmpty" }, { key: "dtlAddr", message: "请输入详细地址", type: "isEmpty" }, { key: "priName", message: "请输入负责人姓名", type: "isEmpty" }, { key: "priName", message: "请输入正确的负责人姓名", rule: /^[\u4e00-\u9fa50-9a-zA-Z]{1,6}$/ }, { key: "priMblNo", message: "请输入负责人手机号", type: "isEmpty" }, { key: "priMblNo", message: "请输入正确的手机号", type: "isTel" }, { key: "priIdNo", message: "请输入负责人身份证号", type: "isEmpty" }, { key: "priIdNo", message: "请输入正确的身份证号", type: "checkIDCard" }, { key: "priEmail", message: "请输入联系邮箱", type: "isEmpty" }, { key: "priEmail", message: "请输入正确的联系邮箱", type: "isEmail" }],
+ };
+ },
+ computed: {
+ ...mapState(["areaList"]),
+ },
+ created() {
+ this.merId = this.$route.query.merId;
+ },
+ methods: {
+ // 验证form参数
+ validatorForm() {
+ let v = this.$tool;
+ if (v.checkValEmpty(this.form.outChanNo)) {
+ v.toast("请输入渠道编码");
+ return false;
}
+ return this.$validator(this.form, this.rule).check((item) => {
+ this.$notify(item.message);
+ });
},
- computed:{
- ...mapState(['areaList'])
+
+ //关闭地区弹窗
+ closeAreaModal() {
+ this.isShowArea = false;
+ this.$refs.Area.reset();
},
- created() {
- this.merId = this.$route.query.merId;
+
+ //保存 地区选择
+ setAreaValue(arr) {
+ this.form.areaText = arr[0].name + "-" + arr[1].name + "-" + arr[2].name;
+ this.form.provCode = arr[0].code;
+ this.form.cityCode = arr[1].code;
+ this.form.areaCode = arr[2].code;
+ this.form.provName = arr[0].name;
+ this.form.cityName = arr[1].name;
+ this.form.areaName = arr[2].name;
+ this.isShowArea = false;
+ this.$refs.Area.reset();
},
- methods:{
- // 验证form参数
- validatorForm(){
- let v = this.$tool;
- if(v.checkValEmpty(this.form.outChanNo)){
- v.toast('请输入渠道编码');
- return false;
- }
- return this.$validator(this.form,this.rule).check(item=>{
- this.$notify(item.message)
- })
- },
- //关闭地区弹窗
- closeAreaModal(){
- this.isShowArea = false;
- this.$refs.Area.reset()
- },
-
- //保存 地区选择
- setAreaValue(arr){
- this.form.areaText = arr[0].name + '-' +arr[1].name +'-'+ arr[2].name;
- this.form.provCode= arr[0].code;
- this.form.cityCode= arr[1].code;
- this.form.areaCode= arr[2].code;
- this.form.provName= arr[0].name;
- this.form.cityName= arr[1].name;
- this.form.areaName= arr[2].name;
- this.isShowArea = false;
- this.$refs.Area.reset()
- },
-
-
- // 新增门店
- addStore(){
- if(!this.validatorForm()) return
- if(this.Btn)return
- let list = {
- storeName: this.form.storeName,
- addr:{
- province:{
- code:this.form.provCode,
- name:this.form.provName
- },
- city:{
- code:this.form.cityCode,
- name:this.form.cityName
- },
- area:{
- code:this.form.areaCode,
- name:this.form.areaName
- },
- dtlAddr:this.form.dtlAddr
+ // 新增门店
+ addStore() {
+ if (!this.validatorForm()) return;
+ if (this.Btn) return;
+ let list = {
+ storeName: this.form.storeName,
+ addr: {
+ province: {
+ code: this.form.provCode,
+ name: this.form.provName,
},
- priName: this.form.priName,
- priMblNo: this.form.priMblNo,
- priEmail: this.form.priEmail,
- priIdNo: this.form.priIdNo,
- outChanNo: this.form.outChanNo,
- };
- if(this.merId){
- list.merId = this.merId;
- }
- this.$api.storeAdd(list).then(() => {
- this.$notify('新增成功');
- this.Btn = true;
- setTimeout(() => this.$router.go(-1), 1000);
- });
+ city: {
+ code: this.form.cityCode,
+ name: this.form.cityName,
+ },
+ area: {
+ code: this.form.areaCode,
+ name: this.form.areaName,
+ },
+ dtlAddr: this.form.dtlAddr,
+ },
+ priName: this.form.priName,
+ priMblNo: this.form.priMblNo,
+ priEmail: this.form.priEmail,
+ priIdNo: this.form.priIdNo,
+ outChanNo: this.form.outChanNo,
+ };
+ if (this.merId) {
+ list.merId = this.merId;
}
-
-
-
-
- }
- }
+ this.$api.storeAdd(list).then(() => {
+ this.$notify("新增成功");
+ this.Btn = true;
+ setTimeout(() => this.$router.go(-1), 1000);
+ });
+ },
+ },
+};
</script>
<style scoped lang="less">
-.stores-add-box{
+.stores-add-box {
background-color: @c-bg-f5;
padding-top: 44px;
.tip {
@@ -176,7 +154,6 @@
color: @c-text-999;
}
}
-
.cell-group {
margin: 10px 8px 0;
@@ -190,13 +167,10 @@
border-radius: 22px;
background-color: @c-bg-default;
color: @c-text-fff;
-
}
.footer {
margin-top: 60px;
padding-bottom: 30px;
}
-
-
</style>
--
Gitblit v1.8.0