Commit 27477f5d authored by xd's avatar xd

按照原型修改

parent d804dc17
...@@ -22,7 +22,7 @@ div::-webkit-scrollbar-thumb:hover{ ...@@ -22,7 +22,7 @@ div::-webkit-scrollbar-thumb:hover{
background: #555; background: #555;
} }
div::-webkit-scrollbar-corner{ div::-webkit-scrollbar-corner{
background: #179a16; // background: #179a16;
} }
.el-table.list{ .el-table.list{
.el-button--text{ .el-button--text{
......
...@@ -29,14 +29,6 @@ ...@@ -29,14 +29,6 @@
placeholder="请输入柜组名称" placeholder="请输入柜组名称"
/> />
</el-form-item> </el-form-item>
<el-form-item label="柜组编号:">
<el-input
size="small"
v-model="formData.code"
style="width:240px"
placeholder="请输入柜组编号"
/>
</el-form-item>
<el-form-item label="柜组负责人:" prop="people"> <el-form-item label="柜组负责人:" prop="people">
<el-select <el-select
size="small" size="small"
...@@ -52,7 +44,15 @@ ...@@ -52,7 +44,15 @@
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="柜组编号:"> <el-form-item label="柜组编号:" prop="code">
<el-input
size="small"
v-model="formData.code"
style="width:240px"
placeholder="请输入柜组编号"
/>
</el-form-item>
<el-form-item label="所在区域:" prop="area">
<el-input <el-input
size="small" size="small"
v-model="formData.area" v-model="formData.area"
...@@ -83,8 +83,13 @@ ...@@ -83,8 +83,13 @@
</div> </div>
</div> </div>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="handleCancel('addCounter')" size="small">取 消</el-button> <el-button @click="handleCancel('addCounter')" size="small"
<el-button type="primary" @click="handleFinish('addCounter')" size="small" >取 消</el-button
>
<el-button
type="primary"
@click="handleFinish('addCounter')"
size="small"
>确 定</el-button >确 定</el-button
> >
</span> </span>
...@@ -104,7 +109,16 @@ export default { ...@@ -104,7 +109,16 @@ export default {
}); });
} }
return data; return data;
}; }
// 中英文验证规则
const nameValidate = (rule, value, callback) => {
let reg = /^[a-zA-Z\u4e00-\u9fa5]+$/
if (!reg.test(value)) {
callback(new Error('含有非法字符(只能输入字母、汉字)!'))
} else {
callback()
}
}
return { return {
counterDialog: false, counterDialog: false,
data: generateData(), data: generateData(),
...@@ -133,10 +147,20 @@ export default { ...@@ -133,10 +147,20 @@ export default {
} }
], ],
rules: { rules: {
name: [{ required: true, message: "请输入柜组名称", trigger: "blur" }], name: [{ required: true, message: "请输入柜组名称", trigger: "blur" },
{ max: 50, message: '长度在50个字符以内', trigger: 'blur' },
{ validator: nameValidate, trigger: "blur" }],
people: [ people: [
{ required: true, message: "请选择活动负责人", trigger: "change" } { required: true, message: "请选择活动负责人", trigger: "change" }
] ],
code: [{ required: true, message: "请输入柜组编号", trigger: "blur" },
{ max: 50, message: '长度在50个字符以内', trigger: 'blur' },
{ validator: nameValidate, trigger: "blur" }],
area: [{ required: true, message: "请输入所在区域", trigger: "blur" },
{ max: 50, message: '长度在50个字符以内', trigger: 'blur' },
{ validator: nameValidate, trigger: "blur" }]
} }
}; };
}, },
......
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
ref="addStore" ref="addStore"
:rules="rules" :rules="rules"
> >
<el-form-item label="柜组名称:" prop="name"> <el-form-item label="门店名称:" prop="name">
<el-input <el-input
size="small" size="small"
v-model="formData.name" v-model="formData.name"
...@@ -29,7 +29,7 @@ ...@@ -29,7 +29,7 @@
placeholder="请输入门店名称" placeholder="请输入门店名称"
/> />
</el-form-item> </el-form-item>
<el-form-item label="门店类型:"> <el-form-item label="门店类型:" prop="type">
<el-select <el-select
size="small" size="small"
v-model="formData.type" v-model="formData.type"
...@@ -37,44 +37,44 @@ ...@@ -37,44 +37,44 @@
style="width:240px" style="width:240px"
> >
<el-option <el-option
v-for="item in personList" v-for="item in storeType"
:key="item.id" :key="item.id"
:label="item.name" :label="item.name"
:value="item.id" :value="item.id"
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="所属柜组:" prop="counter"> <el-form-item label="门店负责人:" prop="people">
<el-select <el-select
size="small" size="small"
v-model="formData.counter" v-model="formData.people"
placeholder="请选择所属柜组" placeholder="请选择门店负责人"
style="width:240px" style="width:240px"
> >
<el-option <el-option
v-for="item in counter" v-for="item in personList"
:key="item.id" :key="item.id"
:label="item.name" :label="item.name"
:value="item.id" :value="item.id"
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="柜组负责人:" prop="people"> <el-form-item label="所属柜组:" prop="counter">
<el-select <el-select
size="small" size="small"
v-model="formData.people" v-model="formData.counter"
placeholder="请选择柜组负责人" placeholder="请选择所属柜组"
style="width:240px" style="width:240px"
> >
<el-option <el-option
v-for="item in personList" v-for="item in counter"
:key="item.id" :key="item.id"
:label="item.name" :label="item.name"
:value="item.id" :value="item.id"
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="门牌号:"> <el-form-item label="门牌号:" prop="number">
<el-input <el-input
size="small" size="small"
v-model="formData.number" v-model="formData.number"
...@@ -82,7 +82,7 @@ ...@@ -82,7 +82,7 @@
placeholder="请输入门牌号" placeholder="请输入门牌号"
/> />
</el-form-item> </el-form-item>
<el-form-item label="位置:"> <el-form-item label="位置:" prop="area">
<el-input <el-input
size="small" size="small"
v-model="formData.area" v-model="formData.area"
...@@ -135,6 +135,15 @@ export default { ...@@ -135,6 +135,15 @@ export default {
} }
return data; return data;
}; };
// 中英文验证规则
const nameValidate = (rule, value, callback) => {
let reg = /^[a-zA-Z\u4e00-\u9fa5]+$/
if (!reg.test(value)) {
callback(new Error('含有非法字符(只能输入字母、汉字)!'))
} else {
callback()
}
}
return { return {
addStoreDialog: false, addStoreDialog: false,
data: generateData(), data: generateData(),
...@@ -147,10 +156,20 @@ export default { ...@@ -147,10 +156,20 @@ export default {
name: "", name: "",
code: "", code: "",
people: "", people: "",
type: "", type: "1",
number: "", number: "",
area: "" area: ""
}, },
storeType: [
{
id: "1",
name: "普通门店"
},
{
id: "2",
name: "专柜"
}
],
personList: [ personList: [
{ {
id: "1", id: "1",
...@@ -172,13 +191,24 @@ export default { ...@@ -172,13 +191,24 @@ export default {
} }
], ],
rules: { rules: {
name: [{ required: true, message: "请输入柜组名称", trigger: "blur" }], name: [{ required: true, message: "请输入柜组名称", trigger: "blur" },
{ validator: nameValidate, trigger: "blur" },
               {  max: 50, message: '长度在50个字符以内', trigger: 'blur' }],
people: [ people: [
{ required: true, message: "请选择活动负责人", trigger: "change" } { required: true, message: "请选择门店负责人", trigger: "change" }
], ],
 type: [
          { required: true, message: "请选择门店类型", trigger: "change" }
        ],
counter: [ counter: [
{ required: true, message: "请选择所属柜组", trigger: "change" } { required: true, message: "请选择所属柜组", trigger: "change" }
] ],
number: [
          {  max: 50, message: '长度在50个字符以内', trigger: 'blur' },
        ],
        area: [
          {  max: 50, message: '长度在100个字符以内', trigger: 'blur' },
        ]
} }
}; };
}, },
...@@ -245,7 +275,7 @@ export default { ...@@ -245,7 +275,7 @@ export default {
padding: 0; padding: 0;
} }
.ct >>> .el-transfer-panel { .ct >>> .el-transfer-panel {
width: 250px; width: 180px;
} }
.circle { .circle {
width: 30px; width: 30px;
......
...@@ -15,17 +15,10 @@ ...@@ -15,17 +15,10 @@
:header-cell-style="setListsHeadStyle" :header-cell-style="setListsHeadStyle"
> >
<el-table-column label="序号" width="70" type="index" align="center"></el-table-column> <el-table-column label="序号" width="70" type="index" align="center"></el-table-column>
<el-table-column
prop="taskName"
label="门店名称"
align="center"
></el-table-column>
<el-table-column <el-table-column
prop="taskType" prop="taskType"
label="姓名" label="姓名"
align="center" align="center"
width="120"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="bar" prop="bar"
......
...@@ -19,7 +19,7 @@ ...@@ -19,7 +19,7 @@
label-width="auto" label-width="auto"
disabled disabled
> >
<el-form-item label="柜组名称:"> <el-form-item label="门店名称:">
<el-input <el-input
size="small" size="small"
v-model="formData.name" v-model="formData.name"
...@@ -42,50 +42,50 @@ ...@@ -42,50 +42,50 @@
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="所属柜组:"> <el-form-item label="门店负责人:">
<el-select <el-select
size="small" size="small"
v-model="formData.counter" v-model="formData.people"
placeholder="请选择所属柜组" placeholder="请选择柜组负责人"
style="width:240px" style="width:240px"
> >
<el-option <el-option
v-for="item in counter" v-for="item in personList"
:key="item.id" :key="item.id"
:label="item.name" :label="item.name"
:value="item.id" :value="item.id"
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="柜组负责人:"> <el-form-item label="所属柜组:">
<el-select <el-select
size="small" size="small"
v-model="formData.people" v-model="formData.counter"
placeholder="请选择柜组负责人" placeholder="请选择所属柜组"
style="width:240px" style="width:240px"
> >
<el-option <el-option
v-for="item in personList" v-for="item in counter"
:key="item.id" :key="item.id"
:label="item.name" :label="item.name"
:value="item.id" :value="item.id"
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="门牌号:"> <el-form-item label="位置:">
<el-input <el-input
size="small" size="small"
v-model="formData.number" v-model="formData.area"
style="width:240px" style="width:240px"
placeholder="请输入门牌号" placeholder="请输入位置"
/> />
</el-form-item> </el-form-item>
<el-form-item label="位置:"> <el-form-item label="门牌号:">
<el-input <el-input
size="small" size="small"
v-model="formData.area" v-model="formData.number"
style="width:240px" style="width:240px"
placeholder="请输入位置" placeholder="请输入门牌号"
/> />
</el-form-item> </el-form-item>
<div class="tb"> <div class="tb">
...@@ -125,6 +125,14 @@ ...@@ -125,6 +125,14 @@
<script> <script>
export default { export default {
data() { data() {
const nameValidate = (rule, value, callback) => {
let reg = /^[a-zA-Z\u4e00-\u9fa5]+$/
if (!reg.test(value)) {
callback(new Error('含有非法字符(只能输入字母、汉字)!'))
} else {
callback()
}
}
return { return {
formData: { formData: {
name: "", name: "",
......
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
<el-table-column type="selection" width="60"></el-table-column> <el-table-column type="selection" width="60"></el-table-column>
<el-table-column <el-table-column
prop="taskName" prop="taskName"
label="柜组名称" label="柜组"
align="center" align="center"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
...@@ -56,7 +56,7 @@ ...@@ -56,7 +56,7 @@
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
prop="bar" prop="bar"
label="所区域" label="所区域"
align="center" align="center"
width="120" width="120"
></el-table-column> ></el-table-column>
......
...@@ -25,7 +25,7 @@ ...@@ -25,7 +25,7 @@
> >
<span class="custom-tree-node" slot-scope="{ node, data }"> <span class="custom-tree-node" slot-scope="{ node, data }">
<span>{{ node.label }}</span> <span>{{ node.label }}</span>
<span style="margin-left:20px;"> <!-- <span style="margin-left:20px;">
<d2-icon-svg <d2-icon-svg
name="edit" name="edit"
class="icon" class="icon"
...@@ -36,6 +36,14 @@ ...@@ -36,6 +36,14 @@
class="icon" class="icon"
@click="() => remove(node, data)" @click="() => remove(node, data)"
/> />
</span> -->
<span style="margin-left:8px;" class="btn">
<el-button type="text" size="mini" @click="() => edit(data)">
<i class="el-icon-edit"></i>
</el-button>
<el-button type="text" size="mini" @click="() => remove(node, data)">
<i class="el-icon-remove-outline"></i>
</el-button>
</span> </span>
</span> </span>
</el-tree> </el-tree>
...@@ -43,7 +51,7 @@ ...@@ -43,7 +51,7 @@
</div> </div>
</div> </div>
<div class="end"> <div class="end">
<span class="add-l" @click="addCounter">添加柜组</span> <!-- <span class="add-l" @click="addCounter">添加柜组</span> -->
<span class="add-r" @click="addStore">添加门店/专柜</span> <span class="add-r" @click="addStore">添加门店/专柜</span>
</div> </div>
</div> </div>
...@@ -52,14 +60,14 @@ ...@@ -52,14 +60,14 @@
<div class="top">三号柜组(共18人)</div> <div class="top">三号柜组(共18人)</div>
<div class="searchs"> <div class="searchs">
<div class="buttons"> <div class="buttons">
<el-button class="button buttondark" size="small" @click="handleMove"
>移动</el-button
>
<el-button <el-button
class="button buttonlight" class="button buttonlight"
size="small" size="small"
@click="synchronismMember" @click="synchronismMember"
>同步成员</el-button >同步记录</el-button
>
<el-button class="button buttondark" size="small" @click="handleMove"
>移动</el-button
> >
</div> </div>
<!-- 搜索区 --> <!-- 搜索区 -->
...@@ -78,6 +86,7 @@ ...@@ -78,6 +86,7 @@
/> />
</el-form-item> </el-form-item>
<el-button class="button buttondark" size="small">搜索</el-button> <el-button class="button buttondark" size="small">搜索</el-button>
</el-form> </el-form>
</div> </div>
<el-table <el-table
...@@ -128,6 +137,13 @@ ...@@ -128,6 +137,13 @@
align="center" align="center"
width="120" width="120"
></el-table-column> ></el-table-column>
<el-table-column label="操作" align="center" fixed="right" width="120">
<template slot-scope="scope">
<el-button class="btn" @click="handleShopowner(scope.row)" size="small"
>设为店长</el-button
>
</template>
</el-table-column>
</el-table> </el-table>
<div class="fy"> <div class="fy">
<el-pagination <el-pagination
...@@ -139,8 +155,6 @@ ...@@ -139,8 +155,6 @@
> >
</el-pagination> </el-pagination>
</div> </div>
<!-- </div> -->
</div> </div>
<move-dialog <move-dialog
v-if="moveDialogShow" v-if="moveDialogShow"
...@@ -148,14 +162,15 @@ ...@@ -148,14 +162,15 @@
@handleCancel="moveDialogShow = false" @handleCancel="moveDialogShow = false"
@handleFinish="removeFinish" @handleFinish="removeFinish"
></move-dialog> ></move-dialog>
<add-counter ref="addCounter"></add-counter>
<add-store ref="addStore"></add-store> <add-store ref="addStore"></add-store>
<!-- <add-counter ref="addCounter"></add-counter> -->
</div> </div>
</template> </template>
<script> <script>
import MoveDialog from "./components/move"; import MoveDialog from "./components/move";
import AddCounter from "./components/addCounter"; // import AddCounter from "./components/addCounter";
import AddStore from "./components/addStore"; import AddStore from "./components/addStore";
import { getMailList } from "@/api/jinjian" import { getMailList } from "@/api/jinjian"
export default { export default {
...@@ -334,7 +349,7 @@ export default { ...@@ -334,7 +349,7 @@ export default {
}, },
components: { components: {
MoveDialog, MoveDialog,
AddCounter, // AddCounter,
AddStore AddStore
}, },
created() { created() {
...@@ -348,12 +363,19 @@ export default { ...@@ -348,12 +363,19 @@ export default {
} }
data.children.push(newChild); data.children.push(newChild);
}, },
edit(data) {}, edit(data) {
remove(node, data) { console.log(1111);
const parent = node.parent;
const children = parent.data.children || parent.data; },
const index = children.findIndex(d => d.id === data.id); remove(data) {
children.splice(index, 1); console.log("删除");
this.$confirm('门店下包含成员,删除后所有成员将被移动到“未分组”列表,是否确认继续删除?', {
}).then(() => {
this.$message.success("删除成功")
}).catch(() => {
this.$message.info("取消删除")
});
}, },
listPick() {}, listPick() {},
testButtonClick() {}, testButtonClick() {},
...@@ -371,10 +393,12 @@ export default { ...@@ -371,10 +393,12 @@ export default {
this.moveDialogShow = false; this.moveDialogShow = false;
}, },
handleCurrentChange() {}, handleCurrentChange() {},
addCounter() { /* addCounter() {
this.$refs.addCounter.counterDialog = true; this.$refs.addCounter.counterDialog = true;
}, }, */
addStore() { addStore() {
console.log("触发没");
this.$refs.addStore.addStoreDialog = true; this.$refs.addStore.addStoreDialog = true;
}, },
getMailList() { getMailList() {
...@@ -385,12 +409,18 @@ export default { ...@@ -385,12 +409,18 @@ export default {
console.log(res,"通讯录表格数据"); console.log(res,"通讯录表格数据");
}) })
},
handleShopowner() {
} }
} }
}; };
</script> </script>
<style scoped> <style scoped>
.btn >>> .el-button + .el-button {
margin-left: 5px;
}
.mail { .mail {
display: flex; display: flex;
width: 100%; width: 100%;
...@@ -505,12 +535,7 @@ export default { ...@@ -505,12 +535,7 @@ export default {
flex-direction: column; flex-direction: column;
justify-content: flex-start; justify-content: flex-start;
} }
.searchzone {
height: 40px;
width: auto;
min-width: 654px;
text-align: right;
}
.lists { .lists {
height: auto; height: auto;
min-height: 70%; min-height: 70%;
......
...@@ -32,7 +32,7 @@ const router = new VueRouter({ ...@@ -32,7 +32,7 @@ const router = new VueRouter({
* 路由拦截 * 路由拦截
* 权限验证 * 权限验证
*/ */
router.beforeEach(async (to, from, next) => { /* router.beforeEach(async (to, from, next) => {
// 确认已经加载多标签页数据 https://github.com/d2-projects/d2-admin/issues/201 // 确认已经加载多标签页数据 https://github.com/d2-projects/d2-admin/issues/201
await store.dispatch('d2admin/page/isLoaded') await store.dispatch('d2admin/page/isLoaded')
// 确认已经加载组件尺寸设置 https://github.com/d2-projects/d2-admin/issues/198 // 确认已经加载组件尺寸设置 https://github.com/d2-projects/d2-admin/issues/198
...@@ -64,7 +64,7 @@ router.beforeEach(async (to, from, next) => { ...@@ -64,7 +64,7 @@ router.beforeEach(async (to, from, next) => {
// 不需要身份校验 直接通过 // 不需要身份校验 直接通过
next() next()
} }
}) }) */
router.afterEach(to => { router.afterEach(to => {
// 进度条 // 进度条
......
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