Commit 7b4cdea9 authored by Z's avatar Z

Z: Dot: taskCount's Layout and lists is done.

parent 07c737b6
...@@ -132,7 +132,7 @@ ...@@ -132,7 +132,7 @@
<el-dialog <el-dialog
title="创建任务" title="创建任务"
:visible.sync="cache.status.createDialog" :visible.sync="cache.status.createDialog"
width="50%" width="40%"
:before-close="dialogCreateBeforeClose" :before-close="dialogCreateBeforeClose"
> >
<div class="dialogMain"> <div class="dialogMain">
......
...@@ -106,12 +106,11 @@ ...@@ -106,12 +106,11 @@
:total="400" :total="400"
></el-pagination> ></el-pagination>
</div> </div>
<div class="ztask-dialogs"> <div class="ztask-dialogs">
<el-dialog <el-dialog
title="创建集团任务" title="创建集团任务"
:visible.sync="cache.status.createDialog" :visible.sync="cache.status.createDialog"
width="60%" width="40%"
:before-close="dialogCreateBeforeClose" :before-close="dialogCreateBeforeClose"
> >
<div class="dialogMain"> <div class="dialogMain">
...@@ -487,7 +486,6 @@ ...@@ -487,7 +486,6 @@
flex-direction: row; flex-direction: row;
justify-content: space-between; justify-content: space-between;
} }
.ztask-searchs-items { .ztask-searchs-items {
/*border: 2px solid #00c561;*/ /*border: 2px solid #00c561;*/
...@@ -499,7 +497,6 @@ ...@@ -499,7 +497,6 @@
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
} }
.ztask-searchs-forms { .ztask-searchs-forms {
/*border: 2px solid #f900ff;*/ /*border: 2px solid #f900ff;*/
height: 30px; height: 30px;
...@@ -522,7 +519,6 @@ ...@@ -522,7 +519,6 @@
justify-content: flex-end; justify-content: flex-end;
align-items: flex-end; align-items: flex-end;
} }
.ztask-page { .ztask-page {
/*border: 2px solid red;*/ /*border: 2px solid red;*/
position: relative; position: relative;
...@@ -532,7 +528,6 @@ ...@@ -532,7 +528,6 @@
.buttonTextNormal { .buttonTextNormal {
color: #666666; color: #666666;
} }
.buttonTextWarning { .buttonTextWarning {
color: #D0021B; color: #D0021B;
} }
......
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="任务类型" class="nature"> <el-form-item label="任务类型">
<el-select <el-select
size="small" size="small"
v-model="data.search.taskType" v-model="data.search.taskType"
...@@ -37,6 +37,17 @@ ...@@ -37,6 +37,17 @@
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="日期">
<el-date-picker
size="small"
v-model="data.search.taskDate"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
style="width:200px;">
</el-date-picker>
</el-form-item>
<el-form-item label="关键词"> <el-form-item label="关键词">
<el-input <el-input
size="small" size="small"
...@@ -50,6 +61,9 @@ ...@@ -50,6 +61,9 @@
<el-button type="primary" size="small" @click="searchsSearch">搜 索</el-button> <el-button type="primary" size="small" @click="searchsSearch">搜 索</el-button>
</div> </div>
</div>
<div class="ztask-charts">
</div> </div>
<div class="ztask-lists"> <div class="ztask-lists">
<el-table <el-table
...@@ -61,35 +75,123 @@ ...@@ -61,35 +75,123 @@
@selection-change="listsSelectChange" @selection-change="listsSelectChange"
> >
<el-table-column type="selection" width="60"></el-table-column> <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="barName" label="门店" align="center" width="200"></el-table-column>
<el-table-column prop="taskDetail" label="任务内容" align="center"></el-table-column> <el-table-column prop="barType" label="门店类型" align="center"></el-table-column>
<el-table-column label="创建日期" align="center" width="160"> <el-table-column prop="customNew" label="拉新" align="center"></el-table-column>
<template slot-scope="scope">{{ scope.row.createTime }}</template> <el-table-column prop="customRebuy" label="复购" align="center"></el-table-column>
</el-table-column>
<el-table-column label="操作" align="center" fixed="right" width="240">
<template slot-scope="scope">
<el-button v-if="scope.row.taskStatus === 'Top'" type="text" @click="listsUntopClick(scope.row.id)">已置顶</el-button>
<el-button v-if="scope.row.taskStatus !== 'Top'" type="text" @click="listsTopClick(scope.row.id)">置顶</el-button>
<el-button type="text" @click="listsSeeClick(scope.row)">详情</el-button>
<el-button type="text" @click="listsEditClick(scope.row)">编辑</el-button>
<el-button type="text" @click="listsDelClick(scope.row)" class="listButtonRed">删除</el-button>
</template>
</el-table-column>
</el-table> </el-table>
</div> </div>
<div class="ztask-pages"> <div class="ztask-pages">
<!-- <el-pagination--> <el-pagination
<!-- class="ztask-page"--> class="ztask-page"
<!-- @size-change="pagesSizeChange"--> @size-change="pagesSizeChange"
<!-- @current-change="pagesNowPageChange"--> @current-change="pagesNowPageChange"
<!-- :current-page="data.page.nowPageNum"--> :current-page="data.page.nowPageNum"
<!-- :page-sizes="[100, 200, 300, 400]"--> :page-sizes="[100, 200, 300, 400]"
<!-- :page-size="100"--> :page-size="100"
<!-- layout="prev, pager, next, sizes, jumper"--> layout="prev, pager, next, sizes, jumper"
<!-- :total="400"--> :total="400"
<!-- ></el-pagination>--> ></el-pagination>
</div>
<div class="ztask-dialogs">
<el-dialog
title="创建集团任务"
:visible.sync="cache.status.createDialog"
width="60%"
:before-close="dialogCreateBeforeClose"
>
<div class="dialogMain">
<el-form :model="data.create" :rules="rule.create" label-width="120px" ref="createForm">
<el-row>
<el-col :span="24">
<el-form-item label="任务标题:" prop="taskName">
<el-input v-model="data.create.taskName" autocomplete="off" placeholder="请输入任务标题"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="作者:" prop="author">
<el-select
v-model="data.create.author"
placeholder="请选择作者"
@change="dialogCreateAuthorChange"
style="width:100%;"
>
<el-option
v-for="item in list.man"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="任务详情:" prop="taskDetail">
<el-input
type="textarea"
:rows="5"
placeholder="请输入任务详情"
v-model="data.create.taskDetail"
></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="dialogCreateCancel">取 消</el-button>
<el-button size="small" type="primary" @click="dialogCreateSubmitSend('createForm')">保存并发布</el-button>
</span>
</el-dialog>
<el-dialog
title="查看集团任务"
:visible.sync="cache.status.seeDialog"
width="60%"
:before-close="dialogSeeBeforeClose"
>
<div class="dialogMain">
<el-form :model="data.see" :rules="rule.see" label-width="120px" ref="seeForm">
<el-row>
<el-col :span="24">
<el-form-item label="任务标题:" prop="taskName">
<el-input :disabled="true" v-model="data.see.taskName" autocomplete="off" placeholder="任务标题为空"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="作者:" prop="author">
<el-input :disabled="true" v-model="data.see.authore" autocomplete="off" placeholder="作者为空"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="任务详情:" prop="taskDetail">
<el-input
:disabled="true"
type="textarea"
:rows="5"
placeholder="任务详情为空"
v-model="data.see.taskDetail"
></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="dialogSeeCancel">取 消</el-button>
<el-button size="small" type="primary" @click="dialogSeeSubmitSend('createForm')">发 布</el-button>
</span>
</el-dialog>
</div> </div>
</div> </div>
</template> </template>
...@@ -100,8 +202,10 @@ ...@@ -100,8 +202,10 @@
return { return {
cache: { cache: {
status: { status: {
createDialog: false,
seeDialog: false
}, },
list:{ list: {
bar: [ bar: [
{ {
id: "0", id: "0",
...@@ -122,126 +226,238 @@ ...@@ -122,126 +226,238 @@
name: "测试" name: "测试"
} }
], ],
status: [
{
id: "0",
name: "全部"
},
{
id: "1",
name: "已发布"
}
],
} }
}, },
list: { list: {
main:[ main: [
{ {
id: '1001', id: '1001',
taskName: 'TaskComAlice', barName: 'Asics 店',
taskDetail: 'TaskComAliceDetail', barType: '专柜',
createTime: '2020-01-01 01:01:00', customNew: '10',
taskStatus: 'Top' customRebuy: '20'
}, },
{ {
id: '1002', id: '1002',
taskName: 'TaskComBob', barName: 'Bape 店',
taskDetail: 'TaskComBobDetail', barType: '专柜',
createTime: '2020-01-02 02:02:00', customNew: '18',
taskStatus: '' customRebuy: '10'
}, },
{ {
id: '1003', id: '1003',
taskName: 'TaskComClid', barName: 'Champion 店',
taskDetail: 'TaskComClidDetail', barType: '普通门店',
createTime: '2020-01-03 03:03:00', customNew: '24',
taskStatus: '' customRebuy: '40'
}, },
{ {
id: '1004', id: '1004',
taskName: 'TaskComDive', barName: 'Dior 店',
taskDetail: 'TaskComDiveDetail', barType: '普通门店',
createTime: '2020-01-04 04:04:00', customNew: '40',
taskStatus: '' customRebuy: '15'
}, },
{ {
id: '1005', id: '1005',
taskName: 'TaskComEmma', barName: 'Edc 店',
taskDetail: 'TaskComEmmaDetail', barType: '专柜',
createTime: '2020-01-05 05:05:00', customNew: '22',
taskStatus: '' customRebuy: '8'
}, },
{ {
id: '1006', id: '1006',
taskName: 'TaskComFaker', barName: 'FILA 店',
taskDetail: 'TaskComFakerDetail', barType: '专柜',
createTime: '2020-01-06 06:06:00', customNew: '30',
taskStatus: '' customRebuy: '14'
}, },
{ {
id: '1007', id: '1007',
taskName: 'TaskComGlass', barName: 'Gaucho 店',
taskDetail: 'TaskComGlassDetail', barType: '专柜',
createTime: '2020-01-07 07:07:00', customNew: '20',
taskStatus: '' customRebuy: '15'
}, },
{ {
id: '1008', id: '1008',
taskName: 'TaskComHardy', barName: 'Hermes 店',
taskDetail: 'TaskComHardyDetail', barType: '专柜',
createTime: '2020-01-08 08:08:00', customNew: '8',
taskStatus: '' customRebuy: '20'
}, },
{ {
id: '1009', id: '1009',
taskName: 'TaskComIda', barName: 'Isolda 店',
taskDetail: 'TaskComIdaDetail', barType: '普通门店',
createTime: '2020-01-09 09:09:00', customNew: '11',
taskStatus: '' customRebuy: '23'
}, },
{ {
id: '1010', id: '1010',
taskName: 'TaskComJoke', barName: 'Jeanswest 店',
taskDetail: 'TaskComJokeDetail', barType: '普通门店',
createTime: '2020-01-10 10:10:00', customNew: '40',
taskStatus: '' customRebuy: '20'
}, },
{ {
id: '1011', id: '1011',
taskName: 'TaskComKey', barName: 'Kevin 店',
taskDetail: 'TaskComKeyDetail', barType: '普通门店',
createTime: '2020-01-11 11:11:00', customNew: '11',
taskStatus: '' customRebuy: '14'
}, },
{ {
id: '1012', id: '1012',
taskName: 'TaskComLux', barName: 'Lux 店',
taskDetail: 'TaskComLuxDetail', barType: '专柜',
createTime: '2020-01-12 12:12:00', customNew: '24',
taskStatus: '' customRebuy: '14'
},
],
man: [
{
id: '1001',
name: 'Alice'
},
{
id: '1002',
name: 'Bob'
},
{
id: '1003',
name: 'Clid'
},
{
id: '1004',
name: 'Dive'
}, },
] ]
}, },
data: { data: {
search:{ search: {
bar: '', bar: '',
taskType: '', taskType: '',
taskDate: '',
keys: '', keys: '',
}, },
page:{ page: {
nowPageNum: '', nowPageNum: 1,
} },
create: {
taskName: '',
author: '',
taskDetail: '',
}, },
rule:{ createDefault: {
taskName: '',
author: '',
taskDetail: '',
},
see: {
taskName: '',
author: '',
taskDetail: '',
},
seeDefault: {
taskName: '',
author: '',
taskDetail: '',
},
},
rule: {
create: {
taskName: [{required: true, message: '任务名称不能为空', trigger: 'change'}],
taskDetail: [{required: true, message: '任务详情不能为空', trigger: 'change'}],
},
see: {},
} }
}; };
}, },
created() { created() {
}, },
methods: { methods: {
searchsCreate(){}, searchsCreate() {
searchsDels(){}, this.cache.status.createDialog = true
searchsSearch(){}, },
searchsDels() {
},
searchsSearch() {
},
listsSelectChange() {
},
listsUntopClick() {
},
listsTopClick() {
},
listsSeeClick(inData) {
this.cache.status.seeDialog = true
listsSelectChange(){}, this.data.see = {
listsUntopClick(){}, taskName: 'Bob',
listsTopClick(){}, author: 'author',
listsSeeClick(){}, taskDetail: 'taskDetail',
listsEditClick(){}, }
listsDelClick(){},
},
listsEditClick(inData) {
this.cache.status.createDialog = true
pagesSizeChange(){}, this.data.create = {
pagesNowPageChange(){}, taskName: 'taskName',
author: 'author',
taskDetail: 'taskDetail',
}
},
listsDelClick() {
},
pagesSizeChange() {
},
pagesNowPageChange() {
},
dialogCreateAuthorChange() {
},
dialogCreateBeforeClose() {
this.cache.status.createDialog = false
},
dialogCreateCancel() {
this.data.create = JSON.parse(JSON.stringify(this.data.createDefault))
this.cache.status.createDialog = false
},
dialogCreateSubmitSend() {
this.$refs[inForm].validate(valid => {
if (valid) {
} else {
return false
}
})
},
dialogSeeBeforeClose() {
this.cache.status.seeDialog = false
},
dialogSeeCancel() {
this.data.see = JSON.parse(JSON.stringify(this.data.seeDefault))
this.cache.status.seeDialog = false
},
dialogSeeSubmitSend() {
},
} }
}; };
</script> </script>
...@@ -260,9 +476,8 @@ ...@@ -260,9 +476,8 @@
flex-direction: row; flex-direction: row;
justify-content: space-between; justify-content: space-between;
} }
.ztask-searchs-items { .ztask-searchs-items {
border: 2px solid #00c561; /*border: 2px solid #00c561;*/
margin: 17px 0px 20px 0px; margin: 17px 0px 20px 0px;
width: auto; width: auto;
...@@ -272,19 +487,24 @@ ...@@ -272,19 +487,24 @@
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
} }
.ztask-searchs-forms{ .ztask-searchs-forms {
/*border: 2px solid #f900ff;*/ /*border: 2px solid #f900ff;*/
height: 30px; height: 30px;
margin-bottom: 10px; margin-bottom: 10px;
} }
.ztask-charts {
border: 2px solid green;
background-color: rgba(220, 220, 220, 0.5);
height: 262px;
}
.ztask-lists { .ztask-lists {
/*border: 2px solid #0dc50e;*/ border: 2px solid red;
height: calc((100vh - 338px) * 1.0); height: calc((100vh - 600px) * 1.0);
overflow: auto; overflow: auto;
} }
.ztask-pages { .ztask-pages {
/*border: 2px solid red;*/ /*border: 2px solid red;*/
/*height: 56px;*/ /*height: 56px;*/
...@@ -294,9 +514,16 @@ ...@@ -294,9 +514,16 @@
justify-content: flex-end; justify-content: flex-end;
align-items: flex-end; align-items: flex-end;
} }
.ztask-page{ .ztask-page {
/*border: 2px solid red;*/ /*border: 2px solid red;*/
position: relative; position: relative;
margin-right: 0; margin-right: 0;
} }
.buttonTextNormal {
color: #666666;
}
.buttonTextWarning {
color: #D0021B;
}
</style> </style>
...@@ -43,7 +43,7 @@ export default { ...@@ -43,7 +43,7 @@ export default {
.mains { .mains {
/*border: 1px solid red;*/ /*border: 1px solid red;*/
height: calc((100vh - 140px) * 1.0); height: calc((100vh - 140px) * 1.0);
min-width: 1000px; min-width: 1280px;
margin: 10px 20px 10px 10px; margin: 10px 20px 10px 10px;
......
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