Commit e575411d authored by xd's avatar xd

修改

parent a3237c02
...@@ -2,7 +2,6 @@ ...@@ -2,7 +2,6 @@
<d2-container class="ct"> <d2-container class="ct">
<template slot="header">header</template> <template slot="header">header</template>
<div class="test"> <div class="test">
<!-- <Left-Nav style="min-height:100%;"></Left-Nav> -->
<div class="tac"> <div class="tac">
<el-menu <el-menu
:default-active="index" :default-active="index"
...@@ -72,7 +71,7 @@ export default { ...@@ -72,7 +71,7 @@ export default {
padding: 0 !important; padding: 0 !important;
} }
.tac { .tac {
width:248px; width:180px;
height: 100%; height: 100%;
/* box-shadow: 0px 4px 0px 0px rgba(221, 221, 221, 1); */ /* box-shadow: 0px 4px 0px 0px rgba(221, 221, 221, 1); */
} }
......
...@@ -10,7 +10,9 @@ ...@@ -10,7 +10,9 @@
</div> </div>
<div> <div>
<span><d2-icon-svg name="edit" class="icon"/></span> <span><d2-icon-svg name="edit" class="icon"/></span>
<span style="margin-left:8px;"><d2-icon-svg name="delete" class="icon"/></span> <span style="margin-left:8px;"
><d2-icon-svg name="delete" class="icon"
/></span>
</div> </div>
</div> </div>
<div class="ty" style="margin:15px 0;"> <div class="ty" style="margin:15px 0;">
...@@ -20,7 +22,9 @@ ...@@ -20,7 +22,9 @@
</div> </div>
<div> <div>
<span><d2-icon-svg name="edit" class="icon"/></span> <span><d2-icon-svg name="edit" class="icon"/></span>
<span style="margin-left:8px;"><d2-icon-svg name="delete" class="icon"/></span> <span style="margin-left:8px;"
><d2-icon-svg name="delete" class="icon"
/></span>
</div> </div>
</div> </div>
<el-tree <el-tree
...@@ -30,24 +34,127 @@ ...@@ -30,24 +34,127 @@
default-expand-all default-expand-all
:expand-on-click-node="false" :expand-on-click-node="false"
> >
<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 name="edit" class="icon" @click="() => edit(data)"/> <d2-icon-svg name="edit" class="icon" @click="() => edit(data)" />
<d2-icon-svg name="delete" class="icon" @click="() => remove(node, data)"/> <d2-icon-svg
name="delete"
class="icon"
@click="() => remove(node, data)"
/>
</span> </span>
</span> </span>
</el-tree> </el-tree>
</div> </div>
<div class="end">
<span class="add-l">添加柜组</span>
<span class="add-r">添加部门</span>
</div>
</div> </div>
<div class="right"> <div class="right">
<div class="main">
<div class="searchs">
<div class="buttons">
<el-button class="button buttonlight" size="small"
>同步成员</el-button
>
<el-button class="button buttondark" size="small"
>移动 </el-button
>
</div>
<!-- 搜索区 -->
<el-form
class="searchzone"
:inline="true"
:model="data.search"
label-width="auto"
>
<!-- 关键字 -->
<!-- <el-col :span="6"> -->
<el-form-item label="关键词">
<el-input
size="small"
v-model="data.search.keys"
style="width:160px"
placeholder="请输入关键词"
/>
</el-form-item>
<!-- </el-col> -->
<!-- </el-row> -->
<el-button class="button buttondark" size="small"
>搜索</el-button
>
</el-form>
</div>
<div class="lists">
<el-table
stripe
class="list"
ref="multipleTable"
:data="list.main"
tooltip-effect="dark"
style="width: 100%"
@selection-change="listPick"
:header-cell-style="setListsHeadStyle"
>
<el-table-column type="selection" width="60"></el-table-column>
<el-table-column
prop="taskName"
label="姓名"
align="center"
width="200"
></el-table-column>
<el-table-column
prop="taskType"
label="部门"
align="center"
width="120"
></el-table-column>
<el-table-column
prop="taskType"
label="角色"
align="center"
width="120"
></el-table-column>
<el-table-column
prop="bar"
label="手机号"
align="center"
width="120"
></el-table-column>
<el-table-column label="同步时间" width="178" align="center">
<template slot-scope="scope">{{ scope.row.sendDate }}</template>
</el-table-column>
<el-table-column
prop="bar"
label="备注"
align="center"
width="120"
></el-table-column>
</el-table>
</div>
<div class="pages">
<el-pagination
@size-change="pagesSizeChange"
@current-change="pagesNowPageChange"
:current-page="currentPage4"
:page-sizes="[100, 200, 300, 400]"
:page-size="100"
layout="prev, pager, next, sizes, jumper"
:total="400"
></el-pagination>
</div>
</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
export default { export default {
data () { data() {
const data = [ const data = [
{ {
id: 1, id: 1,
...@@ -99,40 +206,136 @@ export default { ...@@ -99,40 +206,136 @@ export default {
} }
]; ];
return { return {
data: JSON.parse(JSON.stringify(data)) data: JSON.parse(JSON.stringify(data)),
list: {
main: [
{
id: "1001",
taskName: "2019年男装销售任务",
taskType: "拉新",
bar: "男装",
taskContent: "任务内容任务内容任务内容...",
sendDate: "2019/02/08"
},
{
id: "1002",
taskName: "2019年男装销售任务",
taskType: "拉新",
bar: "男装",
taskContent: "任务内容任务内容任务内容...",
sendDate: "2019/02/08"
},
{
id: "1003",
taskName: "2019年男装销售任务",
taskType: "拉新",
bar: "男装",
taskContent: "任务内容任务内容任务内容...",
sendDate: "2019/02/08"
}
],
search: {
bar: [
{
id: "1",
name: "全部"
},
{
id: "2",
name: "测试"
}
],
taskType: [
{
id: "1",
name: "全部"
},
{
id: "2",
name: "测试"
}
]
}
},
data: {
search: {
bar: "",
taskType: "",
date: "",
keys: ""
},
page: {
nowPageNum: 4
}
}
}; };
}, },
methods: { methods: {
append (data) { append(data) {
const newChild = { id: id++, label: "testtest", children: [] }; const newChild = { id: id++, label: "testtest", children: [] };
if (!data.children) { if (!data.children) {
this.$set(data, "children", []); this.$set(data, "children", []);
} }
data.children.push(newChild); data.children.push(newChild);
}, },
edit (data) { edit(data) {},
remove(node, data) {
},
remove (node, data) {
const parent = node.parent; const parent = node.parent;
const children = parent.data.children || parent.data; const children = parent.data.children || parent.data;
const index = children.findIndex(d => d.id === data.id); const index = children.findIndex(d => d.id === data.id);
children.splice(index, 1); children.splice(index, 1);
},
listPick() {},
testButtonClick() {},
pagesSizeChange() {},
pagesNowPageChange() {},
setListsHeadStyle({ row, column, rowIndex, columnIndex }) {
if (rowIndex === 0) {
return "background-color: #0B0F32; border-right: 1px solid white;color: white;";
} else {
return "";
} }
} }
} }
};
</script> </script>
<style scoped> <style scoped>
.end {
position: absolute;
height: 32px;
display: flex;
align-items: center;
border: 1px solid rgba(78, 89, 199, 1);
width: 100%;
bottom: 0;
}
.add-l,
.add-r {
width: 50%;
height: 32px;
border: 1px solid rgba(78, 89, 199, 1);
width: 100%;
text-align: center;
line-height: 32px;
}
.add-l {
background-color: #e8e9fe;
color: rgba(78, 89, 199, 1);
}
.add-r {
background-color: #4e59c7;
color: #fff;
}
.ty { .ty {
height:40px; height: 40px;
background:rgba(248,248,248,1); background: rgba(248, 248, 248, 1);
border-radius:26px; border-radius: 26px;
display: flex; display: flex;
align-items: center; align-items: center;
padding: 0 16px; padding: 0 16px;
font-size: 16px; font-size: 16px;
color:rgba(51,51,51,1); color: rgba(51, 51, 51, 1);
justify-content: space-between; justify-content: space-between;
} }
.bottom { .bottom {
...@@ -140,7 +343,7 @@ export default { ...@@ -140,7 +343,7 @@ export default {
} }
.title { .title {
height: 48px; height: 48px;
background:rgba(78,89,199,1); background: rgba(78, 89, 199, 1);
line-height: 48px; line-height: 48px;
text-align: center; text-align: center;
color: #fff; color: #fff;
...@@ -150,22 +353,22 @@ export default { ...@@ -150,22 +353,22 @@ export default {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
flex-direction: row; flex-direction: row;
background-color: #F8F8F8; background-color: #f8f8f8;
padding: 16px; padding: 16px;
min-height: 100%; min-height: 100%;
} }
.left { .left {
flex: 1; position: relative;
width: 180px;
} }
.left, .right { .left,
.right {
background-color: #fff; background-color: #fff;
min-height: 100%; min-height: 100%;
} }
.right { .right {
flex: 3; padding: 10px;
background-color: blue; margin-left: 10px;
height: 100px;
margin-left: 20px;
} }
.number { .number {
font-size: 14px; font-size: 14px;
...@@ -178,4 +381,83 @@ export default { ...@@ -178,4 +381,83 @@ export default {
height: 16px; height: 16px;
} }
main {
/* // border: 2px solid orange; */
height: 100vh;
display: flex;
flex-direction: column;
justify-content: flex-start;
}
.searchs {
/* // border: 2px solid red; */
height: 40px;
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.buttons {
/* // border: 2px solid darkcyan;
// width: 30%;
// min-width: 266px; */
width: 266px;
display: flex;
flex-direction: row;
justify-content: flex-start;
}
.buttonlight {
width: 88px;
height: 32px;
margin-top: 4px;
background-color: #e8e9fe;
color: #4e59c7;
border: 1px solid #4e59c7;
box-sizing: border-box;
}
.buttonlight:hover {
}
.buttondark {
width: 88px;
height: 32px;
background-color: #4e59c7;
color: #ffffff;
border: 1px solid #4e59c7;
box-sizing: border-box;
margin-top: 4px;
}
.buttondark:hover {
}
.searchzone {
/* // border: 2px solid orange; */
height: 40px;
width: auto;
min-width: 654px;
}
.lists {
/* // border: 2px solid greenyellow; */
height: auto;
/* // min-height: 400px; */
min-height: 70%;
width: 100%;
margin-top: 20px;
}
.list {
/* // border: 1px solid red; */
}
.listButtonRed {
/* // border: 2px solid green; */
color: red;
}
.pages {
/* // border: 2px solid steelblue; */
height: 40px;
width: 100%;
display: flex;
flex-direction: row;
justify-content: flex-end;
align-items: center;
}
</style> </style>
...@@ -41,26 +41,26 @@ const frameIn = [ ...@@ -41,26 +41,26 @@ const frameIn = [
title: '通讯录管理' title: '通讯录管理'
} }
}, },
// Z-进件管理-通讯录管理 // // Z-进件管理-通讯录管理
{ // {
path: '/in/bar', // path: '/in/bar',
name: 'inBar', // name: 'inBar',
component: () => import('@/pages/in/bar'), // component: () => import('@/pages/in/bar'),
meta: { // meta: {
auth: true, // auth: true,
title: '柜组管理' // title: '柜组管理'
} // }
}, // },
// Z-进件管理-通讯录管理 // // Z-进件管理-通讯录管理
{ // {
path: '/in/shop', // path: '/in/shop',
name: 'inShop', // name: 'inShop',
component: () => import('@/pages/in/shop'), // component: () => import('@/pages/in/shop'),
meta: { // meta: {
auth: true, // auth: true,
title: '门店管理' // title: '门店管理'
} // }
}, // },
// Z-活动模版管理-模版中心 // Z-活动模版管理-模版中心
{ {
path: '/active/mode', path: '/active/mode',
......
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