Skip to content

P
pica.cloud.web-education-admin
提交 9bc44852 编写于 作者: chendeli's avatar chendeli
浏览文件
操作

Merge branch 'dev-market-20200813' into release

上级 ab0b5594 314d61c6
隐藏空白字符变更
内嵌 并排
正在显示 包含 5322 行增加 和 78 行删除
src/components/shop/change-info.vue 0 → 100644
浏览文件 @ 9bc44852
<template>
<div class="order-manage-wrapper">
<el-dialog
title="修改买家收货信息"
:visible="changeInfoDialog"
@close="cancelChangeInfo"
width="600px"
center
class="send-set-body">
<el-form ref="changeInfoForm" :model="changeInfoForm" :rules="rules" label-width="90px" label-suffix=":">
<el-form-item label="收货人" prop="receiver">
<el-input type="text" v-model="changeInfoForm.receiver" placeholder="请输入收货人姓名" style="width: 100%"></el-input>
</el-form-item>
<el-form-item label="手机号" prop="receiverMobile">
<el-input type="text" v-model="changeInfoForm.receiverMobile" maxlength="11" placeholder="请输入收货人手机号" style="width: 100%"></el-input>
</el-form-item>
<el-form-item label="所在地区" prop="area">
<el-cascader
size="small"
ref="cascaderRegion"
:options="optionsRegion"
:props="props"
v-model="changeInfoForm.area"
@change="handleChange"
filterable
style="width: 100%"
placeholder="请选择地区"
></el-cascader>
</el-form-item>
<el-form-item label="详细地址" prop="address">
<el-input type="textarea"
v-model="changeInfoForm.address"
rows="5"
placeholder="请输入收货人详细地址"
style="width: 100%;">
</el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button size="small" type="primary" @click="submitChange">完成</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { openLoading, closeLoading } from "@/utils/utils";
import * as operationData from "@/utils/operation";
import { checkMobile } from '@/utils/patients/checkValid'
let vm = null;
export default {
components: {
},
props: {
receiveInfo: {
type: Object,
required: true,
default: () => {}
},
},
data(){
return{
changeInfoDialog: true,
optionsRegion: [],
administrativeValue: '',
changeInfoForm: {
receiver: '',
receiverMobile: '',
area: [],
address: '',
provinceName: '',
cityName: '',
countyName: '',
townName: '',
provinceId: null,
cityId: null,
countyId: null,
townId: null,
},
provinceList: [],
cityList: [],
countyList: [],
townList: [],
region: [],
props: {
value: "id",
label: "name",
children: "children",
lazy: true,
lazyLoad(node, resolve) {
const { level } = node;
console.log("node", node);
if (node.level == 1) {
vm.changeInfoForm.provinceName = node.data.label;
vm.changeInfoForm.provinceId = node.data.value;
let req = {
provinceId: node.data.id
};
vm.GET("basic-data/position/cities", req).then(res => {
let newData = res.data.cityList;
vm.cityList = res.data.cityList;
newData.map(item => {
vm.$set(item, "id", item.cityId);
vm.$set(item, "name", item.cityName);
vm.$set(item, "children", []);
});
// console.log("newData", newData);
resolve(newData);
});
} else if (node.level == 2) {
vm.changeInfoForm.cityName = node.data.label;
vm.changeInfoForm.cityId = node.data.value;
let req = {
cityId: node.data.id
};
vm.GET("basic-data/position/counties", req).then(res => {
let newData = res.data.countyList;
vm.countyList = res.data.countyList;
newData.map(item => {
vm.$set(item, "id", item.countyId);
vm.$set(item, "name", item.countyName);
vm.$set(item, "children", []);
});
// console.log("newData", newData);
resolve(newData);
});
} else if (node.level == 3) {
vm.changeInfoForm.countyName = node.data.label;
vm.changeInfoForm.countyId = node.data.value;
let req = {
countyId: node.data.id
};
vm.GET("basic-data/position/towns", req).then(res => {
let newData = res.data.townList;
vm.townList = res.data.townList;
newData.map(item => {
vm.$set(item, "id", item.townId);
vm.$set(item, "name", item.townName);
vm.$set(item, "leaf", true);
});
// console.log("newData", newData);
resolve(newData);
});
}
}
},
/*props: {
lazy: true,
lazyLoad(node, resolve) {
//第一个参数node为当前点击的节点，第二个resolve为数据加载完成的回调(必须调用)
const { level } = node;
console.log("当前点击的节点node", node);
if (node.level == 1) {
vm.changeInfoForm.provinceName = node.data.label;
vm.changeInfoForm.provinceId = node.data.value;
let req = {
provinceId: node.data.value
};
vm.GET("basic-data/position/cities", req).then(res => {
vm.cityList = res.data.cityList;
let newData = vm.setMoreOption(res.data.cityList, "cities");
resolve(newData);
});
} else if (node.level == 2) {
vm.changeInfoForm.cityName = node.data.label;
vm.changeInfoForm.cityId = node.data.value;
let req = {
cityId: node.data.value
};
vm.GET("basic-data/position/counties", req).then(res => {
vm.countyList = res.data.countyList;
let newData = vm.setMoreOption(res.data.countyList, "counties");
resolve(newData);
});
} else if (node.level == 3) {
vm.changeInfoForm.countyName = node.data.label;
vm.changeInfoForm.countyId = node.data.value;
let req = {
countyId: node.data.value
};
vm.GET("basic-data/position/towns", req).then(res => {
vm.townList = res.data.townList;
let newData = vm.setMoreOption(res.data.townList, "towns");
resolve(newData);
});
}
}
},*/
rules: {
receiver: [
{ required: true, message: '请输入收货人姓名', trigger: "blur"},
],
receiverMobile: [
{ required: true, message: '请输入收货人手机号', trigger: "blur"},
{validator: checkMobile, trigger: 'blur'}
],
area: [
{ required: true, message: '请选择所在地区', trigger: "blur"},
],
address: [
{ required: true, message: '请输入收货人详细地址', trigger: "blur"},
],
},
}
},
created() {
vm = this;
this.initData();
},
methods: {
async initData() {
await this.getRegionOption()
console.log('父级传入的值',this.receiveInfo);
const { receiver, receiverMobile, provinceId, provinceName, cityId, cityName, countyId, countyName, townId, townName, address } = this.receiveInfo;
this.changeInfoForm.receiver = receiver;
this.changeInfoForm.receiverMobile = receiverMobile;
this.changeInfoForm.address = address;
this.changeInfoForm.provinceId = provinceId;
this.changeInfoForm.provinceName = provinceName;
this.changeInfoForm.cityId = cityId;
this.changeInfoForm.cityName = cityName;
this.changeInfoForm.countyId = countyId;
this.changeInfoForm.countyName = countyName;
this.changeInfoForm.townId = townId;
this.changeInfoForm.townName = townName;
//对地区数据做回显处理
if(provinceId) {
this.changeInfoForm.area = [Number(provinceId), Number(cityId), Number(countyId), Number(townId)];
// if(provinceId) {
await this.getCity(provinceId);
// }
if(cityId) {
await this.getCounty(provinceId, cityId);
}
if(countyId) {
await this.getTown(provinceId, cityId, countyId);
}
this.$forceUpdate();
}else {
this.changeInfoForm.area = [];
}
console.log('传入值处理后',this.changeInfoForm)
/*let arrayLike = {
0: provinceId,
1: cityId,
2: countyId,
3: townId,
'length': 4
}
let arr = Array.from(arrayLike)
console.log('初始化后的值',arr);*/
},
handleChange(value) {
let areaId = "000";
for (let i = 0; i < value.length; i++) {
areaId += "_" + value[i];
}
this.administrativeValue = areaId;
console.log('修改后的值',value, this.administrativeValue);
// 000_110_110100000000_110101000000_110101001000
setTimeout(function() {
let region = vm.$refs["cascaderRegion"].inputValue;
vm.region = region.split(" / ");
// console.log("vm.region",vm.region)
},20)
},
//获取地区
async getRegionOption() {
let req = {};
// openLoading(vm);
// vm.GET("basic-data/position/provinces", req).then(res => {
// closeLoading(vm);
// if (res.code == "000000") {
// this.provinceList = res.data.provinceList;
// vm.optionsRegion = operationData.setRegionOption3(
// res.data.provinceList
// );
// console.log('region',vm.optionsRegion)
// }
// });
vm.GET("basic-data/position/provinces", req).then((data) => {
if(data.code == '000000') {
this.provinceList = data.data.provinceList;
this.provinceList.map(item => {
this.$set(item, "id", item.provinceId);
this.$set(item, "name", item.provinceName);
this.$set(item, "children", []);
});
this.optionsRegion = this.provinceList;
// this.$forceUpdate();
}
})
},
async getCity(provinceId) {
await vm.GET("basic-data/position/cities", {provinceId: provinceId}).then((data) => {
if(data.code == '000000') {
this.cityList = data.data.cityList;
this.cityList.map(item => {
this.$set(item, "id", item.cityId);
this.$set(item, "name", item.cityName);
this.$set(item, "children", []);
});
this.optionsRegion.map((item, index) => {
if(item.id == provinceId) {
item.children = this.cityList;
}
})
}
})
},
async getCounty(provinceId, cityId) {
await vm.GET("basic-data/position/counties", {cityId: cityId}).then((data) => {
if(data.code == '000000') {
this.countyList = data.data.countyList;
this.countyList.map(item => {
this.$set(item, "id", item.countyId);
this.$set(item, "name", item.countyName);
this.$set(item, "children", []);
});
this.optionsRegion.map((item, index) => {
if(item.id == provinceId) {
item.children.map((city, idx) => {
if(city.id == cityId) {
city.children = this.countyList;
}
})
}
})
}
})
},
async getTown(provinceId, cityId, countyId) {
await vm.GET("basic-data/position/towns", {countyId: countyId}).then((data) => {
if(data.code == '000000') {
this.townList = data.data.townList;
this.townList.map(item => {
this.$set(item, "id", item.townId);
this.$set(item, "name", item.townName);
this.$set(item, "leaf", true);
});
this.optionsRegion.map((item, index) => {
if(item.id == provinceId) {
item.children.map((city, index2) => {
if(city.id == cityId) {
city.children.map((county, index3) => {
if(county.id == countyId) {
county.children = this.townList;
}
})
}
})
}
})
}
})
},
setMoreOption(data, type) {
let option = [];
for (let i = 0; i < data.length; i++) {
let obj = data[i];
if (type == "cities") {
obj.label = data[i].cityName;
obj.value = data[i].cityId;
} else if (type == "counties") {
obj.label = data[i].countyName;
obj.value = data[i].countyId;
// obj.leaf = true;
} else if (type == "towns") {
obj.label = data[i].townName;
obj.value = data[i].townId;
obj.leaf = true;
}
option.push(obj);
}
return option;
},
cancelChangeInfo() {
this.$emit('closeChangeInfo',{type: 1})
},
setAreaData() {
if(this.changeInfoForm.area.length > 0) {
this.changeInfoForm.provinceId = this.changeInfoForm.area[0];
this.changeInfoForm.cityId = this.changeInfoForm.area[1];
this.changeInfoForm.countyId = this.changeInfoForm.area[2];
this.changeInfoForm.townId = this.changeInfoForm.area[3];
if (vm.region.length) {
this.changeInfoForm.provinceName = vm.region[0];
this.changeInfoForm.cityName = vm.region[1];
this.changeInfoForm.countyName = vm.region[2];
this.changeInfoForm.townName = vm.region[3];
}
}
},
submitChange() {
this.$refs.changeInfoForm.validate((valid) => {
if (valid) {
// this.submit();
this.setAreaData();
// this.changeInfoForm.townId = null;
// this.changeInfoForm.townName = '';
// if (this.changeInfoForm.area.length == 4) {
// this.changeInfoForm.townId = this.changeInfoForm.area[3];
// this.townList.map((item) => {
// if (this.changeInfoForm.townId == item.townId) {
// this.changeInfoForm.townName = item.townName;
// }
// })
// }
console.log('确定值',this.changeInfoForm)
this.$emit('closeChangeInfo',{type: 2, data: this.changeInfoForm})
} else {
return false;
}
})
},
},
}
</script>
<style lang="scss">
.send-set-body{
.address-content{
width: 100%;
background-color: #F0F2F5;
border: 1px solid #E4E7ED;
border-radius: 4px;
padding: 10px 15px;
.address-title{
display: flex;
justify-content: space-between;
align-items: center;
.title{
font-size: 13px;
color: #999999;
}
}
.address-info{
p{
line-height: 26px;
}
}
}
.form-title{
margin-top: 15px;
margin-bottom: 15px;
}
.el-dialog__body{
padding-bottom: 0;
}
}
</style>
src/components/shop/send-set-dialog.vue 0 → 100644
浏览文件 @ 9bc44852
<template>
<div class="order-manage-wrapper" v-if="sendGoodsDialog">
<el-dialog
:title="dialogTitle"
:visible="sendGoodsDialogIn"
@close="cancelSendSet"
width="600px"
center
class="send-set-body">
<div class="address-content">
<div class="address-title">
<span class="title">买家收货信息</span>
<el-button type="text" size="small" @click="changeInfo">修改</el-button>
</div>
<div class="address-info">
<!--<p>{{receiveInfo.receiverAddr}}</p>-->
<p>{{setReceiveInfo.provinceName}}{{setReceiveInfo.cityName}}{{setReceiveInfo.countyName}}{{setReceiveInfo.townName}}{{setReceiveInfo.address}}</p>
<p>{{setReceiveInfo.receiver}} {{setReceiveInfo.receiverMobile}}</p>
</div>
</div>
<div v-if="dialogTitle == '发货设置'">
<p class="form-title">填写物流信息</p>
<el-form ref="sendSetForm" :model="sendSetForm" :rules="rules" label-width="75px" label-suffix=":">
<el-form-item label="快递公司" prop="expressName">
<el-input type="text" v-model="sendSetForm.expressName" placeholder="请输入快递公司"></el-input>
</el-form-item>
<el-form-item label="快递单号" prop="expressNo">
<el-input type="text" v-model="sendSetForm.expressNo" placeholder="请输入快递单号"></el-input>
</el-form-item>
<el-form-item label="备注">
<el-input type="textarea"
v-model="sendSetForm.remark"
rows="5"
placeholder="请输入备注内容"
style="width: 100%;"></el-input>
<span class="word-num" style="float: right">{{(sendSetForm.remark).replace(/\s+/g,"").length}}/400</span>
</el-form-item>
</el-form>
</div>
<div v-if="dialogTitle == '配送设置'">
<p class="form-title">填写配送员信息</p>
<el-form ref="sendSetForm" :model="sendSetForm" :rules="rules" label-width="75px" label-suffix=":">
<el-form-item label="姓名" prop="sender">
<el-input type="text" v-model="sendSetForm.sender" placeholder="请输入配送员姓名"></el-input>
</el-form-item>
<el-form-item label="手机号" prop="senderMobile">
<el-input type="text" maxlength="11" v-model="sendSetForm.senderMobile" placeholder="请输入配送员手机号"></el-input>
</el-form-item>
<el-form-item label="备注">
<el-input type="textarea"
v-model="sendSetForm.remark"
rows="5"
placeholder="请输入备注内容"
style="width: 100%;"></el-input>
<span class="word-num" style="float: right">{{(sendSetForm.remark).replace(/\s+/g,"").length}}/400</span>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<!--<el-button size="small" @click="cancelSendSet">取 消</el-button>-->
<el-button size="small" type="primary" @click="submitSendSet">完成</el-button>
</span>
</el-dialog>
<change-info v-if="showChangeInfo" @closeChangeInfo="closeChangeInfo" :receiveInfo="setReceiveInfo"></change-info>
</div>
</template>
<script>
// import { openLoading, closeLoading } from "../../utils/utils";
import ChangeInfo from "./change-info";
import { checkMobile } from '@/utils/patients/checkValid';
import { updateExpress } from "@/utils/shop";
export default {
components: {
ChangeInfo
},
props: {
sendGoodsDialog: {
type: Boolean,
default: false,
},
dialogTitle: {
type: String,
default: ''
},
sendSetFormData: {
type: Object,
required: true,
default: () => {}
},
},
data(){
return{
sendGoodsDialogIn: true,
sendSetForm: {
expressName: '',
expressNo: '',
remark: '',
sender: '',
senderMobile: '',
},
receiveInfo: {
receiver: '',
receiverMobile: '',
area: [],
address: '',
provinceName: '',
cityName: '',
countyName: '',
townName: '',
provinceId: null,
cityId: null,
countyId: null,
townId: null,
},
setReceiveInfo: {},
showContent: 0,
showChangeInfo: false,
rules: {
expressName: [
{ required: true, message: '请输入快递公司', trigger: "blur"},
],
expressNo: [
{ required: true, message: '请输入快递单号', trigger: "blur"},
],
sender: [
{ required: true, message: '请输入配送员姓名', trigger: "blur"},
],
senderMobile: [
{ required: true, message: '请输入配送员手机号', trigger: "blur"},
{validator: checkMobile, trigger: ['change','blur']}
],
},
}
},
created() {
},
mounted() {
},
watch: {
sendGoodsDialog(val) {
if (val) {
this.receiveInfo = this.sendSetFormData;
this.setReceiveInfo = Object.assign({}, this.sendSetFormData);
// console.log('当前订单详情数据',this.receiveInfo)
}
},
},
methods: {
cancelSendSet() {
this.$refs.sendSetForm.resetFields();
this.sendSetForm.remark = '';
this.$emit('closeSendSet',{type: 1})
},
submitSendSet() {
this.$refs.sendSetForm.validate((valid) => {
if (valid) {
let para = {...this.setReceiveInfo,...this.sendSetForm};
if (this.dialogTitle == '发货设置') {//发货设置的type是1，配送设置的type是2，配送完成的type是3
para.type = 1;
}else if (this.dialogTitle == '配送设置') {
para.type = 2;
}
updateExpress(para).then(res => {
if (res.code == '000000') {
this.$message.success('操作成功')
this.$refs.sendSetForm.resetFields();
this.sendSetForm.remark = '';
this.$emit('closeSendSet',{type: 2})
}else {
this.$message.error('操作失败，请重试')
}
});
} else {
return false;
}
})
},
//修改买家收货信息
changeInfo() {
this.showChangeInfo = true;
},
closeChangeInfo(val) {
if (val.type == 2) {//保存
let receiveData = val.data;
this.setReceiveInfo.provinceName = receiveData.provinceName;
this.setReceiveInfo.provinceId = receiveData.provinceId;
this.setReceiveInfo.cityName = receiveData.cityName;
this.setReceiveInfo.cityId = receiveData.cityId;
this.setReceiveInfo.countyName = receiveData.countyName;
this.setReceiveInfo.countyId = receiveData.countyId;
this.setReceiveInfo.townName = receiveData.townName;
this.setReceiveInfo.townId = receiveData.townId;
this.setReceiveInfo.address = receiveData.address;
this.setReceiveInfo.receiver = receiveData.receiver;
this.setReceiveInfo.receiverMobile = receiveData.receiverMobile;
}
this.showChangeInfo = false;
},
},
}
</script>
<style lang="scss">
.send-set-body{
.address-content{
width: 100%;
background-color: #F0F2F5;
border: 1px solid #E4E7ED;
border-radius: 4px;
padding: 10px 15px;
.address-title{
display: flex;
justify-content: space-between;
align-items: center;
.title{
font-size: 13px;
color: #999999;
}
}
.address-info{
p{
line-height: 26px;
}
}
}
.form-title{
margin-top: 15px;
margin-bottom: 15px;
}
.el-dialog__body{
padding-bottom: 0;
}
}
</style>
src/router/router.js
浏览文件 @ 9bc44852
......@@ -61,6 +61,14 @@ const createRange = r => require.ensure([], () => r(require('../views/yqrange/cr
const editRange = r => require.ensure([], () => r(require('../views/yqrange/edit-range.vue')), 'edit-range')
const createLive = r => require.ensure([], () => r(require('../views/yqrange/create-live.vue')), 'create-live')
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 goodsManage = r => require.ensure([], () => r(require('../views/goods/goods-manage.vue')), 'goods-manage')
const createGood = r => require.ensure([], () => r(require('../views/goods/create-good.vue')), 'create-good')
const orderManage = r => require.ensure([], () => r(require('../views/goods/order-manage.vue')), 'order-manage')
const orderDetail = r => require.ensure([], () => r(require('../views/goods/order-detail.vue')), 'order-detail')
export default [{
path: '/',
component: App,
......@@ -254,6 +262,32 @@ export default [{
path: '/edit-simple-advert',
component: editSimpleAdvert,
},
{
path: '/shop-list',
component: shopList,
},
{
path: '/create-shop',
component: createShop,
},
{
path: '/order-manage',
component: orderManage,
},
{
path: '/goods-manage',
component: goodsManage,
},
{
path: '/create-good',
component: createGood,
},
{
path: '/order-detail',
component: orderDetail,
},
// {
// path: '/followup',
// name: 'followUp',
......
src/store/getters.js
浏览文件 @ 9bc44852
import education from './education/getters'
import custom from './custom/getters'
import goods from './goodsManage/getters'
// import { containObject } from '../utils/utils'
// let getters = containObject(education)
const getters = Object.assign(education, custom)
const getters = Object.assign(education, custom,goods)
export default getters
\ No newline at end of file
src/store/goodsManage/getters.js 0 → 100644
浏览文件 @ 9bc44852
const getters = {
// kind: state => state.customStore.kind,
// searchParam: state => state.customStore.searchParam,
// searchParamOrg: state => state.customStore.searchParamOrg,
// cartList: state => state.customStore.cartList,
// courseList: state => state.customStore.courseList,
// allLabelList: state => state.customStore.allLabelList,
// subLabelList: state => state.customStore.subLabelList,
// allLabelListOrg: state => state.customStore.allLabelListOrg,
// subLabelListOrg: state => state.customStore.subLabelListOrg,
// courseLimitCount: state => state.customStore.courseLimitCount,
goodsInfo: state => state.goodsManage.goodsInfo,
}
//console.log(getters)
export default getters
src/store/goodsManage/goodsManage.js 0 → 100644
浏览文件 @ 9bc44852
const goodsManage = {
namespaced: true,
state: {
goodsInfo: null,
},
mutations: {
CHANGE_GOODS_INFO: (state, data) => {
state.goodsInfo = data;
}
},
actions: {
changeGoodsInfo({ commit }, info) {
console.log(info)
commit('CHANGE_GOODS_INFO', info);
}
}
}
export default goodsManage;
src/store/index.js
浏览文件 @ 9bc44852
......@@ -6,6 +6,7 @@ import followModules from './followup/index';
import getters from './getters'
//居民诊断
import patientsDiagnose from './patientsManage/patientsDiagnose';
import goodsManage from './goodsManage/goodsManage';
// cme
import cmeStore from './cme/cmeStore';
......@@ -19,6 +20,7 @@ export default new Vuex.Store({
common,
...followModules,
patientsDiagnose,
goodsManage,
cmeStore,
customStore
},
......
src/utils/goods/index.js 0 → 100644
浏览文件 @ 9bc44852
import fetch from '../fetch';
import { getBaseUrl } from '@/utils/index'
let headers = {
'Content-Type': 'application/json;charset=UTF-8',
token: localStorage.getItem('storageToken'),
};
export const getGoodsList = (params) => {
return fetch({
headers,
url: getBaseUrl(`store/goods/query`),
method: 'post',
data: params,
description: '商品列表查询',
})
};
export const uploadExcel = data => {
// return utils.checkAuth(()=>{
return fetch({
headers,
url: getBaseUrl(`store/goods/import`),
method: 'post',
data: data,
description: '上传excel文件',
})
// })
}
//
export const batchOnOff = (params) => {
return fetch({
headers,
url: getBaseUrl(`store/goods/onoff/sale`),
method: 'post',
data: params,
description: '批量上下架',
})
};
export const updateGoods = (params) => {
return fetch({
headers,
url: getBaseUrl(`store/goods/upsert`),
method: 'post',
data: params,
description: '创建/更新商品',
})
};
///dosage/all
export const dosageAll = (parm) => {
return fetch({
headers,
url: getBaseUrl(`store/dosage/all`),
method: 'get',
// params: params,
description: '剂型',
})
};
export const getDeparts = (parm) => {
return fetch({
headers,
url: getBaseUrl(`api-ws/departments/category`),
method: 'get',
// params: params,
description: '科室',
})
};
//`basic-data/constants?typeCode=P128`
export const updateStock = (parm) => {
return fetch({
headers,
url: getBaseUrl(`trade/order/admin/query/${orderId}`),
method: 'get',
// params: params,
description: '增加/减少库存',
})
};
src/utils/shop/index.js 0 → 100644
浏览文件 @ 9bc44852
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(`store/upsert`),
method: 'post',
data: params,
description: '新建编辑店铺',
})
};
export const queryStore = (params) => {
return fetch({
headers,
url: getBaseUrl(`store/query`),
method: 'post',
data: params,
description: '查询店铺信息',
})
};
export const queryOrderDetail = (orderId) => {
return fetch({
headers,
url: getBaseUrl(`store/orders/admin/query/${orderId}`),
method: 'get',
// params: params,
description: '查询订单详情',
})
};
///trade/order/admin/query/list
//store/orders/111/express
export const queryOrderList = (params) => {
return fetch({
headers,
url: getBaseUrl(`store/orders/admin/query/list`),
method: 'get',
params: params,
description: '查询订单列表',
})
};
export const updateExpress = (params) => {
return fetch({
headers,
url: getBaseUrl(`store/orders/admin/${params.id}/express`),
method: 'post',
data: params,
description: '更新物流信息',
})
};
export const queryShopAuth = (params) => {
return fetch({
headers,
url: getBaseUrl(`store/user/storeid`),
method: 'get',
params: params,
description: '查询超级管理员权限',
})
};
\ No newline at end of file
src/views/goods/create-good.vue 0 → 100644
浏览文件 @ 9bc44852
<template>
<div class="create-shop-wrapper">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" :curmbThird="curmbThird" :jumPathThird="jumPathThird"></bread-crumb>
<div class="create-shop-content screenSet" id="screenSet">
<el-row class="step-content">
<el-col :span="20">
<p class="title">{{title}}</p>
</el-col>
<el-col :span="4" style="text-align: right">
<el-button size="small" type="primary" @click="complete">完成</el-button>
</el-col>
</el-row>
<el-form
ref="formData"
:model="formData"
:rules="rules"
label-width="150px"
label-suffix="："
class="basic-form"
>
<div class="basic-item-icon">
<div class="part-tit">通用信息</div>
<el-form-item label="商品名称" prop="goodsName">
<el-col :span="13">
<el-input
size="small"
v-model="formData.goodsName"
placeholder="请输入商品名称"
show-word-limit
maxlength="60"
></el-input>
<!-- <span class="word-num">{{(formData.goodsName).replace(/\s+/g,"").length}}/60</span> -->
</el-col>
</el-form-item>
<el-form-item label="商品介绍" prop="goodsDescription">
<el-col :span="13">
<el-input
type="textarea"
rows="4"
size="small"
v-model="formData.goodsDescription"
placeholder="请输入商品介绍"
maxlength="1000"
show-word-limit
></el-input>
<!-- <span class="word-num">{{(formData.goodsDescription).replace(/\s+/g,"").length}}/1000</span> -->
</el-col>
</el-form-item>
<el-form-item label="商品头图" class="required-label">
<el-upload
:file-list="fileGoodsList"
class="bg-uploader"
:show-file-list="isShowFileList"
action="#"
:before-upload="beforeUploadPic"
>
<div class="file-pics" v-if="fileGoodsList.length > 0" :key="index" v-for="(item,index) in fileGoodsList">
<img :src="item.url" @mouseover.stop="headIndex=index" class="bg-img"/>
<div
class="img-delete"
v-if="headIndex==index"
@click.stop="deleteImg(item,fileGoodsList)"
@mouseout.stop="headIndex=-1"
>
<i class="el-icon-delete"></i>
</div>
</div>
<img class="bg-img" src="../../assets/image/small.png" v-if="fileGoodsList.length <10"/>
<div class="limit-text">
<p>限制大小: 200kb</p>
<p>建议尺寸：750*420</p>
<p>支持jpeg, png格式</p>
</div>
</el-upload>
<p class="upload-message" v-if="!isgoodsImages">请上传商品头图</p>
</el-form-item>
<el-form-item label="商品类型" prop="goodsType">
<el-select
v-model="formData.goodsType"
placeholder="请选择商品类型"
size="small"
@change="getGoodsTypes(formData.goodsType,2)"
clearable>
<el-option
v-for="(item,index) in oneLever"
:key="index"
:label="item.categoryName"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<!-- <p class="upload-message" v-if="uploadImgMessage1">请上传商品头图</p> -->
</div>
<div class="basic-item-icon" v-if="isMedic">
<div class="part-tit">药品信息</div>
<el-form-item label="批准文号" prop="approvalNumber">
<el-col :span="18">
<el-input
size="small"
v-model="formData.approvalNumber"
placeholder="请输入批准文号"
style="width:50%;"
></el-input>
<span class="fast-opt" @click="fastInput">快速录入</span>
<span class="word-num">(点击可快速录入下面的药品信息)</span>
</el-col>
</el-form-item>
<el-form-item label="药品通用名称" prop="medicCommonName">
<el-col :span="13">
<el-input
size="small"
v-model="formData.medicCommonName"
placeholder="请输入药品通用名称"
style="width:70%;"
maxlength="60"
show-word-limit
></el-input>
<!-- <span class="word-num">{{(formData.medicCommonName).replace(/\s+/g,"").length}}/60</span> -->
</el-col>
</el-form-item>
<el-form-item label="药品商品名称" prop="medicGoodsName">
<el-col :span="13">
<el-input
size="small"
v-model="formData.medicGoodsName"
placeholder="请输入药品商品名称"
maxlength="60"
show-word-limit
></el-input>
<!-- <span class="word-num">{{(formData.medicGoodsName).replace(/\s+/g,"").length}}/60</span> -->
</el-col>
</el-form-item>
<el-form-item label="药品规格" prop="size">
<el-col :span="13">
<el-input
size="small"
v-model="formData.size"
placeholder="请输入药品规格"
style="width:70%;"
></el-input>
<span class="word-num">例如:0.125g*12袋/盒</span>
</el-col>
</el-form-item>
<div class="inline">
<el-form-item label="是否是处方药" prop="otc1">
<el-col :span="24">
<el-radio size="mini" v-model="formData.otc1" label="1">处方药</el-radio>
<el-radio v-model="formData.otc1" label="0">非处方药</el-radio>
</el-col>
</el-form-item>
<el-form-item label="剂型" prop="dosageId">
<el-select
v-model="formData.dosageId"
placeholder="请选择药品剂型"
size="small"
clearable>
<el-option
v-for="(item,index) in doseAll"
:key="index"
:label="item.dosageName"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
</div>
<el-form-item label="用法用量" prop="usage">
<el-col :span="13">
<el-input
size="small"
v-model="formData.usage"
placeholder="请输入用法用量"
style="width:70%;"
></el-input>
<span class="word-num">例如:每次一袋 每天1-2次</span>
</el-col>
</el-form-item>
<el-form-item label="药品类型" prop="categoryIdLevel2">
<el-select
v-model="formData.categoryIdLevel2"
placeholder="请选择药品类型"
size="small"
@change="getLever(formData.categoryIdLevel2,3)"
clearable
>
<el-option
v-for="(item,index) in twoLever"
:key="index"
:label="item.categoryName"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<div class="inline">
<el-form-item label="一级类目" prop="categoryIdLevel3" >
<el-select
v-model="formData.categoryIdLevel3"
placeholder="请选择一级类目"
size="small"
clearable
@change="getLever(formData.categoryIdLevel3,4)"
>
<el-option
v-for="(item,index) in threeLever"
:key="index"
:label="item.categoryName"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="二级类目" prop="categoryIdLevel4" >
<el-select
v-model="formData.categoryIdLevel4"
placeholder="请选择二级类目"
size="small"
clearable
@change="getLever(formData.categoryIdLevel4,5)"
>
<el-option
v-for="(item,index) in fourLever"
:key="index"
:label="item.categoryName"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="三级级类目" prop="categoryIdLevel5">
<el-select
v-model="formData.categoryIdLevel5"
placeholder="请选择三级类目"
size="small"
clearable
>
<el-option
v-for="(item,index) in fiveLever"
:key="index"
:label="item.categoryName"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
</div>
<el-form-item label="生产厂家" prop="manufacturer">
<el-col :span="13">
<el-input
size="small"
v-model="formData.manufacturer"
placeholder="请输入生产厂家"
style="width:70%;"
></el-input>
<span class="word-num"></span>
</el-col>
</el-form-item>
<div class="inline">
<el-form-item label="适用科室" prop="department">
<el-input
size="small"
v-model="formData.department"
placeholder="请输入适用科室"
></el-input>
<!-- <el-select
v-model="formData.department"
placeholder="请选择适用科室"
size="small"
clearable
>
<el-option
v-for="(item,index) in allDeparts"
:key="index"
:label="item.name"
:value="item.id"
></el-option>
</el-select> -->
</el-form-item>
<el-form-item label="治疗疾病" prop="treatDisease">
<el-col :span="24">
<el-input
size="small"
v-model="formData.treatDisease"
placeholder="请输入治疗疾病"
></el-input>
<span class="word-num"></span>
</el-col>
</el-form-item>
</div>
<el-form-item label="有效期" prop="expiredTime">
<el-col :span="13">
<el-input
size="small"
v-model="formData.expiredTime"
placeholder="请输入有效期"
style="width:70%;"
></el-input>
<!-- <el-date-picker
v-model="formData.expiredTime"
size="small"
format="yyyy-MM-dd HH:mm:ss"
type="date"
placeholder="选择日期">
</el-date-picker> -->
<span class="word-num"></span>
</el-col>
</el-form-item>
<el-form-item label="药品说明书">
<el-upload
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadPic1"
>
<div class="file-pics" v-if="fileIntrList.length > 0" :key="index" v-for="(item,index) in fileIntrList">
<img :src="item.url" @mouseover.stop="intrIndex=index" class="bg-img"/>
<div
class="img-delete"
v-if="intrIndex==index"
@click.stop="deleteImg(item,fileIntrList)"
@mouseout.stop="intrIndex=-1"
>
<i class="el-icon-delete"></i>
</div>
</div>
<img class="bg-img" src="../../assets/image/small.png" />
<div class="limit-text">
<p>限制大小: 2M</p>
<!-- <p>最小尺寸：750*420</p> -->
<p>支持jpeg, png格式</p>
</div>
</el-upload>
<p class="upload-message" v-if="!isSpecification_url">请上传药品说明书</p>
</el-form-item>
</div>
<div class="basic-item-icon">
<div class="part-tit">销售信息</div>
<div class="inline">
<el-form-item label="零售价" prop="optPrice">
<el-col :span="20">
<el-input
size="small"
v-model="formData.optPrice"
placeholder="请输入零售价"
></el-input>
<!-- <span class="word-num">{{(formData.name).replace(/\s+/g,"").length}}/60</span> -->
</el-col>
</el-form-item>
<!-- <el-form-item label="折扣价" prop="name">
<el-col :span="20">
<el-input
size="small"
v-model="formData.name"
placeholder="请输入折扣价"
></el-input>
</el-col>
</el-form-item> -->
</div>
<div class="inline">
<el-form-item label="库存" prop="name" class="required-label">
<el-col :span="20">
<div class="stock-com">
<span class="sp sp-l" @click="changeStock(1)" :class="{'opac':formData.stock == 0}"><i class="el-icon-minus"></i></span>
<span class="sp sp-c">{{formData.stock}}</span>
<span class="sp sp-r" @click="changeStock(2)"><i class="el-icon-plus"></i></span>
</div>
<p class="error-message" v-if="!isgoodStock">库存不能为0</p>
<!-- <el-input
size="small"
v-model="formData.name"
placeholder="请输入库存"
></el-input> -->
<!-- <el-input-number readonly size="small" v-model="formData.stock"></el-input-number> -->
<!-- <span class="word-num">{{(formData.name).replace(/\s+/g,"").length}}/60</span> -->
</el-col>
</el-form-item>
<el-form-item label="条形码" prop="barCode">
<el-col :span="20">
<el-input
size="small"
v-model="formData.barCode"
placeholder="请输入条形码"
></el-input>
<!-- <span class="word-num">{{(formData.name).replace(/\s+/g,"").length}}/60</span> -->
</el-col>
</el-form-item>
</div>
</div>
</el-form>
<el-dialog
:title="stock.title"
:visible.sync="stockDio"
width="30%"
center>
<div class="stock-dia">
<div class="stock-item">更新库存后，将影响买家购买，请谨慎操作</div>
<div class="stock-item">当前库存：{{formData.goodsStock}}</div>
<div class="demo-input-suffix">
{{stock.type == 1 ? '减少数量' : '增加数量'}}：
<el-input v-model="stock.num" :placeholder="stock.placeholderTxt" style="width: 180px;"></el-input>
</div>
</div>
<span slot="footer" class="dialog-footer" style="text-align: right;">
<!-- <el-button @click="centerDialogVisible = false">取 消</el-button> -->
<el-button type="primary" @click="updateStock">完成</el-button>
</span>
</el-dialog>
</div>
</div>
</template>
<script>
import BreadCrumb from "@/components/breadcrumb.vue";
let vm = null;
import { openLoading, closeLoading } from "../../utils/utils";
import { doUpload, getFilePath } from "../../utils/qiniu-util";
import { updateGoods ,updateStock,dosageAll,getDeparts,getGoodsList} from '@/utils/goods';
import Cropper from '@/components/common/cropper.vue'
import { mapGetters } from "vuex";
export default {
components: {
BreadCrumb,
Cropper
},
data(){
let checkProjectStr = (rule, value, callback) => {
if (value.indexOf("\\") != -1) {
//存在
callback(new Error("请勿输入字符“ \\ ”"));
} else if (value.indexOf(".") != -1) {
callback(new Error("请勿输入字符“ . ”"));
} else {
callback();
}
};
return{
stock:{
title:'减少库存',
type:1,
placeholderTxt:'请输入减少的库存数量',
num:''
},
doseAll:[],
fileGoodsList:[],
fileIntrList:[],
intrIndex:-1,
isShowFileList:false,
isgoodStock:true,
headIndex:-1,
oneLever:[],
twoLever:[],
allDeparts:[],
threeLever:[{
categoryName: "其他",
id:-1
}],
fourLever:[{
categoryName: "其他",
id:-1
}],
fiveLever:[{
categoryName: "其他",
id:-1
}],
stockDio:false,
curmbFirst: '云鹊店铺',
curmbSecond: '商品管理',
curmbThird: '编辑商品',// /live-manage?id=
jumPathThird: '',
isgoodsImages:true,
isSpecification_url:true,
title:'',
typeList: [{
label: '药品',
value: '1',
}, {
label: '药品器械',
value: '2',
}, {
label: '其他',
value: '3',
}],
formData: {
optPrice:0,
id:'',
categoryId:'',
categoryIdLevel2: '',
categoryIdLevel3: '',
categoryIdLevel4: '',
categoryIdLevel5: '',
goodsName:'',
goodsDescription:'',
goodsImages:[],
goodsType:'',
medicCommonName:'',
medicGoodsName:'',
size:'',
dosageId:null,
usage:'',
otc:false,
otc1:'1',
approvalNumber:'',
manufacturer:'',
department:'',
expiredTime:'',
specification_url:'',
treatDisease:'',
barCode:'',
discountPrice:'',
stock:0,
goodsStock:0,
specificationImages:[],
goodsId:'',
costPrice:'',
decrStock:'',//减少库存
incrStock:'',//增加库存
storeId: '',
},
showCropper: false,
currentOption: {
offset_x: 120,
offset_y: 185,
width: 160,
height: 120,
cvWidth: 1000,
cvHeight: 800,
uploadType: 1,
cropDialogWidth: '900px',
cropBoxResizable: true,
minCropBoxWidth: 100,
minCropBoxHeight: 100,
aspectRatio: 16/9
},
slide2: {
oriUrl: '', // 原图
},
rules: {
goodsName: [
{ required: true, message: "请输入商品名称", trigger: "blur" },
{
// min: 2,
// max: 14,
//message: "输入长度为2-14的内容，可包含中英文、数字及特殊符号",
trigger: "blur"
},
{ validator: checkProjectStr, trigger: "blur" }
],
introduce: [
{ required: true, message: "请输入圈子介绍", trigger: "blur" },
{
min: 2,
max: 40,
message: "输入长度为2-40的内容，可包含中英文、数字及特殊符号",
trigger: "blur"
},
{ validator: checkProjectStr, trigger: "blur" }
],
goodsImages: [
{ required: true, message: "请上传商品头图", trigger: "blur" }
],
goodsType:[
{ required: true, message: "请选择商品类型", trigger: "change" }
],
medicCommonName:[
{ required: true, message: "请输入商品通用名称", trigger: "blur" }
],
size:[
{ required: true, message: "请输入商品规格", trigger: "blur" }
],
manufacturer:[
{ required: true, message: "请输入生产厂家", trigger: "blur" }
],
approvalNumber:[
{ required: true, message: "请输入批准文号", trigger: "blur" }
],
dosageId:[
{ required: true, message: "请选择剂型", trigger: "change" }
],
categoryIdLevel2:[
{ required: true, message: "请选择药品类型", trigger: "blur" }
],
categoryIdLevel3:[
{ required: true, message: "请选择一级类目", trigger: "blur" }
],
categoryIdLevel4:[
{ required: true, message: "请选择二级类目", trigger: "blur" }
],
categoryIdLevel5:[
{ required: true, message: "请选择三级类目", trigger: "blur" }
],
otc:[
{ required: true, message: "请选择是否是处方", trigger: "blur" }
],
specification_url:[
{ required: true, message: "请上传药品说明书", trigger: "blur" }
],
// barCode: [
// { required: true, message: "请输入条形码", trigger: "blur" },
// ],
optPrice: [
{ required: true, message: "请输入零售价", trigger: "blur" },
],
dynamicFlag: [
{ required: true, message: "请选择内容发布权", trigger: "blur" },
]
},
imgMouseOver1: false,
uploadImgMessage1: false,//未上传图片，校验提示语
isMedic:false,
}
},
computed: {
...mapGetters(["goodsInfo"])
},
created() {
vm = this;
const {id, storeId} = this.$route.query
this.jumPathThird = '/goods-manage?storeId='+storeId
//this.jumPathThird = '/create-good?id=add&storeId=46'
this.title = id == 'add' ? '新增商品' : '编辑商品'
this.curmbThird = this.title
this.formData.storeId = Number(storeId) || '';
this.getLever(0,1)
dosageAll().then((res)=>{
this.doseAll = res.data
})
getDeparts().then((res)=>{
this.allDeparts = res.data
})
if(id != 'add'){
// let goods = Object.assign(this.goodsInfo,{})
// this.formData = {...goods}
// console.log(goods)
this.getDetailByEdit(id)
}
},
methods: {
//eidt状态
getDetailByEdit(id){
let parm = {
goodsIdList:[id],
goodsName :'',
goodsType :'',
pageNo:1,
pageSize: 10,
}
getGoodsList(parm).then((res)=>{
if(res.code != '000000'){
return this.$message({
message: res.message,
type: 'error'
});
}
closeLoading(this);
if(res.data == null){
return this.$message({
message: '数据加载失败',
type: 'error'
});
}
const {goodsList} = res.data
this.formData = Object.assign(this.formData,{...goodsList[0]})
this.formData.optPrice = this.formData.costPrice/100;
this.fileGoodsList = this.getImges(goodsList[0].goodsImgList,1)
this.fileIntrList = this.getImges(goodsList[0].medicImgList,2)
this.isMedic = this.formData.goodsType == 5 ? true : false
this.formData.stock = this.formData.goodsStock
console.log(this.formData.otc)
this.formData.otc1 = this.formData.otc ? '1' : '0'
if(this.isMedic){
this.getLever(5,2,1)
}
const {categoryIdLevel2,categoryIdLevel3,categoryIdLevel4,categoryIdLevel5} = this.formData
if(categoryIdLevel2 != -1){
this.getLever(categoryIdLevel2,3,1)
}
if(categoryIdLevel3 != -1){
this.getLever(categoryIdLevel3,4,1)
}
if(categoryIdLevel4 != -1){
this.getLever(categoryIdLevel4,5,1)
}
console.log(this.formData)
//this.totalRows = res.data.totalCount
})
},
getImges(d,type){
let a = [];
if(d.length > 0){
for(let i=0;i<d.length;i++){
a.push({
url:type==1 ?d[i].goodsImgUrl :d[i].imageUrl,
imageUrl:type==1 ?d[i].goodsImgUrl :d[i].imageUrl,
id: d[i].id,
imageSort: d[i].imageSort,
imageType: type == 1 ? d[i].imgType : d[i].imageType,
})
}
}
return a;
},
//快速录入
fastInput(){
///medications/query/{approvalnumber}
if(this.formData.approvalNumber == ''){
this.$refs.formData.validateField("approvalNumber")
return;
}
this.GET("store/medications/query/"+this.formData.approvalNumber).then(res => {
console.log(res)
if(res.code != '000000'){
return this.$message({
message: res.message,
type: 'error'
});
}
if(res.data == null){
return this.$message({
message: '未查询到数据，请手动输入',
type: 'warning'
});
}
const {imageList,medicationInfo} = res.data
const {medicCommonName,
medicGoodsName,
dosageId,
size,
otc,
usage,
categoryIdLevel2,
categoryIdLevel3,
categoryIdLevel4,
categoryIdLevel5,
manufacturer,
department,
treatDisease,
expiredTime} = medicationInfo
let fastParm = {
medicCommonName,
medicGoodsName,
dosageId,
size,
otc,
usage,
categoryIdLevel2,
categoryIdLevel3,
categoryIdLevel4,
categoryIdLevel5,
manufacturer,
department,
treatDisease,
expiredTime,
}
if(categoryIdLevel2){
this.getLever(categoryIdLevel2,3,1)
}
if(categoryIdLevel3 != -1){
this.getLever(categoryIdLevel3,4,1)
}
if(categoryIdLevel4 != -1){
this.getLever(categoryIdLevel4,5,1)
}
this.formData = Object.assign(this.formData,fastParm)
this.formData.otc1 = this.formData.otc ? '1' : '0'
this.fileIntrList = this.getImges(imageList,2)
});
},
getGoodsTypes(id,type){
if(id == 5 ){
this.isMedic = true;
this.getLever(id,type)
}else{
this.isMedic = false;
}
},
defaultArr(){
let a = [
{
categoryName: "其他",
id:-1
}
]
return a
},
//获取分类
getLever(id,type,parm){
this.GET("store/category/"+id).then(res => {
console.log(res)
if(type == 1){
this.oneLever = res.data
}else if(type == 2){
this.twoLever = res.data || this.defaultArr()
}else if(type == 3){
// res.data = res.data.push({categoryName: "其他",id:-1})
res.data = res.data.length > 0 ? res.data.concat([{categoryName: "其他",id:-1}]) : this.defaultArr()
this.threeLever = res.data
if(!parm){
this.formData.categoryIdLevel3 = ''
this.formData.categoryIdLevel4 = ''
this.formData.categoryIdLevel5 = ''
}
}else if(type == 4){
res.data = res.data.length > 0 ? res.data.concat([{categoryName: "其他",id:-1}]) : this.defaultArr()
this.fourLever = res.data
if(!parm){
this.formData.categoryIdLevel4 = ''
this.formData.categoryIdLevel5 = ''
}
}else if(type == 5){
res.data = res.data.length > 0 ? res.data.concat([{categoryName: "其他",id:-1}]) : this.defaultArr()
this.fiveLever = res.data
}
});
},
updateStock(){
let r = /^\+?[1-9][0-9]*$/;
//造假 接口来了删掉
if(this.stock.num <= 0){
return this.$message({
message: '增加库存数量不得为0',
type: 'warning'
});
}
if(!r.test(this.stock.num)){
return this.$message({
message: '库存数量必须正整数',
type: 'warning'
});
}
if(this.stock.type == 1){
if(this.stock.num > this.formData.goodsStock){
return this.$message({
message: '减少库存数量不得大于当前库存',
type: 'warning'
});
}
this.formData.stock = this.formData.goodsStock - this.stock.num
this.formData.decrStock = Number(this.stock.num)
this.formData.incrStock = ''
}else if(this.stock.type == 2){
this.formData.stock = Number(this.stock.num) + Number(this.formData.goodsStock)
this.formData.incrStock = Number(this.stock.num)
this.formData.decrStock = ''
}
//this.formData.goodsStock = this.formData.stock
this.stockDio = false
},
changeStock(type){
if(this.formData.stock == 0 && type == 1){
return;
}
let str = type == 1 ? '减少' : '增加',
txt = `请输入${str}的库存数量`,
tit = str + '库存'
this.stock = {
title:tit,
type,
num:'',
placeholderTxt:txt
}
this.stockDio = true
},
complete() {
let formName = "formData";
// let goodsImgList = this.fileGoodsList.map((item, index) => {
// item.imageSort = index+1;
// })
// console.log(this.fileGoodsList)
// let specificationImgList = this.fileIntrList.map((item, index) => {
// item.imageSort = index+1;
// })
for(let i=0;i<this.fileGoodsList.length;i++){
this.fileGoodsList[i].imageSort = i+1
}
for(let j=0;j<this.fileIntrList.length;j++){
this.fileIntrList[j].imageSort = j+1
}
this.formData.goodsImages = this.fileGoodsList;
this.formData.specificationImages = this.fileIntrList;
this.isgoodsImages = this.formData.goodsImages.length == 0 ? false :true;
// this.isSpecification_url = this.formData.specificationImages.length == 0 ? false : true
this.formData.categoryId = this.formData.goodsType
this.formData.otc = this.formData.otc1 == 1 ? true : false
this.isgoodStock = this.formData.stock > 0 ? true : false
console.log(this.isgoodStock)
if(this.isMedic){
if(!this.isgoodsImages){
return;
}
// if(!this.isSpecification_url){
// return;
// }
}
if(!this.isgoodStock){
return;
}
this.$refs[formName].validate((valid) => {
if (valid) {
//alert('submit!');
this.updateGoodsInfo();
} else {
console.log('error submit!!');
return false;
}
});
},
//更新商品
updateGoodsInfo(){
//this.formData.incrStock = 1000
this.formData.costPrice = this.formData.optPrice*100
this.formData.hasChanged = true;
console.log('提交值',this.formData);
updateGoods(this.formData).then((res)=>{
if (res.code !== '000000') {
// return this.$message.error(res.message);
return this.$message({
message: res.message,
type: 'error'
});
}
vm.$message.success("操作成功");
this.$router.push({
path: '/goods-manage',
query: {
storeId: this.formData.storeId,
}
})
})
},
//上传商品头图
beforeUploadPic(file) {
if(this.fileGoodsList.length > 10){
return ;
}
let vm = this;
let picTypes = ['image/jpeg','image/png']
const isLt200k = file.size / 1024 < 200;
if (picTypes.indexOf(file.type) == -1) {
return this.$message.error("请上传jpeg或png格式的图片");
}
if (!isLt200k) {
return vm.$message.error("图片大小请控制在200kb以内");
}
let _img = new FileReader();
_img.readAsDataURL(file);
_img.onload = function (theFile) {
let image = new Image()
image.src = theFile.target.result
vm.slide2.oriUrl = theFile.target.result;
image.onload = function () {
let _this = this;
console.log(_this.width,_this.height)
// if (_this.width != fileLimit.width || _this.height != fileLimit.height) {
//if (_this.width == 750 && _this.height == 420) {
openLoading(vm);
doUpload(vm, file, getFilePath(file, null), "preview4", "progress1", 1).then(function (path) {
closeLoading(vm);
console.log('上传成功后路径', path);
// if (fileLimit.show == "uploadImgMessage1") {
// vm.uploadImgMessage1 = false;
// } else if (fileLimit.show == "uploadImgMessage2") {
// vm.uploadImgMessage2 = false;
// }
let len = vm.fileGoodsList.length;
vm.fileGoodsList.push({url:path.fullPath,imageUrl:path.fullPath,imageName:'',imageSort: len+1,imageType: 2,id: null,})
//vm.formData.goodsImages = path.fullPath
vm.$message.success("上传成功");
});
// } else {
// return vm.$message.error("图片尺寸不符合规范，请根据规范上传图片");
// }
};
};
// openLoading(vm);
// doUpload(vm, file, getFilePath(file, null), "preview4", "progress1", 1).then(function (path) {
// closeLoading(vm);
// console.log('上传成功后路径', path);
// vm.formData.goodsImages = path.fullPath
// vm.$message.success("上传成功");
// });
},
//上传药品说明
beforeUploadPic1(file,type) {
this.currentOption.aspectRatio = 1/1;
this.currentOption.cropBoxResizable = true;
this.currentOption.minCropBoxWidth = 160;
this.currentOption.minCropBoxHeight = 160;
let fileLimit = {
width: 160,
height: 160,
size: 0.5,
sizeText: "500K",
key: "headUrl",
more: "imgUrl1More",
show: "uploadImgMessage1"
};
this.beforeUpload(file, fileLimit);
},
//上传图片
beforeUpload(file, fileLimit) {
let vm = this;
const isJPG = file.type === "image/jpeg";
const isPNG = file.type === "image/png";
const isLt2M = file.size / 1024 / 1024 < 2;
if (!isJPG && !isPNG) {
vm.$message.error("图片格式不符合规范，请根据规范上传图片");
// return;
}
if (!isLt2M) {
vm.$message.error("图片大小请控制在2M以内 ");
return;
}
let _img = new FileReader();
_img.readAsDataURL(file);
_img.onload = function (theFile) {
let image = new Image()
image.src = theFile.target.result
vm.slide2.oriUrl = theFile.target.result;
image.onload = function () {
let _this = this;
// if (_this.width != fileLimit.width || _this.height != fileLimit.height) {
// if (_this.width < fileLimit.width || _this.height < fileLimit.height) {
// vm.$message.error("图片尺寸不符合规范，请根据规范上传图片");
// return;
// } else if(_this.width > fileLimit.width || _this.height > fileLimit.height){
// vm.showCropper = true;
// vm.currentOption.cvWidth = _this.width;
// vm.currentOption.cvHeight = _this.height;
// return;
// } else {
openLoading(vm);
doUpload(vm, file, getFilePath(file, null), "preview4", "progress1", 1).then(function (path) {
closeLoading(vm);
let len = vm.fileIntrList.length;
vm.fileIntrList.push({url:path.fullPath,imageUrl:path.fullPath,imageSort: len+1,imageType: 1,id: null})
vm.$message.success("上传成功");
});
//}
};
};
return isJPG && isLt2M;
},
//删除图片
deleteImg(item,d) {
let index = ''
for(let i=0;i<d.length;i++){
if(item.url == d[i].url){
index = i;
break
}
}
d.splice(index,1)
// if (type == 1) {
// vm.formData.headUrl = "";
// vm.imgMouseOver1 = false;
// }
},
// 获取裁剪的图片数据
getCropImg(argument) {
this.showCropper = false;
this.cropData = argument[1]
vm.doUploadQiNiu(argument[2])
argument[3] && argument[3].destroy();
// vm.slide2.oriUrl = "";
},
// 上传七牛
doUploadQiNiu(file){
doUpload(this,file, getFilePath(file,null), 'preview4', 'uploadProgress1', '').then(function (path) {
vm.formData.headUrl = path.fullPath;
vm.$message.success('上传成功');
});
},
},
}
</script>
<style lang="scss">
.create-shop-wrapper{
.create-shop-content{
background: #fff;
padding: 10px;
.step-content {
overflow: hidden;
height: 60px;
padding: 10px 10px 50px ;
border-bottom: 1px solid #efefef;
.title{
font-size: 13px;
color: #449284;
}
}
}
.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;
}
}
}
}
.required-label .el-form-item__label::before {
content: "*";
color: #f56c6c;
margin-right: 4px;
}
.basic-item-icon {
position: relative;
.require {
position: absolute;
left: 67px;
top: 11px;
color: #f56c6c;
}
.error-message{
font-size: 12px;
color: #f56c6c;
}
.upload-message {
position: absolute;
left: 0;
top: 105px;
font-size: 12px;
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 {
font-size: 12px;
color: #999;
padding-top: 5px;
}
.line {
margin-left: 10px;
width: 20px;
}
.bg-uploader {
.bg-img {
float: left;
width: 84px;
height: 100px;
}
.limit-text {
float: left;
margin-left: 10px;
margin-top: -10px;
p {
font-size: 12px;
color: #999;
text-align: left;
}
}
}
.el-upload__tip {
position: absolute;
top: -6px;
left: 130px;
}
.span-mt-10{
.edit-img {
width: 20px;
margin-top: 10px;
}
}
.p-tips{
font-size: 13px;
color: #8C8C8C;
line-height: 26px;
}
.part-tit{
font-size: 14px;
padding:20px 0 20px 20px;
}
.inline{
.el-form-item{
display: inline-block;
vertical-align:top;
.el-radio__label{
font-size: 12px;
}
}
}
.stock-com{
width: 158px;
height: 32px;
border-radius: 4px;
overflow: hidden;
.sp{
display: inline-block;
float: left;
color: #fff;
}
.sp-c{
line-height: 30px;
height: 30px;
width:92px;
text-align: center;
color: #666;
border-top:1px solid #449284;
border-bottom:1px solid #449284;
}
.sp-l{
border-right:1px solid #449284;
}
.sp-r{
border-left:1px solid #449284;
border-radius: 0 4px 4px 0;
}
.sp-l,.sp-r{
width: 32px;
text-align: center;
line-height: 32px;
font-size: 13px;
background: #449284 ;
cursor: pointer;
}
.opac{
opacity: 0.5;
}
}
.stock-dia{
.stock-item{
padding-bottom: 20px;
}
}
.fast-opt{
font-size: 12px;
padding:0 10px;
cursor: pointer;
color:#449284
}
.file-pics{
display: inline-block;
width: 84px;
height: 100px;
float:left;
margin-right: 15px;
position: relative;
}
</style>
src/views/goods/goods-manage.vue 0 → 100644
浏览文件 @ 9bc44852
<template>
<div class="yqshop-wrapper">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb>
<div class="yqshop-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.goodsName" size="small" placeholder="请输入商品名称"></el-input>
</el-form-item>
<el-form-item label="商品ID">
<el-input v-model="id" size="small" placeholder="请输入商品ID"></el-input>
</el-form-item>
<el-form-item label="商品类型">
<el-select
v-model="searchForm.goodsType"
placeholder="请选择商品类型"
size="small"
clearable>
<el-option
v-for="(item,index) in goodsTypes"
:key="index"
:label="item.categoryName"
:value="item.id"
></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 :gutter="30" type="flex" style="margin-top: 10px">
<el-col :span="18">
<el-button type="primary" size="small" @click="batchOpt('on')">批量上架</el-button>
<el-button type="primary" size="small" @click="batchOpt('off')">批量下架</el-button>
</el-col>
<el-col :span="6" style="text-align: right">
<el-button type="primary" size="small" @click="batchOpt(3)">批量导入</el-button>
<el-button type="primary" size="small" @click="edit('add')">新建单个商品</el-button>
</el-col>
</el-row>
</el-form>
<el-table ref="multipleTable" :data="tableData" class="item-table" style="width: 100%;margin-top: 10px;" @selection-change="handleSelectionChange">
<el-table-column
type="selection"
fixed
width="55">
</el-table-column>
<el-table-column prop="goodsId" label="商品ID" width="120" align="center">
</el-table-column>
<el-table-column prop="goodsName" label="商品名称" width="140" align="center" show-overflow-tooltip></el-table-column>
<el-table-column prop="type" label="商品类型" width="100" align="center">
<template slot-scope="scope">
<span>{{ scope.row.goodsType | rangeType }}</span>
</template>
</el-table-column>
<el-table-column prop="status" label="商品状态" width="100" align="center">
<template slot-scope="scope">
<span>{{ scope.row.goodsStatus | rangeStatus }}</span>
</template>
</el-table-column>
<el-table-column prop="quantityOfSale" label="销量" width="120" align="center">
</el-table-column>
<el-table-column prop="size" label="规格" width="100" align="center">
</el-table-column>
<el-table-column prop="costPrice" label="价格" width="120" align="center">
<template slot-scope="scope">
<span>{{scope.row.costPrice | rangePrice}}</span>
</template>
</el-table-column>
<el-table-column prop="saleTime" label="发布时间" width="150" align="center">
</el-table-column>
<el-table-column label="操作" width="200" align="center" fixed="right">
<template slot-scope="scope">
<div v-if="scope.row.goodsStatus == 0">
<el-button @click="edit(scope.row)" type="text" size="small">编辑</el-button>
<el-button @click="shelfOpt(scope.row,2)" type="text" size="small">上架销售</el-button>
<!-- <el-button @click="shelfOpt(scope.row,3)" type="text" size="small">删除</el-button> -->
</div>
<div v-if="scope.row.goodsStatus == 1">
<el-button @click="edit(scope.row)" type="text" size="small">编辑</el-button>
<el-button @click="shelfOpt(scope.row,1)" type="text" size="small">下架</el-button>
</div>
<div v-if="scope.row.goodsStatus == 2">
<el-button @click="edit(scope.row)" type="text" size="small">编辑</el-button>
<el-button @click="shelfOpt(scope.row,2)" type="text" size="small">上架销售</el-button>
<!-- <el-button @click="shelfOpt(scope.row,3)" type="text" size="small">删除</el-button> -->
</div>
<div v-if="scope.row.goodsStatus == 3">
<!-- <el-button @click="edit(scope.row)" type="text" size="small">编辑</el-button>
<el-button @click="shelfOpt(scope.row,1)" type="text" size="small">下架</el-button>
<el-button @click="shelfOpt(scope.row,2)" type="text" size="small">上架销售</el-button>
<el-button @click="shelfOpt(scope.row,3)" 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>
<el-dialog
title="批量导入"
:visible.sync="batchDialog"
width="30%"
center>
<el-dialog
width="30%"
title="导入失败原因"
:visible.sync="innerVisible"
append-to-body>
<div class="upload-error">
<div class="error-tem" style="padding:5px" v-for="(item,index) in validateFailedList" :key="index">
{{'第'+item.rowNumber+'行：'}}{{item.validateResultList.join(',')}}
</div>
</div>
</el-dialog>
<div class="batch-dia">
<div class="batch-dia-item">
<span class="s-l">1、下载模板</span>
<span class="s-r" @click="uploadTemp"><i class="el-icon-upload"></i>下载</span>
</div>
<div class="batch-dia-item">
<span class="s-l">2、根据模板填写信息</span>
</div>
<div class="batch-dia-item">
<span class="s-l">3、上传文件</span>
<span class="s-r">
<el-upload
class="upload-demo"
action="#"
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
:before-upload="getBatchUpload"
multiple
:limit="1"
:file-list="fileList">
<i class="el-icon-upload"></i>上传
</el-upload>
</span>
</div>
</div>
<span slot="footer" class="dialog-footer" style="text-align: right;">
<!-- <el-button @click="centerDialogVisible = false">取 消</el-button> -->
<el-button type="primary" @click="batchDialog = false">完成</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import { openLoading, closeLoading } from "../../utils/utils";
import BreadCrumb from "@/components/breadcrumb.vue";
import { getRangeList,updateRangeStatus} from "../../utils/yqrange/yqrangeApi";
import { getGoodsList,batchOnOff,uploadExcel} from '@/utils/goods';
import { getBaseUrl } from '@/utils/index'
var typeList = [{
categoryName: "短信额度",
id: 1,
}, {
categoryName: "学习卡",
id: 2,
}, {
categoryName: "职称考卡",
id: 3,
},{
categoryName: "医疗器械",
id: 4,
},{
categoryName: "药品",
id: 5,
}]
export default {
components: {
BreadCrumb
},
data(){
return{
curmbFirst: '云鹊店铺',
curmbSecond: '店铺管理',
showAllFlag: false,
showNewFlag: false,
batchDialog:false,
id:'',
searchForm: {
goodsIdList:[],
goodsName :'',
goodsType :'',
pageNo:1,
pageSize: 10,
storeId:0,
},
innerVisible:false,
selectList:[],
batchParm:{
batchUpdateSaleStatusReq: {
goodsIdList: [],
userId: 0
},
onOff: ""
},
fileList:[],
totalRows: 0,
tableData: [],
goodsTypes:[],
typeList: [],
//uploadUrl:getBaseUrl('store/goods/import'),
postData:{},
validateFailedList:[]
}
},
created() {
this.getLists()
this.getLever()
const {storeId} = this.$route.query;
this.searchForm.storeId = Number(storeId) || 0;
// if(storeId){
// this.searchForm.storeId = storeId
// }
},
filters:{
rangeType(type){
let name = ''
for(let i=0;i<typeList.length;i++){
if(type == typeList[i].id){
name = typeList[i].categoryName;
break;
}
}
return name
},
rangeStatus(status){
let str = ''//0待上架，1已上架，2已下架，3定时上架
if(status == 1){
str = '已上架'
}else if(status == 0){
str = '待上架'
}else if(status == 2){
str = '已下架'
}else if(status == 3){
str = '定时上架'
}
return str
},
rangePrice(price){
let str = '￥'
str += price/100
return str
}
},
methods: {
handlePreview(){},
handleRemove(){},
beforeRemove(){},
handleSelectionChange(val){
console.log(val)
this.selectList = val
},
//批量上传
getBatchUpload(file) {
let self = this;
let arr = file.type.split('/');
let ext = "." + arr[1];
let name = file.name;
let type = name.substring(name.lastIndexOf('.') + 1);
if (type !== 'xls' && type !== 'xlsx') {
self.$message({
message: '上传文件只能是 xls、xlsx格式!',
type: 'warning'
});
return;
}
let reader = new FileReader();
reader.onload = function (e) {
let fileJson = {
fileName: file.name,
file: e.target.result.substr(e.target.result.indexOf("base64,") + 7),
ext: ext
};
let fileArray = [{
type: 'patient',
base64: fileJson
}];
let req = {
base64Str : e.target.result.substr(e.target.result.indexOf("base64,") + 7),
storeId:self.searchForm.storeId
//import_type: 2,
};
//req.token = localStorage.getItem('storageToken');
//self.postData = JSON.stringify(req);
uploadExcel(req).then(res => {
if(res.code != '000000'){
return self.$message({
message: '上传失败，请重新上传!',
type: 'error'
});
}
if(res.data.allPass){
self.$message({
message: '上传成功!',
type: 'success'
});
self.batchDialog = false
setTimeout(()=>{
self.getLists()
},2000)
}else{
self.innerVisible = true
self.validateFailedList = res.data.validateFailedList || []
}
})
};
reader.readAsDataURL(file);
},
uploadTemp(){
let url = "https://file.yunqueyi.com/trade/store/goods_import_template.xlsx"
window.location.href = url
},
getLever(id=0){
this.GET("store/category/"+id).then(res => {
console.log(res)
this.goodsTypes = res.data
});
},
getLists(){
openLoading(this);
getGoodsList(this.searchForm).then((res)=>{
if(res.code != '000000'){
return this.$message({
message: res.message,
type: 'error'
});
}
closeLoading(this);
if(res.data == null){
return this.$message({
message: '分页数据加载失败',
type: 'error'
});
}
this.tableData = res.data.goodsList
this.totalRows = res.data.totalCount
})
},
//获取商品id
getIdsByArr(d){
let a = []
for(let i=0;i<d.length;i++){
a.push(d[i].goodsId)
}
return a;
},
//批量 上下架操作
batchOpt(type){
if(type == 3){//批量导入
this.batchDialog = true
}else{
if(this.selectList.length == 0){
return this.$message({
message: '请选择商品',
type: 'warning'
});
}
this.batchParm.onOff = type
this.batchParm.batchUpdateSaleStatusReq.goodsIdList = this.getIdsByArr(this.selectList)
batchOnOff(this.batchParm).then((res)=>{
if(res.code == '000000'){
this.selectList = []
this.$refs.multipleTable.clearSelection();
this.getLists()
}
})
}
},
edit(row){
let url = ''
if(row == 'add'){
url = `/create-good?id=add&storeId=${this.searchForm.storeId}`
}else{
url = `/create-good?id=${row.goodsId}&storeId=${this.searchForm.storeId}`
}
this.$store.dispatch('goodsManage/changeGoodsInfo', {...row});
this.$router.push({
path: url
})
},
//上架 下架
shelfOpt(row,type){
let str = '',
btn1 = '',
btn2 = ''
if(type == 1){
str = `确定下架商品吗？<br/>下架后将不再出售`
btn1 = '下架'
}else if(type == 2){
str = `确定上架商品吗？<br/>上架后将开始出售`
btn1 = '上架'
}else if(type == 3){
str = `确定删除商品吗？<br/>删除后商品信息将都不保留`
btn1 = '删除'
}
this.$confirm(str, '', {
confirmButtonText: btn1,
cancelButtonText: '取消',
type: 'warning',
customClass: 'range-make-box',
dangerouslyUseHTMLString:true
}).then(() => {
// confirm
// this.updateStatus(row.id, "30");
if(type != 3){
this.batchParm.onOff = type == 1 ? 'off' : 'on'
this.batchParm.batchUpdateSaleStatusReq.goodsIdList = [row.goodsId]
batchOnOff(this.batchParm).then((res)=>{
if(res.code == '000000'){
this.getLists()
}
})
}
}).catch(() => {
// cancel
// this.$message.error("上线失败");
});
},
initPrivilege(){
let idType = localStorage.getItem('storageIdType');
this.searchForm.userType = idType;
// 内部用户:运营人员
if(idType == "1"){
this.showAllFlag = true;
this.showNewFlag = true;
}
// 外部用户
else if(idType == "2"){
this.showAllFlag = false;
this.getUserAuth();
}
},
// 外部用户权限
getUserAuth(){
let highMainManager = localStorage.getItem('highMainManager');
let mainManager = localStorage.getItem('mainManager');
let manager = localStorage.getItem('manager');
if(highMainManager == "1" || mainManager == "1"){
this.showNewFlag = true;
}
else if(manager == "1"){
this.showNewFlag = false;
}
},
searchList() {
openLoading(this);
if(this.id != ''){
this.searchForm.goodsIdList = [this.id]
}else{
this.searchForm.goodsIdList = []
}
this.searchForm.pageNo = 1
this.getLists()
},
resetForm() {
// this.searchForm = {
// goodsIdList:[],
// goodsName:'',
// goodsType:'',
// pageNo:1,
// pageSize: 10,
// };
this.searchForm.goodsIdList = []
this.searchForm.goodsName = ''
this.searchForm.goodsType = ''
this.searchForm.pageNo = 1
this.searchForm.pageSize = 10
this.getLists();
},
handleSizeChange(val) {
this.searchForm.pageSize = val;
this.searchForm.pageNo = 1;
this.searchList();
},
handleNumChange(val) {
this.searchForm.pageNo = val;
this.getLists();
},
},
}
</script>
<style lang="scss">
.yqshop-wrapper{
.yqshop-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;
}
}
}
}
.batch-dia{
.batch-dia-item{overflow: hidden;
.s-l,.s-r{
float: left;
padding:10px 0;
color:#666
}
.s-l{
margin-right: 100px;
}
.s-r{
color:#1989fa;
cursor: pointer;
}
.el-icon-upload{
}
}
}
</style>
src/views/goods/order-detail.vue 0 → 100644
浏览文件 @ 9bc44852
<template>
<div class="order-detail-wrapper">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond" :curmbThird="curmbThird" :jumPathThird="jumPathThird"></bread-crumb>
<div class="order-detail-content screenSet" id="screenSet">
<div class="header-title">订单详情</div>
<div class="detail-all-info">
<div class="trade-status" v-if="showStatus == 1"><img src="../../assets/image/order/order_status1.png"/>交易成功</div>
<div class="trade-status" v-if="showStatus == 2"><img src="../../assets/image/order/order_status2.png"/>已发货</div>
<div class="trade-status" v-if="showStatus == 3"><img src="../../assets/image/order/order_status3.png"/>待发货</div>
<div class="trade-status" v-if="showStatus == 4"><img src="../../assets/image/order/order_status4.png"/>等待买家付款</div>
<div class="trade-status" v-if="showStatus == 5"><img src="../../assets/image/order/order_status5.png"/>交易关闭</div>
<div class="trade-info">
<el-card class="left-card">
<div slot="header" class="clearfix">
<span>{{storeType == 1 ? '物流' : '配送'}}信息</span>
</div>
<div v-if="showStatus == 1 || showStatus == 2">
<div v-if="storeType == 3">
<p>无配送信息，买家自提</p>
</div>
<div v-else>
<p class="trade-status1">
<i class="el-icon-truck" style="font-size: 18px"></i>
<span class="send-status" v-if="storeType == 1">已发货</span>
<span class="send-status" v-if="storeType == 2">云鹊配送中</span>
</p>
<p>收货地址：{{orderDetailData.receiverAddr}}，{{orderDetailData.receiver}}，{{orderDetailData.receiverMobile}}</p>
<div v-if="storeType == 1">
<p>物流公司：{{orderDetailData.expressName}}</p>
<p>快递单号：{{orderDetailData.expressNo}}</p>
</div>
<div v-if="storeType == 2">
<p>配送员姓名：{{orderDetailData.sender}}</p>
<p>手机号：{{orderDetailData.senderMobile}}</p>
</div>
<p>备注：{{orderDetailData.remark}}</p>
</div>
</div>
<div v-if="(showStatus == 3) && (storeType == 1 || storeType == 2)">
<div class="trade-status1">
<p>
<i class="el-icon-truck" style="font-size: 18px"></i>
<span class="send-status">{{storeType == 1 ? '待发货' : '待配送'}}</span>
</p>
<el-button type="text" @click="showSendDialog">{{storeType == 1 ? '去发货' : '去配送'}}</el-button>
</div>
<p>收货地址：{{orderDetailData.receiverAddr}}，{{orderDetailData.receiver}}，{{orderDetailData.receiverMobile}}</p>
</div>
<div v-if="showStatus == 4">
<p>暂无{{storeType == 1 ? '物流' : '配送'}}信息，待买家支付</p>
</div>
<div v-if="showStatus == 5"><p>交易已关闭</p></div>
</el-card>
<el-card class="right-card">
<div slot="header" class="clearfix">
<span>订单信息</span>
</div>
<div>
<p>订单编号：{{orderDetailData.orderNo}}</p>
<p>下单时间：{{orderDetailData.createdTime}}</p>
<p v-if="(showStatus == 1 || showStatus == 2 || showStatus == 3) && orderDetailData.payChannel">支付方式：{{orderDetailData.payChannel | payChanelFormat}}</p>
<p v-if="showStatus == 1 || showStatus == 2 || showStatus == 3">支付时间：{{orderDetailData.paymentTime}}</p>
<!--<p>发货时间：{{orderDetailData.sendTime}}</p>-->
<!--<p>成交时间：{{orderDetailData.finishTime}}</p>-->
</div>
</el-card>
</div>
<el-table :data="tableData" border class="item-table" style="width: 100%;margin-top: 30px;">
<el-table-column prop="goodsName" label="商品名称" min-width="100" align="center">
<template slot-scope="scope">
<div style="cursor: pointer;color: #449284" @click="goGoodsEdit(scope.row)">{{ scope.row.goodsName }}</div>
</template>
</el-table-column>
<el-table-column prop="size" label="规格" min-width="100" align="center"></el-table-column>
<el-table-column prop="goodsQuantity" label="数量" min-width="100" align="center">
<template slot-scope="scope">
<span>×{{ scope.row.goodsQuantity }}</span>
</template>
</el-table-column>
<el-table-column prop="price" label="单价" min-width="100" align="center">
<template slot-scope="scope">
<span>￥{{ scope.row.price | toFixed2 }}</span>
</template>
</el-table-column>
<el-table-column prop="status" label="状态" min-width="100" align="center">
<template slot-scope="scope">
<span>{{orderDetailData.showStatusStr}}</span>
</template>
</el-table-column>
</el-table>
<div class="total-set">
<p><span>商品总额：</span><span>￥{{orderDetailData.totalPrice | toFixed2}}</span></p>
<p><span>优惠：</span><span>-￥{{orderDetailData.totalCouponFee | toFixed2}}</span></p>
<p class="total-price" v-if="showStatus == 1 || showStatus == 2 || showStatus == 3"><span>实付：</span><span>￥{{orderDetailData.amount | toFixed2}}</span></p>
<p class="total-price" v-if="showStatus == 4"><span>应付：</span><span>￥{{orderDetailData.totalPrice | toFixed2}}</span></p>
<p class="total-price" v-if="showStatus == 5"><span>实付：</span><span>￥0.00</span></p>
</div>
</div>
<send-set-dialog
:sendGoodsDialog="sendGoodsDialog"
:dialogTitle="dialogTitle"
:sendSetFormData="sendSetForm"
@closeSendSet="closeSendSet">
</send-set-dialog>
</div>
</div>
</template>
<script>
// import { openLoading, closeLoading } from "../../utils/utils";
import BreadCrumb from "@/components/breadcrumb.vue";
import { queryOrderDetail } from '@/utils/shop';
import SendSetDialog from "@/components/shop/send-set-dialog";
export default {
components: {
BreadCrumb,
SendSetDialog
},
data(){
return{
curmbFirst: '商铺管理',
curmbSecond: '订单管理',
jumPathThird: '',
curmbThird: '订单详情',
storeId: null,
orderId: null,
showStatus: null,//订单展示状态,1已完成,2已发货,3待发货,4待支付,5交易关闭
storeType: null,//店铺类型，1供应商，2小药房，3医生小店
orderDetailData: {
amount: '',//订单实付总金额
createdTime: '',//下单时间
expressId: '',//物流id
expressName: '',//物流公司名称
receiverAddr: '',//收货地址
expressNo: '',//快递单号
expressStatus: '',//物流状态
finishTime: '',//成交时间
orderNo: '',//订单编号
orderStatus: '',//订单状态：1待支付,2支付中,3支付失败,4订单超时,5支付成功,6交易完成,7交易关闭
paymentTime: '',//支付时间
totalCouponFee: '',//优惠券金额
totalPrice: '',//订单总金额
remark: '',//备注
sendTime: '',//发货时间
payChannel: '',//支付方式
// showStatus: null,//订单展示状态,1已完成,2已发货,3待发货,4待支付,5交易关闭
},
tableData: [],
sendGoodsDialog: false,
dialogTitle: '',
sendSetForm: {},
}
},
created() {
const {id, storeId, storeType} = this.$route.query;
this.orderId = id;
this.storeId = storeId;
this.storeType = storeType;
this.jumPathThird = `/order-manage?storeId=${this.storeId}`;
this.init();
},
methods: {
init() {
queryOrderDetail(this.orderId).then(res => {
if (res.code == '000000') {
const { goodsInfoDtoList } = res.data;
this.orderDetailData = {...res.data};
this.showStatus = res.data.showStatus;
this.tableData = goodsInfoDtoList;
}
})
},
showSendDialog() {
this.sendGoodsDialog = true;
this.sendSetForm = this.orderDetailData;
if (this.storeType == 1) {
this.dialogTitle = '发货设置'
}else {
this.dialogTitle = '配送设置'
}
},
closeSendSet(val) {
//保存操作
if (val.type == 2) {
this.init();
}
this.sendGoodsDialog = false;
},
//跳转至商品编辑页
goGoodsEdit(row) {
// this.$store.dispatch('goodsManage/changeGoodsInfo', {...row});
this.$router.push({
path: '/create-good',
query: {
id: row.goodsId,
storeId: this.storeId,
}
})
},
},
filters: {
toFixed2: function (value) {
let val;
if (value) {
val = (value/100).toFixed(2);
}else {
val = 0.00
}
return val;
},
payChanelFormat: function (value) {
let str = '';
if(value == 1) {
str = '微信支付'
}
return str;
}
},
}
</script>
<style lang="scss">
.order-detail-wrapper{
.order-detail-content{
background: #fff;
padding: 10px;
.header-title{
padding: 10px 12px;
font-size: 13px;
color: #449284;
border-bottom: 1px solid #efefef;
}
.detail-all-info{
.trade-status{
display: flex;
align-items: center;
justify-content: center;
padding: 30px 0;
text-align: center;
font-size: 24px;
img{
width: 25px;
height: 25px;
margin-right: 15px;
}
.set-icon{
color: #449284;
font-size: 28px;
margin-right: 10px;
}
}
.trade-info{
width: 100%;
box-sizing: border-box;
display: flex;
font-size: 13px;
justify-content: space-between;
.el-card__body{
padding-top: 10px;
}
.left-card{
width: 69%;
display: inline-block;
margin-right: 2%;
.trade-status1{
height: 26px;
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 5px;
.send-status{
margin-left: 10px;
display: inline-block;
}
}
}
.right-card{
width: 28%;
display: inline-block;
}
.left-card, .right-card{
p{
color: #838683;
line-height: 22px;
}
}
.clearfix:before,
.clearfix:after {
display: table;
content: "";
}
.clearfix:after {
clear: both
}
}
.total-set{
text-align: right;
margin-top: 10px;
p{
font-size: 13px;
color: #999999;
line-height: 24px;
span:first-child{
display: inline-block;
width: 72px;
text-align: left;
}
span:last-child{
display: inline-block;
width: 90px;
}
}
.total-price{
font-size: 15px;
color: #333333;
margin-top: 5px;
}
}
}
}
.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>
src/views/goods/order-manage.vue 0 → 100644
浏览文件 @ 9bc44852
<template>
<div class="order-manage-wrapper">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></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.goodsName" size="small" placeholder="请输入商品名称"></el-input>
</el-form-item>
<el-form-item label="订单号">
<el-input v-model="searchForm.orderNo" size="small" placeholder="请输入订单号"></el-input>
</el-form-item>
<el-form-item label="买家名称">
<el-input v-model="searchForm.receiver" size="small" placeholder="请输入买家名称"></el-input>
</el-form-item>
<el-form-item label="下单时间">
<el-date-picker
v-model="searchForm.orderDate"
type="datetime"
size="small"
format="yyyy-MM-dd HH:mm:ss"
value-format="timestamp"
placeholder="请选择下单时间">
</el-date-picker>
</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-form>
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="全部" name="all"></el-tab-pane>
<el-tab-pane label="等待买家付款" name="first"></el-tab-pane>
<el-tab-pane label="等待发货" name="second"></el-tab-pane>
<el-tab-pane label="已发货" name="third"></el-tab-pane>
<el-tab-pane label="交易成功" name="fourth"></el-tab-pane>
<el-tab-pane label="关闭交易" name="five"></el-tab-pane>
</el-tabs>
<el-table :data="tableData" border max-height="1000" class="item-table" style="width: 100%;margin-top: 10px;">
<el-table-column prop="id" label="订单号" min-width="100" align="center"></el-table-column>
<el-table-column prop="goodsNameList" label="商品名称" min-width="150" align="center">
<template slot-scope="scope">
<!--<span>{{ scope.row.goodsName }}</span>-->
<p v-for="(item, index) in scope.row.goodsNameList" :key="index" class="p-normal">{{item}}</p>
</template>
</el-table-column>
<el-table-column prop="showStatusStr" label="交易状态" min-width="100" align="center">
</el-table-column>
<el-table-column prop="amount" label="实收款" min-width="100" align="center">
<template slot-scope="scope">
<span>￥{{ scope.row.amount | toFixed2}}</span>
</template>
</el-table-column>
<el-table-column prop="receiver" label="买家" min-width="100" align="center"></el-table-column>
<el-table-column prop="goodsQuantityList" label="数量" min-width="100" align="center">
<template slot-scope="scope">
<!--<span>{{ scope.row.goodsQuantity }}</span>-->
<p v-for="(item, index) in scope.row.goodsQuantityList" :key="index" class="p-normal">{{item}}</p>
</template>
</el-table-column>
<el-table-column prop="sizeList" label="规格" min-width="100" align="center">
<template slot-scope="scope">
<!--<span>{{ scope.row.size }}</span>-->
<p v-for="(item, index) in scope.row.sizeList" :key="index" class="p-normal">{{item}}</p>
</template>
</el-table-column>
<el-table-column prop="priceList" label="单价" min-width="100" align="center">
<template slot-scope="scope">
<!--<span>￥{{ scope.row.price }}</span>-->
<p v-for="(item, index) in scope.row.priceList" :key="index" class="p-normal">￥{{item | toFixed2}}</p>
</template>
</el-table-column>
<el-table-column prop="createTime" label="下单时间" min-width="100" align="center">
<template slot-scope="scope">
<span>{{ scope.row.createTime }}</span>
</template>
</el-table-column>
<el-table-column prop="comments" label="备注" min-width="100" align="center"></el-table-column>
<el-table-column label="操作" min-width="250" align="center" fixed="right">
<template slot-scope="scope">
<div>
<!--<el-button @click="closeTrade(scope.row)" type="text" size="small">关闭交易</el-button>-->
<!--<el-button @click="changePrice(scope.row)" type="text" size="small">修改价格</el-button>-->
<el-button v-if="scope.row.storeType == 1 && scope.row.showStatus == 3" @click="sendGoods(scope.row)" type="text" size="small">发货</el-button>
<el-button v-if="scope.row.storeType == 2 && scope.row.showStatus == 3" @click="distribute(scope.row)" type="text" size="small">配送</el-button>
<el-button v-if="scope.row.storeType == 1 && (scope.row.showStatus == 1 || scope.row.showStatus == 2)" @click="viewLogistics(scope.row)" type="text" size="small">查看物流</el-button>
<el-button v-if="scope.row.storeType == 2 && scope.row.showStatus == 2" @click="distributeComplete(scope.row)" type="text" size="small">配送完成</el-button>
<el-button @click="goDetail(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>
<el-dialog
title="确定关闭交易吗？"
:visible="closeTradeDialog"
@close="cancelTrade"
:show-close="false"
width="600px"
center>
<p style="text-align: center;margin-top: -25px;color: #9B9997">关闭后买家将不能再付款</p>
<div style="text-align: center;margin-top: 30px;">
<el-input type="textarea"
v-model="reasonTxt"
maxlength="400"
rows="5"
placeholder="请输入备注内容"
style="width: 80%;"></el-input>
<span class="word-num">{{reasonTxt.replace(/\s+/g,"").length}}/400</span>
</div>
<!--<el-form ref="auditForm" :model="auditForm" label-width="120px">
<el-form-item label="拒绝原因：">
<el-radio-group v-model="auditForm.label">
<div v-for="item in refuseReasonList" :key="item">
<div style="padding-top: 12px;">
<el-radio :label="item"></el-radio>
</div>
</div>
<div style="padding-top: 16px;">
<el-radio label="其他"></el-radio>
</div>
</el-radio-group>
<div v-if="auditForm.label == '其他'">
<el-input type="textarea" v-model="auditForm.desc" maxlength="25" style="width: 310px;margin-top: 10px;"></el-input>
<span class="word-num">{{(auditForm.desc).replace(/\s+/g,"").length}}/25</span>
</div>
</el-form-item>
</el-form>-->
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="cancelTrade">取 消</el-button>
<el-button size="small" type="primary" @click="submitTrade">关闭交易</el-button>
</span>
</el-dialog>
<el-dialog
title="修改价格"
:visible="changePriceDialog"
@close="cancelPrice"
width="600px"
center>
<el-form ref="changePriceForm" :model="changePriceForm" label-width="120px" label-suffix=":">
<el-form-item label="目前价格">
<span>￥{{changePriceForm.nowPrice}}</span>
</el-form-item>
<el-form-item label="修改价格">
<el-input type="text" v-model="changePriceForm.updatePrice" placeholder="请输入修改后的价格" style="width: 70%"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button size="small" type="primary" @click="submitPrice">完成</el-button>
</span>
</el-dialog>
<send-set-dialog
:sendGoodsDialog="sendGoodsDialog"
:dialogTitle="dialogTitle"
:sendSetFormData="sendSetForm"
@closeSendSet="closeSendSet">
</send-set-dialog>
<el-dialog
title="查看物流"
:visible="viewLogisticsDialog"
@close="cancelView"
:show-close="false"
width="600px"
center>
<div class="view-content">
<i class="el-icon-truck" style="font-size: 18px"></i><span class="send-status">已发货</span>
<span class="view-number">{{logisticeInfo}}</span>
<el-button type="text" @click="copyTxt">复制</el-button>
</div>
<input type="text" id="copyInput" class="hidden-input" />
<span slot="footer" class="dialog-footer">
<el-button size="small" type="primary" @click="cancelView">我知道了</el-button>
</span>
</el-dialog>
<el-dialog
title=""
:visible="disCompleteDialog"
@close="cancelDis"
:show-close="false"
width="600px"
center>
<div class="view-content">
<p class="center-title">确认配送完成吗？</p>
<p class="center-subtitle">请确认线下已将商品送达</p>
</div>
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="cancelDis">取消</el-button>
<el-button size="small" type="primary" @click="submitDisComplete">配送完成</el-button>
</span>
</el-dialog>
</div>
</div>
</template>
<script>
// import { openLoading, closeLoading } from "../../utils/utils";
import BreadCrumb from "@/components/breadcrumb.vue";
import SendSetDialog from "@/components/shop/send-set-dialog";
import { queryOrderList, updateExpress } from "@/utils/shop";
export default {
components: {
SendSetDialog,
BreadCrumb
},
data(){
return{
curmbFirst: '云鹊店铺',
curmbSecond: '订单管理',
activeName: 'all',
searchForm: {
showStatus: -1,
storeId: 0,
goodsName: '',
orderNo: '',
receiver: '',
orderDate: '',
pageNo: 1,
pageSize: 10,
},
totalRows: 0,
tableData: [
// {
// id: '',
// name: '',
// type: null,
// status: '',
// num: null,
// createdTime: '',
// }
],
closeTradeDialog: false,
reasonTxt: '',
changePriceDialog: false,
changePriceForm: {
nowPrice: 45,
updatePrice: '',
},
sendGoodsDialog: false,
dialogTitle: '',
sendSetForm: {},
viewLogisticsDialog: false,
logisticeInfo: '',//复制物流信息
disCompleteDialog: false,
disCompleteData: {},
rules: {
name: [
{ required: true, message: '请输入快递公司', trigger: "blur"},
],
orderNum: [
{ required: true, message: '请输入快递单号', trigger: "blur"},
],
},
}
},
created() {
this.searchForm.storeId = this.$route.query.storeId || 0,
this.searchList();
},
methods: {
searchList(){
queryOrderList(this.searchForm).then(res => {
if (res.code == '000000') {
this.tableData = res.data.orderSingleDtoList;
this.totalRows = res.data.totalNum;
}
})
},
resetForm() {
this.activeName = 'all';
this.searchForm = {
showStatus: -1,
storeId: this.$route.query.storeId,
goodsName: '',
orderNo: '',
receiver: '',
orderDate: '',
pageNo: 1,
pageSize: 10,
};
this.searchList();
},
handleSizeChange(val) {
this.searchForm.pageSize = val;
this.searchForm.pageNo = 1;
this.searchList();
},
handleNumChange(val) {
this.searchForm.pageNo = val;
this.searchList();
},
handleClick(tab, event) {
//-1全部，1已完成,2已发货,3待发货,4待支付,5交易关闭
if (this.activeName == 'all') {//全部
this.searchForm.showStatus = -1;
}else if (this.activeName == 'first') {//等待买家付款
this.searchForm.showStatus = 4;
}else if (this.activeName == 'second') {//待发货
this.searchForm.showStatus = 3;
}else if (this.activeName == 'third') {//已发货
this.searchForm.showStatus = 2;
}else if (this.activeName == 'fourth') {//交易成功
this.searchForm.showStatus = 1;
}else if (this.activeName == 'five') {//交易关闭
this.searchForm.showStatus = 5;
}
this.searchForm.pageNo = 1;
this.searchList();
},
//关闭交易
closeTrade(row) {
this.closeTradeDialog = true;
},
cancelTrade() {
this.closeTradeDialog = false;
},
submitTrade() {
this.closeTradeDialog = false;
},
//修改价格
changePrice(row) {
this.changePriceDialog = true;
},
cancelPrice() {
this.changePriceDialog = false;
},
submitPrice() {
this.changePriceDialog = false;
},
//发货
sendGoods(row) {
this.sendGoodsDialog = true;
this.dialogTitle = '发货设置';
this.sendSetForm = row;
},
closeSendSet(val) {
//保存操作
if (val.type == 2) {
this.resetForm();//更新列表
}
this.sendGoodsDialog = false;
},
//配送
distribute(row) {
this.sendGoodsDialog = true;
this.dialogTitle = '配送设置';
this.sendSetForm = row;
},
//查看物流
viewLogistics(row) {
this.viewLogisticsDialog = true;
this.logisticeInfo = `${row.expressName} ${row.expressNo}`;
},
cancelView() {
this.viewLogisticsDialog = false;
},
copyTxt() {
let txt = document.getElementById("copyInput");
txt.value = this.logisticeInfo;
// if (navigator.userAgent.match(/(iPhone|iPod|iPad|Mac);?/i)) {
if (navigator.userAgent.indexOf("Safari") > -1 && navigator.userAgent.indexOf("Chrome") < 1) {
var el = document.createElement('input');
el.value = txt.value;//要复制的内容
el.style.opacity = '0';
document.body.appendChild(el);
var editable = el.contentEditable;
var readOnly = el.readOnly;
el.contentEditable = true;
el.readOnly = false;
const range = document.createRange();
range.selectNodeContents(el);
var sel = window.getSelection();
sel.removeAllRanges();
sel.addRange(range);
el.setSelectionRange(0, 999999);
el.contentEditable = editable;
el.readOnly = readOnly;
var ret = document.execCommand('copy');
el.blur();
} else {
txt.select(); //选择对象
document.execCommand("copy");
}
this.$message.success('复制成功');
},
//配送完成
distributeComplete(row) {
this.disCompleteDialog = true;
this.disCompleteData = row;
},
cancelDis() {
this.disCompleteDialog = false;
},
//确认配送完成
submitDisComplete() {
let para = this.disCompleteData;
para.type = 3;
updateExpress(para).then(res => {
if (res.code == '000000') {
this.$message.success('操作成功')
this.disCompleteDialog = false;
this.resetForm();//更新列表
}else {
this.$message.error('操作失败，请重试')
}
});
},
//查看详情
goDetail(row) {
this.$router.push({
path: `/order-detail`,
query:{
id: row.id,
storeId: this.searchForm.storeId,
storeType: row.storeType,
}
})
},
},
filters: {
toFixed2: function (value) {
let val;
if (value) {
val = (value/100).toFixed(2);
}else {
val = 0.00
}
return val;
}
},
}
</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;
}
}
}
}
.el-tabs__item.is-active{
color: #449284;
}
.el-tabs__active-bar{
background-color: #449284;
}
.el-tabs__item:hover{
color: #449284;
}
.view-content{
.send-status{
margin-left: 5px;
}
.view-number{
color: #999999;
margin-left: 15px;
margin-right: 15px;
}
.center-title{
text-align: center;
}
.center-subtitle{
text-align: center;
font-size: 13px;
margin-top: 10px;
color: #999999;
}
}
.hidden-input {
height: 0;
}
.p-normal{
line-height: 26px;
border-bottom: 1px solid #E4E7ED;
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
margin: 10px 0;
text-align: center;
&:last-child{
border-bottom: none;
}
}
</style>
src/views/layout/slidebar.vue
浏览文件 @ 9bc44852
......@@ -39,6 +39,11 @@
</template>
</template>
</template>
<!--<template v-if="isOutsideGetted && isOutsideUser && isShowGoods">-->
<!--<el-menu-item v-for="(outItem, outIndex) in outsideGoodsItem" :index="'/'+outItem.index" :key="outIndex">-->
<!--<i :class="outItem.icon"></i>{{ outItem.title }}-->
<!--</el-menu-item>-->
<!--</template>-->
</el-menu>
</div>
</template>
......@@ -49,6 +54,7 @@
import { isNotEmptyUtils } from '../../utils/utils'
import { getUserTypeReq } from '@/utils/cme/cmeApi'
import { getCircleRole } from '@/utils/patients/patientsapi'
import { queryShopAuth } from '@/utils/shop';
let vm = null
export default {
......@@ -86,6 +92,7 @@
return {
isOutsideUser: false, // 是否是外部用户；（外部用户：只展示一个页面路由； 非外部用户：正常展示之前的逻辑）
isOutsideGetted: false,
isShowGoods: false,
items: [
{
title: '数据总览',
......@@ -121,76 +128,9 @@
]
},
// {
// title: '居民管理',
// icon: 'el-icon-patients-manage',
// index: 'patients-manage',
// subs: [
// {
// title: '我的居民',
// icon: 'el-icon-setting',
// index: 'patients-manage/mypatients-manage/patients-list'
// },
// {
// title: '新增居民',
// icon: 'el-icon-setting',
// index: 'patients-manage/new-manage/new-patient'
// },
// {
// title: '分组管理',
// icon: 'el-icon-setting',
// index: 'patients-manage/labels-manage/labels-list'
// },
// {
// title: '资料不全居民',
// icon: 'el-icon-setting',
// index: 'patients-manage/not-complete/uncompleted-list'
// }
// ]
// },{
// title: '消息推送',
// icon: 'el-icon-message',
// index: 'msg-push',
// isMessageSend: true,
// checkAuth: true,
// },
// {
// title: '学情报告',
// icon: 'el-icon-tickets',
// index: 'report-list',
// subs: [
// {
// title: '项目列表',
// icon: 'el-icon-document',
// index: 'report-list'
// },
// {
// title: '任务列表',
// icon: 'el-icon-document',
// index: 'export-download'
// }
// ]
// },
// {
// title: 'CME',
// icon: 'el-icon-reading',
// index: 'credit-manage',
// subs: [
// {
// title: '学分管理列表',
// icon: 'el-icon-document',
// index: 'credit-manage'
// },
// {
// title: '审核权限管理',
// icon: 'el-icon-document',
// index: 'review-access-manage'
// },
// {
// title: '学分发放管理',
// icon: 'el-icon-document',
// index: 'credit-send-manage'
// },
// ]
// title: '云鹊店铺',
// icon: 'el-icon-first-aid-kit',
// index: 'shop'
// },
],
outsideItems: [ // 外部用户 路由
......@@ -200,6 +140,18 @@
index: 'credit-send-manage'
},
],
/*outsideGoodsItem: [//只有通过店铺管理操作才可展示
{
title: '商品管理',
icon: 'el-icon-first-aid-kit',
index: 'goods-manage'
},
{
title: '订单管理',
icon: 'el-icon-first-aid-kit',
index: 'order-manage'
},
],*/
}
},
computed: {
......@@ -218,6 +170,8 @@
vm.setFollowSide();
vm.getRoleObj();
}
vm.setShopSide()
// vm.getGoodsAuth();
},
watch: {
authList(newVal, oldVal){
......@@ -237,12 +191,6 @@
} else if(val == 2) {
vm.setFollowSide();
vm.getRoleObj();
// let mainManager = localStorage.getItem('mainManager')
// let manager = localStorage.getItem('manager')
// console.log('存储权限值',mainManager,manager)
// if (mainManager == 1 || manager == 1) {
// vm.setCircleSize();
// }
}
},
},
......@@ -487,6 +435,39 @@
vm.items.push(yqRange);
vm.items.push(outResourceManage);
},
setShopSide(){
queryShopAuth().then(res => {
// 0 表示超级管理员,大于0 表示小店或供应商,null 表示非法用户
if (res.data >= 0) {
const shop = {
title: '云鹊店铺',
icon: 'el-icon-first-aid-kit',
index: 'shop-list'
};
vm.items.push(shop);
}else {
return;
}
})
/*const shop = {
title: '云鹊店铺',
icon: 'el-icon-first-aid-kit',
index: 'shop-list'
};
vm.items.push(shop);
const shop1 = {
title: '商品管理',
icon: 'el-icon-first-aid-kit',
index: 'goods-manage'
};
vm.items.push(shop1);
const shop2 = {
title: '订单管理',
icon: 'el-icon-first-aid-kit',
index: 'order-manage'
};
vm.items.push(shop2);*/
},
goToMessageSendPage(checkAuth) {
if(checkAuth){
......
src/views/shop/create-shop.vue 0 → 100644
浏览文件 @ 9bc44852
<template>
<div class="create-shop-wrapper">
<bread-crumb :curmbFirst="curmbFirst" :curmbSecond="curmbSecond"></bread-crumb>
<div class="create-shop-content screenSet" id="screenSet">
<el-row class="step-content">
<el-col :span="20">
<p class="title">新建店铺</p>
</el-col>
<el-col :span="4" style="text-align: right">
<el-button size="small" type="primary" @click="complete">完成</el-button>
</el-col>
</el-row>
<el-form
ref="formData"
:model="formData"
:rules="rules"
label-width="150px"
label-suffix="："
class="basic-form"
style="margin-top: 15px"
>
<div class="basic-item-icon">
<el-form-item label="店铺LOGO" class="required-label">
<el-upload
v-model="formData.storeLogo"
class="bg-uploader"
action="#"
:show-file-list="false"
:before-upload="beforeUploadPic1"
>
<img
v-if="formData.storeLogo"
:src="formData.storeLogo"
@mouseover.stop="imgMouseOver1=true"
class="bg-img"
/>
<img v-if="!formData.storeLogo" class="bg-img" src="../../assets/image/small.png" />
<div
class="img-delete"
v-show="imgMouseOver1"
@click.stop="deleteImg('storeLogo')"
@mouseout.stop="imgMouseOver1=false"
>
<i class="el-icon-delete"></i>
</div>
<div class="limit-text">
<p>限制大小: 200kb</p>
<p>建议尺寸：128*128</p>
<p>支持jpeg, png格式</p>
</div>
</el-upload>
</el-form-item>
<p class="upload-message" v-if="uploadImgMessage1">请上传店铺logo</p>
</div>
<el-form-item label="店铺名称" prop="storeName">
<el-col :span="10">
<el-input
size="small"
v-model="formData.storeName"
placeholder="请输入店铺名称"
maxlength="16"
style="width:85%;"
></el-input>
<span class="word-num">{{(formData.storeName).replace(/\s+/g,"").length}}/16</span>
</el-col>
</el-form-item>
<el-form-item label="店铺简介" prop="storeDescription">
<el-col :span="10">
<el-input
type="textarea"
rows="4"
maxlength="400"
size="small"
v-model="formData.storeDescription"
placeholder="请输入店铺简介"
style="width:85%;"
></el-input>
<span class="word-num">{{(formData.storeDescription).replace(/\s+/g,"").length}}/400</span>
</el-col>
</el-form-item>
<el-form-item label="店铺类型" prop="storeType">
<el-select
v-model="formData.storeType"
placeholder="请选择店铺类型"
size="small"
clearable
:disabled="isDisabled"
style="width: 35%"
>
<el-option
v-for="(item,index) in typeList"
:key="index"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<div v-if="formData.storeType == 1">
<el-row>
<el-col :span="10">
<el-form-item label="入驻企业名称" prop="compainName" class="required-label">
<el-input
type="text"
maxlength="50"
size="small"
v-model="formData.compainName"
placeholder="请输入入驻企业名称"
style="width:85%;"
></el-input>
<span class="word-num">{{(formData.compainName).replace(/\s+/g,"").length}}/50</span>
</el-form-item>
</el-col>
<el-col :span="10" :offset="1">
<el-form-item label="联系手机号" prop="phoneNum" label-width="95px" class="required-label">
<el-input
type="text"
size="small"
maxlength="11"
:disabled="isDisabled"
v-model="formData.phoneNum"
placeholder="请输入联系电话"
style="width:85%;"
></el-input>
</el-form-item>
</el-col>
</el-row>
<div class="main-content" v-for="(item, index) in formData.adminList" :key="index">
<el-row>
<el-col :span="10">
<el-form-item label="管理员姓名" class="required-label">
<el-input
type="text"
maxlength="10"
size="small"
v-model="item.adminName"
placeholder="请输入管理员姓名"
style="width:85%;"
></el-input>
<span class="word-num">{{(item.adminName).replace(/\s+/g,"").length}}/10</span>
</el-form-item>
</el-col>
<el-col :span="1" style="text-align: right">
<img style="margin-top: 5px;" src="../../assets/image/lianjie_icon.png" />
</el-col>
<el-col :span="10">
<el-form-item label="手机号" label-width="95px" class="required-label">
<el-input
type="text"
size="small"
maxlength="11"
v-model="item.adminMobile"
placeholder="请输入管理员手机号"
style="width:85%;"
></el-input>
</el-form-item>
</el-col>
<el-col :span="2" class="span-mt-10">
<img
v-if="index < 4 && (index == formData.adminList.length-1)"
@click="addItem(index)"
class="edit-img"
src="../../assets/image/plus.png"
/>
<img
v-if="formData.adminList.length > 1"
@click="deleteItem(index)"
class="edit-img"
src="../../assets/image/trash.png"
/>
</el-col>
</el-row>
</div>
<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.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 == 3">
<el-col :span="10">
<el-form-item label="医生姓名" prop="docName" class="required-label">
<el-input
type="text"
maxlength="50"
size="small"
v-model="formData.docName"
placeholder="请输入医生姓名"
style="width:85%;"
></el-input>
<span class="word-num">{{(formData.docName).replace(/\s+/g,"").length}}/50</span>
</el-form-item>
</el-col>
<el-col :span="10" :offset="1">
<el-form-item label="联系手机号" prop="docPhone" label-width="95px" class="required-label">
<el-input
type="text"
size="small"
maxlength="11"
v-model="formData.docPhone"
:disabled="isDisabled"
placeholder="请输入联系电话"
style="width:85%;"
></el-input>
</el-form-item>
</el-col>
</div>
<div v-if="formData.storeType == 2">
<el-col :span="10">
<el-form-item label="入驻药店名称" prop="drugstoreName" class="required-label">
<el-input
type="text"
maxlength="50"
size="small"
v-model="formData.drugstoreName"
placeholder="请输入入驻药店名称"
style="width:85%;"
></el-input>
<span class="word-num">{{(formData.drugstoreName).replace(/\s+/g,"").length}}/50</span>
</el-form-item>
</el-col>
<el-col :span="10" :offset="1">
<el-form-item label="联系电话" prop="drugstorePhone" label-width="95px" class="required-label">
<el-input
type="text"
size="small"
maxlength="11"
v-model="formData.drugstorePhone"
:disabled="isDisabled"
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>
</el-form>
<el-dialog
class="dialog-title-border-old"
title="图片裁剪"
:visible.sync="showCropper"
:width="currentOption.cropDialogWidth"
center>
<div slot="title" style="text-align: left;">
<span style="font-weight: 700;">图片裁剪</span>
</div>
<div v-if="showCropper" style="margin-bottom: 20px;">
<Cropper
:cropOption="currentOption"
@getCropImg="getCropImg(arguments)"
:originImg="slide2.oriUrl"
/>
</div>
</el-dialog>
</div>
</div>
</template>
<script>
import BreadCrumb from "@/components/breadcrumb.vue";
let vm = null;
import { openLoading, closeLoading } from "../../utils/utils";
import { doUpload, getFilePath } from "../../utils/qiniu-util";
import Cropper from '@/components/common/cropper.vue'
import { saveStore, queryStore } from '@/utils/shop';
import { checkMobile } from '@/utils/patients/checkValid'
export default {
components: {
BreadCrumb,
Cropper
},
data(){
let checkProjectStr = (rule, value, callback) => {
if (value.indexOf("\\") != -1) {
callback(new Error("请勿输入字符“ \\ ”"));
} else if (value.indexOf(".") != -1) {
callback(new Error("请勿输入字符“ . ”"));
} else {
callback();
}
};
return{
curmbFirst: '云鹊店铺',
curmbSecond: '新建店铺',
isDisabled: false,
storeData: {},
typeList: [
{
label: '供货商',
value: 1,
}, {
label: '小药房',
value: 2,
}, {
label: '医生小店',
value: 3,
}
],
formData: {
storeId: null,
userId: null,
storeLogo: '',//店铺logo
storeName: '',
storeDescription: '',
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
},
supplierImg1: {
id: null,
imageSort: 1,
imageType: 2,
imageUrl: '',
},
supplierImg2: {
id: null,
imageSort: 2,
imageType: 2,
imageUrl: '',
},
supplierImg3: {
id: null,
imageSort: 3,
imageType: 2,
imageUrl: '',
},
drugstoreImg1: {
id: null,
imageSort: 1,
imageType: 2,
imageUrl: '',
},
drugstoreImg2: {
id: null,
imageSort: 2,
imageType: 2,
imageUrl: '',
},
drugstoreImg3: {
id: null,
imageSort: 3,
imageType: 2,
imageUrl: '',
},
showCropper: false,
currentOption: {
offset_x: 120,
offset_y: 185,
width: 160,
height: 120,
cvWidth: 1000,
cvHeight: 800,
uploadType: 1,
cropDialogWidth: '900px',
cropBoxResizable: true,
minCropBoxWidth: 100,
minCropBoxHeight: 100,
aspectRatio: 16/9,
currentPic: '',
},
slide2: {
oriUrl: '', // 原图
},
rules: {
storeName: [
{ required: true, message: "请输入店铺名称", trigger: "blur" },
{
min: 2,
max: 16,
message: "输入长度为2-16的内容，可包含中英文、数字及特殊符号",
trigger: "blur"
},
{ validator: checkProjectStr, trigger: "blur" }
],
storeDescription: [
{ required: false, message: "请输入店铺简介", trigger: "blur" },
{ validator: checkProjectStr, trigger: "blur" }
],
storeType: [
{ required: true, message: "请选择店铺类型", trigger: "blur" },
],
compainName: [
{ required: true, message: "请输入入驻企业名称", trigger: "blur" },
],
phoneNum: [
{ required: true, message: "请输入联系电话", trigger: "blur" },
{validator: checkMobile, trigger: ['change','blur']}
],
docName: [
{ required: true, message: "请输入医生姓名", trigger: "blur" },
],
docPhone: [
{ required: true, message: "请输入联系电话", trigger: "blur" },
{validator: checkMobile, trigger: ['change','blur']}
],
drugstoreName: [
{ required: true, message: "请输入入驻药店名称", trigger: "blur" },
],
drugstorePhone: [
{ required: true, message: "请输入联系电话", trigger: "blur" },
{validator: checkMobile, trigger: ['change','blur']}
],
},
imgMouseOver1: false,
uploadImgMessage1: false,//未上传图片，校验提示语
imgMouseOverP1: false,
imgMouseOverP2: false,
imgMouseOverP3: false,
imgMouseOverC1: false,
imgMouseOverC2: false,
imgMouseOverC3: false,
addItemFlag: true,
enterType: 1,
}
},
watch: {},
created() {
vm = this;
this.formData.storeId = this.$route.query.storeId || null;
this.storeData = this.$route.query.storeData || {};
if (this.formData.storeId) {
this.curmbSecond = '编辑店铺';
this.storeData = JSON.parse(this.storeData);
this.isDisabled = true;
this.initInfo();
this.getStoreInfo();
}else {
this.curmbSecond = '新建店铺';
this.isDisabled = false;
}
},
methods: {
//回显数据处理
getStoreInfo() {
if (!this.storeData || !this.storeData.tradeStore) return;
const { storeLogo, storeName, storeDescription, storeType, storeOwner, storePhone, } = this.storeData.tradeStore;
this.formData.storeLogo = storeLogo;
this.formData.storeName = storeName;
this.formData.storeDescription = storeDescription;
this.formData.storeType = storeType;
if (storeType == 1) {
this.formData.compainName = storeOwner;
this.formData.phoneNum = storePhone;
if (this.storeData.imageList && this.storeData.imageList.length) {
this.storeData.imageList.map(item => {
if (item.imageSort == 1) {
this.supplierImg1 = item;
this.formData.imgUrlP1 = item.imageUrl;
}else if (item.imageSort == 2) {
this.supplierImg2 = item;
this.formData.imgUrlP2 = item.imageUrl;
}else if (item.imageSort == 3) {
this.supplierImg3 = item;
this.formData.imgUrlP3 = item.imageUrl;
}
})
}else {
this.formData.imgUrlP1 = '';
this.formData.imgUrlP2 = '';
this.formData.imgUrlP3 = '';
}
//处理管理员数据
if (this.storeData.adminList && this.storeData.adminList.length) {
this.formData.adminList = this.storeData.adminList
}else {
this.formData.adminList = [{
adminName: '',
adminMobile: '',
id: null,
}]
}
}else if (storeType == 3) {
this.formData.docName = storeOwner;
this.formData.docPhone = storePhone;
}else if (storeType == 2) {
this.formData.drugstoreName = storeOwner;
this.formData.drugstorePhone = storePhone;
if (this.storeData.imageList && this.storeData.imageList.length) {
this.storeData.imageList.map(item => {
if (item.imageSort == 1) {
this.drugstoreImg1 = item;
this.formData.imgUrlC1 = item.imageUrl;
}else if (item.imageSort == 2) {
this.drugstoreImg2 = item;
this.formData.imgUrlC2 = item.imageUrl;
}else if (item.imageSort == 3) {
this.drugstoreImg3 = item;
this.formData.imgUrlC3 = item.imageUrl;
}
})
}else {
this.formData.imgUrlC1 = '';
this.formData.imgUrlC2 = '';
this.formData.imgUrlC3 = '';
}
}
},
initInfo() {
let req = {
storeId: this.formData.storeId
};
queryStore(req).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: Number(this.formData.storeType),
// storeOwner:this.formData.storeOwner,
// storePhone: this.formData.storePhone,
// imageList: this.formData.imageList,
// adminList:this.formData.adminList,
// }
this.formData.storeType = Number(this.formData.storeType);
console.log('提交的数据',this.formData)
saveStore(this.formData).then(res => {
if (res.code == '000000') {
this.$message.success("操作成功");
this.$router.push({
path: '/shop-list'
})
}else {
this.$message.error(res.message);
}
})
}
},
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.supplierImg1.imageUrl = this.formData.imgUrlP1;
this.formData.imageList.push(this.supplierImg1);
}
if (this.formData.imgUrlP2) {
this.supplierImg2.imageUrl = this.formData.imgUrlP2;
this.formData.imageList.push(this.supplierImg2);
}
if (this.formData.imgUrlP3) {
this.supplierImg3.imageUrl = this.formData.imgUrlP3;
this.formData.imageList.push(this.supplierImg3);
}
}else if (type == 3) {
this.formData.storeOwner = this.formData.docName;
this.formData.storePhone = this.formData.docPhone;
this.formData.adminList = [];
}else if (type == 2) {
this.formData.storeOwner = this.formData.drugstoreName;
this.formData.storePhone = this.formData.drugstorePhone;
this.formData.adminList = [];
if (this.formData.imgUrlC1) {
this.drugstoreImg1.imageUrl = this.formData.imgUrlC1;
this.formData.imageList.push(this.drugstoreImg1);
}
if (this.formData.imgUrlC2) {
this.drugstoreImg2.imageUrl = this.formData.imgUrlC2;
this.formData.imageList.push(this.drugstoreImg2);
}
if (this.formData.imgUrlC3) {
this.drugstoreImg3.imageUrl = this.formData.imgUrlC3;
this.formData.imageList.push(this.drugstoreImg3);
}
}
},
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 == 3) {
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 == 2) {
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() {
let formName = "formData";
let submitFlag = false;
if (!this.formData.storeLogo){
this.uploadImgMessage1 = true;
return;
}else {
this.uploadImgMessage1 = false;
}
this.$refs[formName].validate(valid => {
if (valid) {
if (!this.setTypeForData()) {
return;
}
this.resetType(this.formData.storeType);
submitFlag = true;
} else {
submitFlag = false;
}
});
return submitFlag;
},
//上传店铺logo
beforeUploadPic1(file) {
this.currentOption.aspectRatio = 1/1;
this.currentOption.cropBoxResizable = true;
this.currentOption.minCropBoxWidth = 128;
this.currentOption.minCropBoxHeight = 128;
this.currentOption.currentPic = 'storeLogo';
let fileLimit = {
width: 128,
height: 128,
size: 0.2,
sizeText: "200K",
key: "storeLogo",
more: "imgUrl1More",
show: "uploadImgMessage1"
};
this.beforeUploadLogo(file,fileLimit)
//this.beforeUpload1(file, fileLimit);
},
//上传logo add
beforeUploadLogo(file, fileLimit) {
let vm = this;
const isJPG = file.type === "image/jpeg";
const isPNG = file.type === "image/png";
const isLt2M = file.size / 1024 < 200;
if (!isJPG && !isPNG) {
vm.$message.error("仅支持jpeg，png格式");
// return;
}
if (!isLt2M) {
vm.$message.error("图片大小请控制在200kb以内");
return;
}
let _img = new FileReader();
_img.readAsDataURL(file);
_img.onload = function (theFile) {
let image = new Image()
image.src = theFile.target.result
//vm.slide2.oriUrl = theFile.target.result;
image.onload = function () {
let _this = this;
// if (_this.width != fileLimit.width || _this.height != fileLimit.height) {
let l = _this.width/_this.height
if (l != 1) {
vm.$message.error("图片宽高比例请控制在1:1");
return;
} else {
openLoading(vm);
doUpload(vm, file, getFilePath(file, null), "preview4", "progress1", 1).then(function (path) {
closeLoading(vm);
vm.formData[fileLimit.key] = path.fullPath;
vm.formData[fileLimit.more] = {
attachmentName: path.storeName,
attachmentExt: path.ext,
attachmentSize: path.size
};
vm.$message.success("上传成功");
});
}
};
};
},
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: '',
height: '',
size: 3,
sizeText: "3M",
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) {
let vm = this;
const isJPG = file.type === "image/jpeg";
const isPNG = file.type === "image/png";
const isLt2M = file.size / 1024 / 1024 < fileLimit.size;
if (!isJPG && !isPNG) {
vm.$message.error("仅支持jpeg，png格式");
return;
}
if (!isLt2M) {
vm.$message.error(`图片大小不可以超过${fileLimit.sizeText}`);
return;
}
let _img = new FileReader();
_img.readAsDataURL(file);
_img.onload = function (theFile) {
let image = new Image()
image.src = theFile.target.result
vm.slide2.oriUrl = theFile.target.result;
image.onload = function () {
let _this = this;
openLoading(vm);
doUpload(vm, file, getFilePath(file, null), "preview4", "progress1", 1).then(function (path) {
closeLoading(vm);
vm.formData[fileLimit.key] = path.fullPath;
vm.formData[fileLimit.more] = {
attachmentName: path.storeName,
attachmentExt: path.ext,
attachmentSize: path.size
};
vm.$message.success("上传成功");
});
};
};
return isJPG && isLt2M;
},
//上传图片
beforeUpload1(file, fileLimit) {
let vm = this;
const isJPG = file.type === "image/jpeg";
const isPNG = file.type === "image/png";
const isLt2M = file.size / 1024 / 1024 < fileLimit.size;
if (!isJPG && !isPNG) {
vm.$message.error("仅支持jpeg，png格式");
// return;
}
// if (!isLt2M) {
// vm.$message.error("图片大小不符合规范，请根据规范上传图片 ");
// return;
// }
let _img = new FileReader();
_img.readAsDataURL(file);
_img.onload = function (theFile) {
let image = new Image()
image.src = theFile.target.result
vm.slide2.oriUrl = theFile.target.result;
image.onload = function () {
let _this = this;
// if (_this.width != fileLimit.width || _this.height != fileLimit.height) {
if (_this.width < fileLimit.width || _this.height < fileLimit.height) {
vm.$message.error("图片尺寸不符合规范，请根据规范上传图片");
return;
} else if(_this.width > fileLimit.width || _this.height > fileLimit.height){
vm.showCropper = true;
vm.currentOption.cvWidth = _this.width;
vm.currentOption.cvHeight = _this.height;
return;
} else {
openLoading(vm);
doUpload(vm, file, getFilePath(file, null), "preview4", "progress1", 1).then(function (path) {
closeLoading(vm);
if (fileLimit.show == "uploadImgMessage1") {
vm.uploadImgMessage1 = false;
}
vm.formData[fileLimit.key] = path.fullPath;
vm.formData[fileLimit.more] = {
attachmentName: path.storeName,
attachmentExt: path.ext,
attachmentSize: path.size
};
vm.$message.success("上传成功");
});
}
};
};
return isJPG && isLt2M;
},
//删除图片
deleteImg(type) {
vm.formData[type] = "";
const testMouse = new Map()
.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) {
this.showCropper = false;
this.cropData = argument[1]
vm.doUploadQiNiu(argument[2])
argument[3] && argument[3].destroy();
// vm.slide2.oriUrl = "";
},
// 上传七牛
doUploadQiNiu(file){
doUpload(this,file, getFilePath(file,null), 'preview4', 'uploadProgress1', '').then(function (path) {
vm.formData[vm.currentOption.currentPic] = path.fullPath;
vm.$message.success('上传成功');
});
},
//新增管理员
addItem(index) {
if(this.formData.adminList != null && this.formData.adminList.length >= 5){
this.$message.warning("只可新增5位管理员！");
} else {
let item = {
adminName: '',
adminMobile: '',
id: null,
};
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>
<style lang="scss">
.create-shop-wrapper{
.create-shop-content{
background: #fff;
padding: 10px;
.step-content {
overflow: hidden;
height: 60px;
padding: 10px 10px 50px ;
border-bottom: 1px solid #efefef;
.title{
font-size: 13px;
color: #449284;
}
}
}
.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;
}
}
}
}
.required-label .el-form-item__label::before {
content: "*";
color: #f56c6c;
margin-right: 4px;
}
.basic-item-icon {
position: relative;
.require {
position: absolute;
left: 67px;
top: 11px;
color: #f56c6c;
}
.upload-message {
position: absolute;
left: 160px;
top: 105px;
font-size: 12px;
color: #f56c6c;
}
}
.word-num {
font-size: 12px;
color: #999;
padding-top: 5px;
}
.line {
margin-left: 10px;
width: 20px;
}
.flex-upload{
width: 120px;
text-align: center;
.tips{
font-size: 13px;
color: #8C8C8C;
line-height: 24px;
}
}
.bg-uploader {
position: relative;
/*margin-right: 20px;*/
.bg-img {
float: left;
width: 84px;
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 {
float: left;
margin-left: 10px;
margin-top: -10px;
p {
font-size: 12px;
color: #999;
text-align: left;
}
}
}
.el-upload__tip {
position: absolute;
top: -6px;
left: 130px;
}
.span-mt-10{
.edit-img {
width: 20px;
margin-top: 10px;
}
}
.p-tips{
font-size: 13px;
color: #8C8C8C;
line-height: 26px;
margin-bottom: 15px;
}
</style>
src/views/shop/shop-list.vue 0 → 100644
浏览文件 @ 9bc44852
<template>
<div class="yqshop-wrapper">
<bread-crumb :curmbFirst="curmbFirst"></bread-crumb>
<div class="yqshop-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.storeName" 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" :disabled="!canAdd">新建店铺</el-button>
<!--<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">
<template slot-scope="scope">
<span>{{ scope.row.tradeStore.id }}</span>
</template>
</el-table-column>
<el-table-column prop="storeName" label="店铺名称" min-width="100" align="center" show-overflow-tooltip>
<template slot-scope="scope">
<span>{{ scope.row.tradeStore.storeName }}</span>
</template>
</el-table-column>
<el-table-column prop="storeType" label="店铺类型" min-width="100" align="center">
<template slot-scope="scope">
<span>{{ scope.row.tradeStore.storeType | storeTypeFormat}}</span>
</template>
</el-table-column>
<el-table-column prop="storeStatus" label="店铺状态" min-width="100" align="center">
<template slot-scope="scope">
<span>{{ scope.row.tradeStore.storeStatus | statusFormat }}</span>
</template>
</el-table-column>
<el-table-column prop="count" label="已上架商品数" min-width="120" align="center">
<template slot-scope="scope">
<span>{{ scope.row.tradeStore.count }}</span>
</template>
</el-table-column>
<el-table-column prop="createdTime" label="创建时间" min-width="100" align="center">
<template slot-scope="scope">
<!--<span>{{ scope.row.createdTime | liveDateFilter }}</span>-->
<span>{{ scope.row.tradeStore.createdTime }}</span>
</template>
</el-table-column>
<el-table-column label="操作" min-width="230" align="center" fixed="right">
<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>
<el-button @click="orderManage(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";
import { queryStore, queryShopAuth } from '@/utils/shop';
export default {
components: {
BreadCrumb
},
data(){
return{
curmbFirst: '云鹊店铺',
showAllFlag: false,
showNewFlag: false,
searchForm: {
storeName: '',
storeId: '',
storeType: 0,
pageNo: 1,
pageSize: 10,
id: null,
type: null,
},
canAdd: false,
totalRows: 0,
tableData: [
// {
// tradeStore: {
// id: 12,
// storeName: '康爱多',
// storeType: 1,
// storeStatus: 0,
// count: 2,
// createdTime: ''
// }
// }
],
typeList: [
{
label: '供货商',
value: 1,
}, {
label: '小药房',
value: 2,
}, {
label: '医生小店',
value: 3,
}]
}
},
created() {
this.getAddAuth();
this.searchList();
},
methods: {
getAddAuth() {
queryShopAuth().then(res => {
// 0 表示超级管理员,大于0 表示小店或供应商,null 表示非法用户
if (res.data == 0) {
this.canAdd = true;
}
})
},
searchList() {
openLoading(this);
let params = this.searchForm;
if (this.searchForm.id) {
params.storeId = this.searchForm.id;
}else {
params.storeId = '';
}
if (this.searchForm.type) {
params.storeType = this.searchForm.type;
}else {
params.storeType = 0;
}
queryStore(params).then((res) => {
closeLoading(this);
if(res.code == "000000") {
this.tableData = res.data.tradeStore;
this.totalRows = res.data.totalCount;
} else {
this.tableData = [];
}
}).catch((error) => {
this.$message.error("请重试");
})
},
resetForm() {
this.searchForm = {
storeName: '',
storeId: '',
storeType: 0,
pageNo: 1,
pageSize: 10,
id: null,
type: null,
};
this.searchList();
},
//新建店铺
createShop() {
this.$router.push({
path: `/create-shop`
})
},
//店铺管理
shopManage(row) {
this.$router.push({
path: '/goods-manage',
query: {
storeId: row.tradeStore.id,
}
})
},
orderManage(row) {
this.$router.push({
path: '/order-manage',
query: {
storeId: row.tradeStore.id,
}
})
},
//编辑
editShop(row) {
this.$router.push({
path: `/create-shop`,
query:{
storeId: row.tradeStore.id,
storeData: JSON.stringify(row),
}
})
},
handleSizeChange(val) {
this.searchForm.pageSize = val;
this.searchForm.pageNo = 1;
this.searchList();
},
handleNumChange(val) {
this.searchForm.pageNo = val;
this.searchList();
},
},
filters: {
storeTypeFormat: function(value){
if (!value && value != 0) {
return "-";
} else {
let hash = {
1: "供货商",
2: "小药房",
3: "医生小店"
};
return hash[value];
}
},
statusFormat(value) {
if (!value && value != 0) {
return "-";
} else {
let hash = {
0: "下线",
1: "上线",
};
return hash[value];
}
},
},
}
</script>
<style lang="scss">
.yqshop-wrapper{
.yqshop-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>
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或