提交 10091220 编写于 作者: yi.li's avatar yi.li

新建店铺逻辑操作

上级 5d2f6e8c
...@@ -63,6 +63,7 @@ const createLive = r => require.ensure([], () => r(require('../views/yqrange/cre ...@@ -63,6 +63,7 @@ const createLive = r => require.ensure([], () => r(require('../views/yqrange/cre
const shopList = r => require.ensure([], () => r(require('../views/shop/shop-list.vue')), 'shop-list') const shopList = r => require.ensure([], () => r(require('../views/shop/shop-list.vue')), 'shop-list')
const createShop = r => require.ensure([], () => r(require('../views/shop/create-shop.vue')), 'create-shop') const createShop = r => require.ensure([], () => r(require('../views/shop/create-shop.vue')), 'create-shop')
const orderManage = r => require.ensure([], () => r(require('../views/shop/order-manage.vue')), 'order-manage')
export default [{ export default [{
...@@ -266,6 +267,10 @@ export default [{ ...@@ -266,6 +267,10 @@ export default [{
path: '/create-shop', path: '/create-shop',
component: createShop, component: createShop,
}, },
{
path: '/order-manage',
component: orderManage,
},
// { // {
// path: '/followup', // path: '/followup',
// name: 'followUp', // name: 'followUp',
......
import fetch from '../fetch';
import { getBaseUrl } from '@/utils/index'
let headers = {
'Content-Type': 'application/json;charset=UTF-8',
token: localStorage.getItem('storageToken'),
};
export const saveStore = (params) => {
return fetch({
headers,
url: getBaseUrl(`mall/store/upsert`),
method: 'post',
data: params,
description: '新建编辑店铺',
})
};
export const queryStoreInfo = (storeId) => {
return fetch({
headers,
url: getBaseUrl(`mall/store/query?storeId=${storeId}`),
method: 'get',
// params: params,
description: '查询单个店铺信息',
})
};
\ No newline at end of file
...@@ -21,23 +21,23 @@ ...@@ -21,23 +21,23 @@
<div class="basic-item-icon"> <div class="basic-item-icon">
<el-form-item label="店铺LOGO" class="required-label"> <el-form-item label="店铺LOGO" class="required-label">
<el-upload <el-upload
v-model="formData.headUrl" v-model="formData.storeLogo"
class="bg-uploader" class="bg-uploader"
action="#" action="#"
:show-file-list="false" :show-file-list="false"
:before-upload="beforeUploadPic1" :before-upload="beforeUploadPic1"
> >
<img <img
v-if="formData.headUrl" v-if="formData.storeLogo"
:src="formData.headUrl" :src="formData.storeLogo"
@mouseover.stop="imgMouseOver1=true" @mouseover.stop="imgMouseOver1=true"
class="bg-img" class="bg-img"
/> />
<img v-if="!formData.headUrl" class="bg-img" src="../../assets/image/small.png" /> <img v-if="!formData.storeLogo" class="bg-img" src="../../assets/image/small.png" />
<div <div
class="img-delete" class="img-delete"
v-show="imgMouseOver1" v-show="imgMouseOver1"
@click.stop="deleteImg(1)" @click.stop="deleteImg('storeLogo')"
@mouseout.stop="imgMouseOver1=false" @mouseout.stop="imgMouseOver1=false"
> >
<i class="el-icon-delete"></i> <i class="el-icon-delete"></i>
...@@ -51,35 +51,34 @@ ...@@ -51,35 +51,34 @@
</el-form-item> </el-form-item>
<p class="upload-message" v-if="uploadImgMessage1">请上传店铺logo</p> <p class="upload-message" v-if="uploadImgMessage1">请上传店铺logo</p>
</div> </div>
<el-form-item label="店铺名称" prop="name"> <el-form-item label="店铺名称" prop="storeName">
<el-col :span="13"> <el-col :span="10">
<el-input <el-input
size="small" size="small"
v-model="formData.name" v-model="formData.storeName"
placeholder="请输入店铺名称" placeholder="请输入店铺名称"
style="width:70%;" style="width:85%;"
></el-input> ></el-input>
<span class="word-num">{{(formData.name).replace(/\s+/g,"").length}}/14</span> <span class="word-num">{{(formData.storeName).replace(/\s+/g,"").length}}/14</span>
</el-col> </el-col>
</el-form-item> </el-form-item>
<el-form-item label="店铺简介" prop="storeDescription">
<el-form-item label="店铺简介" prop="introduce"> <el-col :span="10">
<el-col :span="13">
<el-input <el-input
type="textarea" type="textarea"
rows="2" rows="2"
maxlength="40" maxlength="40"
size="small" size="small"
v-model="formData.introduce" v-model="formData.storeDescription"
placeholder="请输入店铺简介" placeholder="请输入店铺简介"
style="width:70%;" style="width:85%;"
></el-input> ></el-input>
<span class="word-num">{{(formData.introduce).replace(/\s+/g,"").length}}/40</span> <span class="word-num">{{(formData.storeDescription).replace(/\s+/g,"").length}}/40</span>
</el-col> </el-col>
</el-form-item> </el-form-item>
<el-form-item label="店铺类型" prop="dynamicFlag"> <el-form-item label="店铺类型" prop="storeType">
<el-select <el-select
v-model="formData.dynamicFlag" v-model="formData.storeType"
placeholder="请选择店铺类型" placeholder="请选择店铺类型"
size="small" size="small"
clearable clearable
...@@ -92,9 +91,10 @@ ...@@ -92,9 +91,10 @@
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<div v-if="formData.dynamicFlag == '1'"> <div v-if="formData.storeType == '1'">
<el-row>
<el-col :span="10"> <el-col :span="10">
<el-form-item label="入驻企业名称"> <el-form-item label="入驻企业名称" class="required-label">
<el-input <el-input
type="text" type="text"
maxlength="40" maxlength="40"
...@@ -106,25 +106,27 @@ ...@@ -106,25 +106,27 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
<el-col :span="10" :offset="1"> <el-col :span="10" :offset="1">
<el-form-item label="联系手机号" label-width="90px"> <el-form-item label="联系手机号" label-width="95px" class="required-label">
<el-input <el-input
type="text" type="text"
size="small" size="small"
maxlength="11"
v-model="formData.phoneNum" v-model="formData.phoneNum"
placeholder="请输入联系电话" placeholder="请输入联系电话"
style="width:85%;" style="width:85%;"
></el-input> ></el-input>
</el-form-item> </el-form-item>
</el-col> </el-col>
<div class="main-content"> </el-row>
<div class="main-content" v-for="(item, index) in formData.adminList" :key="index">
<el-row> <el-row>
<el-col :span="10"> <el-col :span="10">
<el-form-item label="管理员姓名"> <el-form-item label="管理员姓名" class="required-label">
<el-input <el-input
type="text" type="text"
maxlength="40" maxlength="40"
size="small" size="small"
v-model="formData.compainName" v-model="item.adminName"
placeholder="请输入管理员姓名" placeholder="请输入管理员姓名"
style="width:85%;" style="width:85%;"
></el-input> ></el-input>
...@@ -134,11 +136,12 @@ ...@@ -134,11 +136,12 @@
<img style="vertical-align: middle" src="../../assets/image/lianjie_icon.png" /> <img style="vertical-align: middle" src="../../assets/image/lianjie_icon.png" />
</el-col> </el-col>
<el-col :span="10"> <el-col :span="10">
<el-form-item label="手机号" label-width="90px"> <el-form-item label="手机号" label-width="95px" class="required-label">
<el-input <el-input
type="text" type="text"
size="small" size="small"
v-model="formData.phoneNum" maxlength="11"
v-model="item.adminMobile"
placeholder="请输入管理员手机号" placeholder="请输入管理员手机号"
style="width:85%;" style="width:85%;"
></el-input> ></el-input>
...@@ -146,10 +149,13 @@ ...@@ -146,10 +149,13 @@
</el-col> </el-col>
<el-col :span="2" class="span-mt-10"> <el-col :span="2" class="span-mt-10">
<img <img
v-if="index != 4"
@click="addItem(index)"
class="edit-img" class="edit-img"
src="../../assets/image/plus.png" src="../../assets/image/plus.png"
/> />
<img <img
@click="deleteItem(index)"
class="edit-img" class="edit-img"
src="../../assets/image/trash.png" src="../../assets/image/trash.png"
/> />
...@@ -157,8 +163,223 @@ ...@@ -157,8 +163,223 @@
</el-row> </el-row>
</div> </div>
<el-form-item label="营业证明"> <el-form-item label="营业证明">
<p class="p-tips">若填写的联系人注册不是法定代表人,请上传委托书<br/>仅支持jpg、png图片文件,且文件小于3M<br/>上传的证件图片内,必须是加盖过红色公章和法人章,否则视为无效</p> <p class="p-tips">若填写的联系人注册不是法定代表人,请上传委托书<br/>
仅支持jpg、png图片文件,且文件小于3M<br/>
上传的证件图片内,必须是加盖过红色公章和法人章,否则视为无效</p>
<div style="display: flex">
<div class="flex-upload">
<el-upload
v-model="formData.imgUrlP1"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadProve1"
>
<img
v-if="formData.imgUrlP1"
:src="formData.imgUrlP1"
@mouseover.stop="imgMouseOverP1=true"
class="bg-img"
/>
<img v-if="!formData.imgUrlP1" class="bg-img" src="../../assets/image/small.png" />
<div
class="img-delete add-left-18"
v-show="imgMouseOverP1"
@click.stop="deleteImg('imgUrlP1')"
@mouseout.stop="imgMouseOverP1=false"
>
<i class="el-icon-delete"></i>
</div>
</el-upload>
<p class="tips">营业执照</p>
</div>
<div class="flex-upload">
<el-upload
v-model="formData.imgUrlP2"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadProve2"
>
<img
v-if="formData.imgUrlP2"
:src="formData.imgUrlP2"
@mouseover.stop="imgMouseOverP2=true"
class="bg-img"
/>
<img v-if="!formData.imgUrlP2" class="bg-img" src="../../assets/image/small.png" />
<div
class="img-delete add-left-18"
v-show="imgMouseOverP2"
@click.stop="deleteImg('imgUrlP2')"
@mouseout.stop="imgMouseOverP2=false"
>
<i class="el-icon-delete"></i>
</div>
</el-upload><p class="tips">药品经营许可证</p>
</div>
<div class="flex-upload">
<el-upload
v-model="formData.imgUrlP3"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadProve3"
>
<img
v-if="formData.imgUrlP3"
:src="formData.imgUrlP3"
@mouseover.stop="imgMouseOverP3=true"
class="bg-img"
/>
<img v-if="!formData.imgUrlP3" class="bg-img" src="../../assets/image/small.png" />
<div
class="img-delete add-left-18"
v-show="imgMouseOverP3"
@click.stop="deleteImg('imgUrlP3')"
@mouseout.stop="imgMouseOverP3=false"
>
<i class="el-icon-delete"></i>
</div>
</el-upload><p class="tips">委托书</p>
</div>
</div>
</el-form-item>
</div>
<div v-if="formData.storeType == '2'">
<el-col :span="10">
<el-form-item label="医生姓名" class="required-label">
<el-input
type="text"
maxlength="40"
size="small"
v-model="formData.docName"
placeholder="请输入医生姓名"
style="width:85%;"
></el-input>
</el-form-item> </el-form-item>
</el-col>
<el-col :span="10" :offset="1">
<el-form-item label="联系手机号" label-width="95px" class="required-label">
<el-input
type="text"
size="small"
v-model="formData.docPhone"
placeholder="请输入联系电话"
style="width:85%;"
></el-input>
</el-form-item>
</el-col>
</div>
<div v-if="formData.storeType == '3'">
<el-col :span="10">
<el-form-item label="入驻药店名称" class="required-label">
<el-input
type="text"
maxlength="40"
size="small"
v-model="formData.drugstoreName"
placeholder="请输入入驻药店名称"
style="width:85%;"
></el-input>
</el-form-item>
</el-col>
<el-col :span="10" :offset="1">
<el-form-item label="联系电话" label-width="95px" class="required-label">
<el-input
type="text"
size="small"
v-model="formData.drugstorePhone"
placeholder="请输入联系电话"
style="width:85%;"
></el-input>
</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="营业证明">
<p class="p-tips">若填写的联系人注册不是法定代表人,请上传委托书<br/>
仅支持jpg、png图片文件,且文件小于3M<br/>
上传的证件图片内,必须是加盖过红色公章和法人章,否则视为无效</p>
<div style="display: flex">
<div class="flex-upload">
<el-upload
v-model="formData.imgUrlC1"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadC1"
>
<img
v-if="formData.imgUrlC1"
:src="formData.imgUrlC1"
@mouseover.stop="imgMouseOverC1=true"
class="bg-img"
/>
<img v-if="!formData.imgUrlC1" class="bg-img" src="../../assets/image/small.png" />
<div
class="img-delete add-left-18"
v-show="imgMouseOverC1"
@click.stop="deleteImg('imgUrlC1')"
@mouseout.stop="imgMouseOverC1=false"
>
<i class="el-icon-delete"></i>
</div>
</el-upload>
<p class="tips">营业执照</p>
</div>
<div class="flex-upload">
<el-upload
v-model="formData.imgUrlC2"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadC2"
>
<img
v-if="formData.imgUrlC2"
:src="formData.imgUrlC2"
@mouseover.stop="imgMouseOverC2=true"
class="bg-img"
/>
<img v-if="!formData.imgUrlC2" class="bg-img" src="../../assets/image/small.png" />
<div
class="img-delete add-left-18"
v-show="imgMouseOverC2"
@click.stop="deleteImg('imgUrlC2')"
@mouseout.stop="imgMouseOverC2=false"
>
<i class="el-icon-delete"></i>
</div>
</el-upload><p class="tips">药品经营许可证</p>
</div>
<div class="flex-upload">
<el-upload
v-model="formData.imgUrlC3"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadC3"
>
<img
v-if="formData.imgUrlC3"
:src="formData.imgUrlC3"
@mouseover.stop="imgMouseOverC3=true"
class="bg-img"
/>
<img v-if="!formData.imgUrlC3" class="bg-img" src="../../assets/image/small.png" />
<div
class="img-delete add-left-18"
v-show="imgMouseOverC3"
@click.stop="deleteImg('imgUrlC3')"
@mouseout.stop="imgMouseOverC3=false"
>
<i class="el-icon-delete"></i>
</div>
</el-upload><p class="tips">委托书</p>
</div>
</div>
</el-form-item>
</el-col>
</div> </div>
</el-form> </el-form>
<el-dialog <el-dialog
...@@ -187,6 +408,7 @@ ...@@ -187,6 +408,7 @@
import { openLoading, closeLoading } from "../../utils/utils"; import { openLoading, closeLoading } from "../../utils/utils";
import { doUpload, getFilePath } from "../../utils/qiniu-util"; import { doUpload, getFilePath } from "../../utils/qiniu-util";
import Cropper from '@/components/common/cropper.vue' import Cropper from '@/components/common/cropper.vue'
import { saveStore, queryStoreInfo } from '@/utils/shop';
export default { export default {
components: { components: {
BreadCrumb, BreadCrumb,
...@@ -195,7 +417,6 @@ ...@@ -195,7 +417,6 @@
data(){ data(){
let checkProjectStr = (rule, value, callback) => { let checkProjectStr = (rule, value, callback) => {
if (value.indexOf("\\") != -1) { if (value.indexOf("\\") != -1) {
//存在
callback(new Error("请勿输入字符“ \\ ")); callback(new Error("请勿输入字符“ \\ "));
} else if (value.indexOf(".") != -1) { } else if (value.indexOf(".") != -1) {
callback(new Error("请勿输入字符“ . ")); callback(new Error("请勿输入字符“ . "));
...@@ -205,7 +426,8 @@ ...@@ -205,7 +426,8 @@
}; };
return{ return{
curmbFirst: '云鹊店铺', curmbFirst: '云鹊店铺',
typeList: [{ typeList: [
{
label: '供货商', label: '供货商',
value: '1', value: '1',
}, { }, {
...@@ -214,14 +436,35 @@ ...@@ -214,14 +436,35 @@
}, { }, {
label: '小药房', label: '小药房',
value: '3', value: '3',
}], }
],
formData: { formData: {
headUrl: '', storeId: null,
name: '', userId: null,
introduce: '', storeLogo: '',//店铺logo
dynamicFlag: '', storeName: '',
compainName: '', storeDescription: '',
phoneNum: '', storeType: '',
storeOwner: '',
storePhone: '',
imageList: [],
adminList: [{
adminName: '',
adminMobile: '',
id: null,
}],//供货商-管理员信息
compainName: '',//供货商-入驻企业名称
phoneNum: '',//供货商-联系电话
imgUrlP1: '',//证明图1
imgUrlP2: '',//证明图2
imgUrlP3: '',//证明图3
docName: '',//医生小店-医生姓名
docPhone: '',//医生小店-联系电话
drugstoreName: '',//小药房-药店名称
drugstorePhone: '',//小药房-联系电话
imgUrlC1: '',//证明图1
imgUrlC2: '',//证明图2
imgUrlC3: '',//证明图3
}, },
showCropper: false, showCropper: false,
currentOption: { currentOption: {
...@@ -236,14 +479,15 @@ ...@@ -236,14 +479,15 @@
cropBoxResizable: true, cropBoxResizable: true,
minCropBoxWidth: 100, minCropBoxWidth: 100,
minCropBoxHeight: 100, minCropBoxHeight: 100,
aspectRatio: 16/9 aspectRatio: 16/9,
currentPic: '',
}, },
slide2: { slide2: {
oriUrl: '', // 原图 oriUrl: '', // 原图
}, },
rules: { rules: {
name: [ storeName: [
{ required: true, message: "请输入圈子名称", trigger: "blur" }, { required: true, message: "请输入店铺名称", trigger: "blur" },
{ {
min: 2, min: 2,
max: 14, max: 14,
...@@ -252,8 +496,8 @@ ...@@ -252,8 +496,8 @@
}, },
{ validator: checkProjectStr, trigger: "blur" } { validator: checkProjectStr, trigger: "blur" }
], ],
introduce: [ storeDescription: [
{ required: true, message: "请输入圈子介绍", trigger: "blur" }, { required: false, message: "请输入店铺简介", trigger: "blur" },
{ {
min: 2, min: 2,
max: 40, max: 40,
...@@ -262,38 +506,245 @@ ...@@ -262,38 +506,245 @@
}, },
{ validator: checkProjectStr, trigger: "blur" } { validator: checkProjectStr, trigger: "blur" }
], ],
headUrl: [ storeType: [
{ required: true, message: "请选择圈子头像", trigger: "blur" } { required: true, message: "请选择店铺类型", trigger: "blur" },
],
dynamicFlag: [
{ required: true, message: "请选择内容发布权限", trigger: "blur" },
] ]
}, },
imgMouseOver1: false, imgMouseOver1: false,
uploadImgMessage1: false,//未上传图片,校验提示语 uploadImgMessage1: false,//未上传图片,校验提示语
imgMouseOverP1: false,
imgMouseOverP2: false,
imgMouseOverP3: false,
imgMouseOverC1: false,
imgMouseOverC2: false,
imgMouseOverC3: false,
addItemFlag: true,
enterType: 1,
} }
}, },
watch: {
'formData.adminList': function(val) {
val.map((item,index) => {
// item.flag = false;
// if (val.length == index) {
// item.flag = true;
// }
})
},
},
created() { created() {
vm = this; vm = this;
this.enterType = this.$route.query.enterType;
this.formData.storeId = this.$route.query.storeId || null;
if (this.formData.storeId) {//回显
this.initInfo();
}
}, },
methods: { methods: {
complete() {}, initInfo() {
queryStoreInfo(this.formData.storeId).then(res => {
if (res.code == '000000') {
}else {
this.$message.error(res.message);
}
})
},
complete() {
let flag = this.submitForm();
if (flag) {
let para = {
storeId: this.formData.storeId,
userId: this.formData.userId,
storeLogo: this.formData.storeLogo,//店铺logo
storeName: this.formData.storeName,
storeDescription: this.formData.storeDescription,
storeType: this.formData.storeType,
storeOwner:this.formData.storeOwner,
storePhone: this.formData.storePhone,
imageList: this.formData.imageList,
adminList:this.formData.adminList,
}
console.log('提交的数据',this.formData)
saveStore({req: para}).then(res => {
console.log('保存数据',res);
if (res.code == '000000') {
this.$message.success("保存成功");
this.$router.push({
path: '/shop-list'
})
}
})
}
},
checkPhone(val) {
if(!(/^1[3456789]\d{9}$/.test(val))) {
return false;
} else {
return true;
}
},
resetType(type){
this.formData.imageList = [];
if (type == 1) {
this.formData.storeOwner = this.formData.compainName;
this.formData.storePhone = this.formData.phoneNum;
if (this.formData.imgUrlP1) {
this.formData.imageList.push({
id: null,
imageSort: 1,
imageType: 2,
imageUrl: this.formData.imgUrlP1,
storeId: null,
})
}
if (this.formData.imgUrlP2) {
this.formData.imageList.push({
id: null,
imageSort: 2,
imageType: 2,
imageUrl: this.formData.imgUrlP2,
storeId: null,
})
}
if (this.formData.imgUrlP3) {
this.formData.imageList.push({
id: null,
imageSort: 3,
imageType: 2,
imageUrl: this.formData.imgUrlP3,
storeId: null,
})
}
}else if (type == 2) {
this.formData.storeOwner = this.formData.docName;
this.formData.storePhone = this.formData.docPhone;
this.formData.adminList = [];
}else if (type == 3) {
this.formData.storeOwner = this.formData.drugstoreName;
this.formData.storePhone = this.formData.drugstorePhone;
this.formData.adminList = [];
if (this.formData.imgUrlC1) {
this.formData.imageList.push({
id: null,
imageSort: 1,
imageType: 2,
imageUrl: this.formData.imgUrlC1,
storeId: null,
})
}
if (this.formData.imgUrlC2) {
this.formData.imageList.push({
id: null,
imageSort: 2,
imageType: 2,
imageUrl: this.formData.imgUrlC2,
storeId: null,
})
}
if (this.formData.imgUrlC3) {
this.formData.imageList.push({
id: null,
imageSort: 3,
imageType: 2,
imageUrl: this.formData.imgUrlC3,
storeId: null,
})
}
}
},
setTypeForData() {
let flag = false;
if (this.formData.storeType == '1') {
if (!this.formData.compainName) {
this.$message.warning('请输入入驻企业名称');
return;
}
if (!this.formData.phoneNum) {
this.$message.warning('请输入联系电话');
return;
}else {
if(!this.checkPhone(this.formData.phoneNum)) {
this.$message.warning('请输入正确的联系电话');
return;
}
}
if (this.formData.adminList && this.formData.adminList.length) {
for(let i=0; i<this.formData.adminList.length; i++) {
if (!this.formData.adminList[i].adminName) {
this.$message.warning(`请输入第${i+1}个管理员的姓名`);
return;
}
if(!this.formData.adminList[i].adminMobile) {
this.$message.warning(`请输入第${i+1}个管理员的联系电话`);
return;
}else {
if(!this.checkPhone(this.formData.adminList[i].adminMobile)) {
this.$message.warning(`请输入第${i+1}个管理员的正确联系电话`);
return;
}
}
}
}
flag = true;
}
if (this.formData.storeType == '2') {
if (!this.formData.docName) {
this.$message.warning('请输入医生姓名');
return;
}
if (!this.formData.docPhone) {
this.$message.warning('请输入联系电话');
return;
}else {
if(!this.checkPhone(this.formData.docPhone)) {
this.$message.warning('请输入正确的联系电话');
return;
}
}
flag = true;
}
if (this.formData.storeType == '3') {
if (!this.formData.drugstoreName) {
this.$message.warning('请输入入驻药店名称');
return;
}
if (!this.formData.drugstorePhone) {
this.$message.warning('请输入联系电话');
return;
}else {
if(!this.checkPhone(this.formData.drugstorePhone)) {
this.$message.warning('请输入正确的联系电话');
return;
}
}
flag = true;
}
return flag;
},
//表单校验 //表单校验
submitForm() { submitForm() {
let formName = "formData"; let formName = "formData";
let flag = null; let submitFlag = false;
if (!this.formData.headUrl){ if (!this.formData.storeLogo){
this.uploadImgMessage1 = true; this.uploadImgMessage1 = true;
}else {
this.uploadImgMessage1 = false;
} }
this.$refs[formName].validate(valid => { this.$refs[formName].validate(valid => {
if (valid&&this.formData.headUrl!="") { if (valid) {
flag = true; if (!this.setTypeForData()) {
return;
}
this.resetType(this.formData.storeType);
submitFlag = true;
} else { } else {
submitFlag = false;
console.log("error submit!!"); console.log("error submit!!");
flag = false;
} }
}); });
this.$emit('returnIsNext', flag); return submitFlag;
}, },
//上传店铺logo //上传店铺logo
beforeUploadPic1(file) { beforeUploadPic1(file) {
...@@ -301,17 +752,58 @@ ...@@ -301,17 +752,58 @@
this.currentOption.cropBoxResizable = true; this.currentOption.cropBoxResizable = true;
this.currentOption.minCropBoxWidth = 160; this.currentOption.minCropBoxWidth = 160;
this.currentOption.minCropBoxHeight = 160; this.currentOption.minCropBoxHeight = 160;
this.currentOption.currentPic = 'storeLogo';
let fileLimit = { let fileLimit = {
width: 160, width: 160,
height: 160, height: 160,
size: 0.5, size: 0.5,
sizeText: "500K", sizeText: "500K",
key: "headUrl", key: "storeLogo",
more: "imgUrl1More", more: "imgUrl1More",
show: "uploadImgMessage1" show: "uploadImgMessage1"
}; };
this.beforeUpload(file, fileLimit); this.beforeUpload(file, fileLimit);
}, },
setOption(type) {
this.currentOption.aspectRatio = 1/1;
this.currentOption.cropBoxResizable = true;
this.currentOption.minCropBoxWidth = 160;
this.currentOption.minCropBoxHeight = 160;
this.currentOption.currentPic = type;
let fileLimit = {
width: 160,
height: 160,
size: 0.5,
sizeText: "500K",
key: type,
more: "imgUrlP1More",
};
return fileLimit;
},
beforeUploadProve1(file) {
let fileLimit = this.setOption('imgUrlP1');
this.beforeUpload(file, fileLimit);
},
beforeUploadProve2(file) {
let fileLimit = this.setOption('imgUrlP2');
this.beforeUpload(file, fileLimit);
},
beforeUploadProve3(file) {
let fileLimit = this.setOption('imgUrlP3');
this.beforeUpload(file, fileLimit);
},
beforeUploadC1(file) {
let fileLimit = this.setOption('imgUrlC1');
this.beforeUpload(file, fileLimit);
},
beforeUploadC2(file) {
let fileLimit = this.setOption('imgUrlC2');
this.beforeUpload(file, fileLimit);
},
beforeUploadC3(file) {
let fileLimit = this.setOption('imgUrlC3');
this.beforeUpload(file, fileLimit);
},
//上传图片 //上传图片
beforeUpload(file, fileLimit) { beforeUpload(file, fileLimit) {
let vm = this; let vm = this;
...@@ -347,15 +839,12 @@ ...@@ -347,15 +839,12 @@
openLoading(vm); openLoading(vm);
doUpload(vm, file, getFilePath(file, null), "preview4", "progress1", 1).then(function (path) { doUpload(vm, file, getFilePath(file, null), "preview4", "progress1", 1).then(function (path) {
closeLoading(vm); closeLoading(vm);
console.log('上传成功后路径', path);
if (fileLimit.show == "uploadImgMessage1") { if (fileLimit.show == "uploadImgMessage1") {
vm.uploadImgMessage1 = false; vm.uploadImgMessage1 = false;
} else if (fileLimit.show == "uploadImgMessage2") {
vm.uploadImgMessage2 = false;
} }
vm.formData[fileLimit.key] = path.fullPath; vm.formData[fileLimit.key] = path.fullPath;
vm.formData[fileLimit.more] = { vm.formData[fileLimit.more] = {
attachmentName: path.name, attachmentName: path.storeName,
attachmentExt: path.ext, attachmentExt: path.ext,
attachmentSize: path.size attachmentSize: path.size
}; };
...@@ -365,13 +854,36 @@ ...@@ -365,13 +854,36 @@
}; };
}; };
return isJPG && isLt2M; return isJPG && isLt2M;
},
getKey(type) {
}, },
//删除图片 //删除图片
deleteImg(type) { deleteImg(type) {
if (type == 1) { vm.formData[type] = "";
vm.formData.headUrl = ""; const testMouse = new Map()
vm.imgMouseOver1 = false; .set('storeLogo','imgMouseOver1')
.set('imgUrlP1','imgMouseOverP1')
.set('imgUrlP2','imgMouseOverP2')
.set('imgUrlP3','imgMouseOverP3')
.set('imgUrlC1','imgMouseOverC1')
.set('imgUrlC2','imgMouseOverC2')
.set('imgUrlC3','imgMouseOverC3');
function matchType(type) {
return testMouse.get(type) || ''
} }
let mark = matchType(type);
vm[mark] = false;
/* if (type == 'storeLogo') {
vm.imgMouseOver1 = false;
}else if (type == 'imgUrlP1') {
vm.imgMouseOverP1 = false;
}else if (type == 'imgUrlP2') {
vm.imgMouseOverP2 = false;
}else if (type == 'imgUrlP3') {
vm.imgMouseOverP3 = false;
}*/
}, },
// 获取裁剪的图片数据 // 获取裁剪的图片数据
getCropImg(argument) { getCropImg(argument) {
...@@ -383,15 +895,32 @@ ...@@ -383,15 +895,32 @@
}, },
// 上传七牛 // 上传七牛
doUploadQiNiu(file){ doUploadQiNiu(file){
doUpload(this,file, getFilePath(file,null), 'preview4', 'uploadProgress1', '').then(function (path) { doUpload(this,file, getFilePath(file,null), 'preview4', 'uploadProgress1', '').then(function (path) {
vm.formData[vm.currentOption.currentPic] = path.fullPath;
vm.formData.headUrl = path.fullPath;
vm.$message.success('上传成功'); vm.$message.success('上传成功');
}); });
}, },
//新增管理员
addItem(index) {
if(this.formData.adminList != null && this.formData.adminList.length >= 5){
this.$message.warning("只可新增5位管理员!");
} else {
let item = {
adminName: '',
adminMobile: '',
};
this.formData.adminList.push(item);
}
},
//删除管理员
deleteItem(index) {
if ((this.formData.adminList.length == 1) && (index == 0)) {
this.$message.warning("最少需要1位管理员哦!");
return;
}
this.formData.adminList.splice(index, 1);
},
}, },
} }
</script> </script>
...@@ -456,22 +985,7 @@ ...@@ -456,22 +985,7 @@
color: #f56c6c; color: #f56c6c;
} }
.img-delete {
position: absolute;
left: 0px;
top: 0px;
width: 84px;
height: 100px;
background: #000;
opacity: 0.7;
z-index: 999;
i {
color: #fff;
margin-top: 39px;
margin-left: 0px;
}
}
} }
.word-num { .word-num {
...@@ -485,13 +999,41 @@ ...@@ -485,13 +999,41 @@
width: 20px; width: 20px;
} }
.flex-upload{
width: 120px;
text-align: center;
.tips{
font-size: 13px;
color: #8C8C8C;
line-height: 24px;
}
}
.bg-uploader { .bg-uploader {
position: relative;
/*margin-right: 20px;*/
.bg-img { .bg-img {
float: left; float: left;
width: 84px; width: 84px;
height: 100px; height: 100px;
} }
.img-delete {
position: absolute;
left: 0px;
top: 0px;
width: 84px;
height: 100px;
background: #000;
opacity: 0.7;
z-index: 999;
&.add-left-18{
left: 18px;
}
i {
color: #fff;
margin-top: 39px;
margin-left: 0px;
}
}
.limit-text { .limit-text {
float: left; float: left;
margin-left: 10px; margin-left: 10px;
...@@ -504,7 +1046,6 @@ ...@@ -504,7 +1046,6 @@
} }
} }
} }
.el-upload__tip { .el-upload__tip {
position: absolute; position: absolute;
top: -6px; top: -6px;
...@@ -520,5 +1061,6 @@ ...@@ -520,5 +1061,6 @@
font-size: 13px; font-size: 13px;
color: #8C8C8C; color: #8C8C8C;
line-height: 26px; line-height: 26px;
margin-bottom: 15px;
} }
</style> </style>
<template>
<div class="order-manage-wrapper">
<bread-crumb :curmbFirst="curmbFirst"></bread-crumb>
<div class="order-manage-content screenSet" id="screenSet">
<div class="header-title">订单管理</div>
<el-form ref="searchForm" :model="searchForm" label-width="80px" label-suffix=":" :inline="true">
<el-row :gutter="30" type="flex" style="margin-top: 10px">
<el-col :span="18">
<el-form-item label="店铺名称">
<el-input v-model="searchForm.name" size="small" placeholder="请输入店铺名称"></el-input>
</el-form-item>
<el-form-item label="店铺ID">
<el-input v-model="searchForm.id" size="small" placeholder="请输入店铺ID"></el-input>
</el-form-item>
<el-form-item label="店铺类型">
<el-select
v-model="searchForm.type"
placeholder="请选择店铺类型"
size="small"
clearable>
<el-option
v-for="(item,index) in typeList"
:key="index"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6" style="text-align: right">
<el-button type="primary" size="small" @click="searchList">查询</el-button>
<el-button type="default" size="small" @click="resetForm" style="margin-left:0;">重置</el-button>
</el-col>
</el-row>
<el-row>
<el-col :span="24" style="text-align: right">
<el-button type="primary" size="small" @click="createShop">新建店铺</el-button>
</el-col>
</el-row>
</el-form>
<el-table :data="tableData" class="item-table" style="width: 100%;margin-top: 10px;">
<el-table-column prop="id" label="店铺ID" min-width="100" align="center"></el-table-column>
<el-table-column prop="name" label="店铺名称" min-width="100" align="center"></el-table-column>
<el-table-column prop="type" label="店铺类型" min-width="100" align="center">
<template slot-scope="scope">
<span>{{ scope.row.type | dynamicFlagStatus }}</span>
</template>
</el-table-column>
<el-table-column prop="status" label="店铺状态" min-width="100" align="center">
<template slot-scope="scope">
<span>{{ scope.row.status | rangeStatus }}</span>
</template>
</el-table-column>
<el-table-column prop="num" label="已上架商品数" min-width="120" align="center"></el-table-column>
<el-table-column prop="createdTime" label="创建时间" min-width="100" align="center">
<template slot-scope="scope">
<span>{{ scope.row.createdTime | liveDateFilter }}</span>
</template>
</el-table-column>
<el-table-column label="操作" min-width="370" align="center">
<template slot-scope="scope">
<div>
<el-button @click="editShop(scope.row)" type="text" size="small">编辑</el-button>
<el-button @click="shopManage(scope.row)" type="text" size="small">店铺管理</el-button>
</div>
</template>
</el-table-column>
</el-table>
<div class="pagination">
<el-pagination
background
@size-change="handleSizeChange"
@current-change="handleNumChange"
:current-page="searchForm.pageNo"
:page-sizes="[10, 30, 50, 100]"
:page-size="searchForm.pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="totalRows"
></el-pagination>
</div>
</div>
</div>
</template>
<script>
// import { openLoading, closeLoading } from "../../utils/utils";
import BreadCrumb from "@/components/breadcrumb.vue";
export default {
components: {
BreadCrumb
},
data(){
return{
curmbFirst: '订单管理',
showAllFlag: false,
showNewFlag: false,
searchForm: {
name: '',
id: '',
type: '',
pageNo: 1,
pageSize: 10,
},
totalRows: 0,
tableData: [
// {
// id: '',
// name: '',
// type: null,
// status: '',
// num: null,
// createdTime: '',
// }
],
typeList: [{
label: '供货商',
value: '1',
}, {
label: '医生小店',
value: '2',
}, {
label: '小药房',
value: '3',
}]
}
},
created() {
},
methods: {
searchList(){
},
resetForm() {
this.searchForm = {
name: '',
id: '',
type: ''
};
this.searchList();
},
//上线
publishRange(row) {
this.$confirm(`确定上线“${row.name}”吗?`, '', {
confirmButtonText: '上线',
cancelButtonText: '取消',
type: 'warning',
customClass: 'range-make-box',
}).then(() => {
// confirm
this.updateStatus(row.id, "30");
}).catch(() => {
// cancel
// this.$message.error("上线失败");
});
},
//下线
unPublishRange(row) {
this.$confirm(`确定下线“${row.name}”吗?`, '', {
confirmButtonText: '下线',
cancelButtonText: '取消',
type: 'warning',
customClass: 'range-make-box',
}).then(() => {
this.updateStatus(row.id, "40");
// confirm
}).catch(() => {
// cancel
});
},
//编辑
editShop(row) {
this.$router.push({
path: `/create-shop?enterType`,
query:{
storeId:row.storeId,
}
})
},
handleSizeChange(val) {
this.searchForm.pageSize = val;
this.searchForm.pageNo = 1;
this.searchList();
},
handleNumChange(val) {
this.searchForm.pageNo = val;
this.searchList();
},
},
}
</script>
<style lang="scss">
.order-manage-wrapper{
.order-manage-content{
background: #fff;
padding: 10px;
.header-title{
padding: 10px 12px;
font-size: 13px;
color: #449284;
border-bottom: 1px solid #efefef;
}
}
.el-button--text{
color: #449284;
font-size: 14px;
&::after{
content: '';
position: relative;
height: 14px;
/*border-right: 1px solid #EBEEF5;*/
border-right: 1px solid #aaaaaa;
padding-right: 10px;
}
&:last-of-type{
&::after{
content: '';
position: relative;
width: 1px;
height: 14px;
border-right: none;
}
}
}
}
</style>
...@@ -263,11 +263,10 @@ ...@@ -263,11 +263,10 @@
editShop(row) { editShop(row) {
let enterType = 2;//1:add 2 edit let enterType = 2;//1:add 2 edit
this.$router.push({ this.$router.push({
path: `/create-range?enterType`, path: `/create-shop?enterType`,
query:{ query:{
id:row.id, storeId:row.storeId,
enterType:enterType, enterType:enterType,
roleType: row.roleId
} }
}) })
}, },
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册