Skip to content

O
office-web
Commit f451fb0f by xiaohai
Options

添加店员

parent 115521d3
Showing with 561 additions and 61 deletions
src/components/contacts/searchMenu.vue
......@@ -2,6 +2,7 @@
<div class="searh-menu-container">
<div class="p-0-15">
<el-input prefix-icon="el-icon-search" v-model="searchKey" placeholder="姓名/手机号/部门名称" clearable @clear="clearFn" @keyup.enter.native="searchFn"></el-input>
<slot name="buttonBox"></slot>
<el-tree
v-if="!searchResultShow"
class="search-menu"
......@@ -254,8 +255,16 @@
margin-top: 50px;
color: #5b6a80;
}
.slot-button {
text-align: center;
margin-top: 20px;
.el-icon-question {
color: #C0C4CC;
cursor: pointer;
}
}
.search-menu {
margin-top: 30px;
margin-top: 20px;
color: #606266;
font-size: 14px;
background: #EEF1F8;
......
src/components/contacts/storeFrame/addBrand.vue 0 → 100644
<template>
<div>
<el-dialog
title="新建品牌"
width="422px"
:visible.sync="dialogVisible">
<p>请输入品牌名称</p>
<el-input v-model="brandName" class="m-t-20"></el-input>
<p class="danger-tip">
<i class="el-icon-info"></i>
下列两项选择后将无法修改，请谨慎选择
</p>
<p class="m-t-20">请选择所要关联gic的品牌</p>
<el-select v-model="brand" placeholder="请选择" class="select-brand select-div">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<p class="m-t-20">首次同步主题设置</p>
<el-select v-model="brand" placeholder="请选择" class="select-type select-div">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
<div class="btn-box t-rt m-t-20 m-b-10">
<el-button @click="dialogVisible = false;">取消</el-button>
<el-button type="primary">确定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
export default {
name: "add-brand-dialog",
data() {
return {
dialogVisible: false,
brandName: "",
options: [
{
value: '选项1',
label: '黄金糕'
},
{
value: '选项2',
label: '双皮奶'
},
{
value: '选项3',
label: '蚵仔煎'
},
{
value: '选项4',
label: '龙须面'
},
{
value: '选项5',
label: '北京烤鸭'
}
],
brand: ""
};
}
};
</script>
<style lang="scss">
.danger-tip {
width:100%;
height:36px;
line-height: 36px;
background:rgba(253,246,236,1);
border-radius:4px;
padding: 0 14px;
box-sizing: border-box;
margin-top: 24px;
color: #E6A23C;
font-size: 13px;
.el-icon-info {
font-size: 16px;
margin-right: 7px;
vertical-align: middle;
}
}
.select-div {
width: 100%;
margin-top: 20px;
}
</style>
src/components/contacts/storeFrame/storeInfo.vue
......@@ -6,8 +6,8 @@
class="store-info-form info-form"
label-width="90px">
<el-form-item label="门店名称" prop="name">
<el-input v-model="storeInfo.name">
<template slot="suffix">{{storeInfo.name.length}}/20</template>
<el-input v-model="storeInfo.storeName">
<template slot="suffix">{{storeInfo.storeName.length}}/20</template>
</el-input>
</el-form-item>
<el-form-item label="所属分组" prop="group">
......@@ -16,22 +16,12 @@
</el-input>
</el-form-item>
<el-form-item label="门店图片" prop="imageUrls">
<ul class="img-list">
<li class="img-li" v-if="storeInfo.imageUrls.split(',').length == 0" v-for="(img, index) in storeInfo.imageUrls.split(',')" :key="index + '_' + img ">
<img :src="img">
<i class="el-icon-circle-close J_del-img"></i>
</li>
<li class="img-li J_add-img">
<i class="el-icon-plus"></i>
<p class="tip">图片规格640*340像素</p>
</li>
</ul>
<div class="member-upload-image">
<vue-gic-upload-image
projectName="gic-web"
wxFlag="0"
actionUrl="/api-plug/upload-img"
:imageList="storeInfo.imageUrls.split(',')"
:imageList="(storeInfo.imageUrls || '').split(',')"
:limitW="500"
:limitH="500"
:maxImageLength="5"
......@@ -78,12 +68,12 @@
<el-form-item label="门店地址">
<vue-office-area :areaOptions="areaOptions" @selected="selected" projectName="haoban-web" postUrl="/api-admin/dict-district-list"></vue-office-area>
<el-input v-model="areaOptions.postAddress">
<template slot="suffix">{{storeInfo.postAddress.length}}/50</template>
<template slot="suffix">{{(storeInfo.postAddress || "").length}}/50</template>
</el-input>
</el-form-item>
<el-form-item label="GPS坐标">
<el-input v-model="location" class="m-r-10"></el-input>
<a href="http://m.gpsspg.com/maps.htm" class="a-href">经纬度测试工具</a>
<a href="http://m.gpsspg.com/maps.htm" class="a-href" target="_blank">经纬度测试工具</a>
</el-form-item>
<el-form-item>
<template slot="label">
......@@ -91,7 +81,7 @@
<i class="el-icon-question" style="color:#C0C4CC;"></i>
</template>
<el-input v-model="storeInfo.storeCode">
<template slot="suffix">{{storeInfo.storeCode.length}}/20</template>
<template slot="suffix">{{(storeInfo.storeCode || "").length}}/20</template>
</el-input>
</el-form-item>
</el-form>
......@@ -103,7 +93,7 @@
label-width="90px">
<el-form-item label="店长姓名" prop="name">
<el-input v-model="storeInfo.managerName">
<template slot="suffix">{{storeInfo.managerName.length}}/10</template>
<template slot="suffix">{{(storeInfo.managerName || "").length}}/10</template>
</el-input>
</el-form-item>
<el-form-item label="手机号码" prop="phone">
......@@ -117,7 +107,7 @@
</el-form-item>
<el-form-item label="店长代码">
<el-input v-model="storeInfo.managerCode">
<template slot="suffix">{{storeInfo.managerCode.length}}/20</template>
<template slot="suffix">{{(storeInfo.managerCode || "").length}}/20</template>
</el-input>
</el-form-item>
</el-form>
......@@ -129,7 +119,7 @@
label-width="90px">
<el-form-item label="特色服务">
<el-input type="textarea" :rows="2" v-model="storeInfo.specialService"></el-input>
<p class="counter t-rt c-909399">{{storeInfo.specialService.length}}/20</p>
<p class="counter t-rt c-909399">{{(storeInfo.specialService || "").length}}/20</p>
</el-form-item>
<el-form-item label="人均消费">
<el-input v-model="storeInfo.personCost">
......@@ -138,11 +128,11 @@
</el-form-item>
<el-form-item label="推荐商品">
<el-input type="textarea" :rows="2" v-model="storeInfo.recommendGoods"></el-input>
<p class="counter t-rt c-909399">{{storeInfo.recommendGoods.length}}/100</p>
<p class="counter t-rt c-909399">{{(storeInfo.recommendGoods || "").length}}/100</p>
</el-form-item>
<el-form-item label="品牌介绍">
<el-input type="textarea" :rows="2" v-model="storeInfo.brandDes"></el-input>
<p class="counter t-rt c-909399">{{storeInfo.recommendGoods.length}}/200</p>
<p class="counter t-rt c-909399">{{(storeInfo.recommendGoods || "").length}}/200</p>
</el-form-item>
</el-form>
</div>
......@@ -151,39 +141,13 @@
<script>
export default {
name: "storeInfo",
data() {
return {
storeInfo: {
name: "",
groupChainName: "",
group: "",
imageUrls: "",
phoneNumber: 18758198024,
openTime: "08:00",
closeTime: "18:00",
storeCode: "code222",
managerName: "翠花",
storeType: 0,
managerPhoneNumber: 13777800255,
longitude: "40.5585354733",
latitude: "106.284122062",
managerSex: "女",
managerCode: "m220",
specialService: "脚底按摩了解一下",
personCost: 1000,
recommendGoods: "瓜子，花生，马应龙",
brandDes: "are you ok",
areaChainName: "河北省/邯郸市/成安县",
postAddress: "河源",
provinceId: "130000",
cityId: "130300",
countyId: "130302"
},
opts: {
selectableRange: '18:30 - 20:30',
format: 'HH:mm'
props: {
storeInfo: {
type: Object,
default() {
return {};
}
};
}
},
methods: {
selected(val) {
......@@ -216,6 +180,8 @@ export default {
<style lang="scss">
.store-info {
flex: 1;
height: 690px;
overflow: auto;
.info-cell {
margin-bottom: 24px;
background: #fff;
......
src/components/contacts/storeFrame/storeView.vue
......@@ -42,7 +42,7 @@
></el-table-column>
<el-table-column
label="所属分组"
prop="departName"
prop="departmentName"
:show-overflow-tooltip="true"
></el-table-column>
<el-table-column
......
src/router/index.js
......@@ -55,6 +55,11 @@ export const constantRouterMap = [
component: _import('contacts','addDepartment')
},
{
path: '/addClerk',
name: '添加店员',
component: _import('contacts','addClerk')
},
{
path: '/storeFrame',
name: '门店架构',
component: _import('contacts','storeFrame')
......
src/views/contacts/addClerk.vue 0 → 100644
<template>
<div class="add-clerk-page"></div>
</template>
<script>
export default {
name: "add-clerk-page"
}
</script>
<style lang="scss">
</style>
src/views/contacts/storeFrame.vue
......@@ -8,9 +8,21 @@
@handleTreeSelection="handleTreeSelection"
@handleStoreSelection="handleStoreSelection"
@handleEmployeeSelection="handleEmployeeSelection">
<template slot="buttonBox">
<div class="slot-button">
<el-button @click="addBrand" :disabled="disableBtn">新建品牌</el-button>
<el-popover
placement="right"
width="550"
content="若您的企业为集团企业，可通过新建品牌，不同品牌的门店可以创建在不同的品牌下面"
trigger="hover">
<i class="el-icon-question" slot="reference"></i>
</el-popover>
</div>
</template>
</search-menu>
<employee-info v-if="showEmployee == 'employee'" :info="selectedEmployee"></employee-info>
<store-info v-else-if="showEmployee == 'store'"></store-info>
<store-info v-else-if="showEmployee == 'store'" :storeInfo="storeInfo"></store-info>
<div class="sf-right-container"
v-else
v-loading="loading">
......@@ -48,6 +60,7 @@
</el-pagination>
</div>
</div>
<add-brand ref="add_brand"></add-brand>
</div>
</template>
<script>
......@@ -55,6 +68,7 @@ import searchMenu from "components/contacts/searchMenu";
import storeView from "components/contacts/storeFrame/storeView";
import clerkView from "components/contacts/storeFrame/clerkView";
import storeInfo from "components/contacts/storeFrame/storeInfo";
import addBrand from "components/contacts/storeFrame/addBrand";
import employeeInfo from "components/contacts/employeeInfo";
import { getRequest, postRequest, postJsonRequest } from '@/api/api';
export default {
......@@ -64,7 +78,8 @@ export default {
storeView,
clerkView,
employeeInfo,
storeInfo
storeInfo,
addBrand
},
data() {
return {
......@@ -81,8 +96,10 @@ export default {
pageNumber: 1,
storeList: [],
tableView: 1,
showEmployee: 'store',
selectedEmployee: {}
showEmployee: 'node',
selectedEmployee: {},
storeInfo: {},
disableBtn: true
};
},
methods: {
......@@ -107,10 +124,18 @@ export default {
this.showEmployee = showEmployee;
},
/**
* 新建品牌
*/
addBrand() {
this.$refs.add_brand.dialogVisible = true;
},
/**
* 树形搜索结果选门店处理
*/
handleStoreSelection(store) {
console.log(store);
this.storeInfo = store;
this.showEmployee = "store";
},
handleSizeChange(size) {
this.pageSize = size;
......@@ -186,6 +211,9 @@ export default {
},
beforeMount() {
this.getGroupData();
},
mounted() {
this.disableBtn = false;
}
};
</script>
......
static/css/public.css
......@@ -341,6 +341,9 @@ input:focus {
.m-t-15 {
margin-top: 15px;
}
.m-t-20 {
margin-top: 20px;
}
.m-t-30 {
margin-top: 30px;
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment