Commit 0b188f77 authored by xd's avatar xd

Merge branch 'master' of http://114.67.93.201/xulili/ybf

parents 07a507de d82cf73e
...@@ -329,7 +329,7 @@ export default { ...@@ -329,7 +329,7 @@ export default {
<style scoped> <style scoped>
.top { .top {
padding-bottom: 10px; padding-bottom: 10px;
border-bottom: 1px solid #f8f8f8; border-bottom: 1px solid #f8f8f8;
} }
.end { .end {
position: absolute; position: absolute;
...@@ -388,7 +388,7 @@ export default { ...@@ -388,7 +388,7 @@ export default {
.left { .left {
position: relative; position: relative;
width: 20%; width: 20%;
} }
.left, .left,
.right { .right {
......
<template> <template>
<div class="main"> <div class="ztask-bars">
<div class="searchs"> <div class="ztask-searchs">
<div class="buttons"> <div class="ztask-searchs-items">
<el-button size="small" @click="searchsCreate">创建任务</el-button> <el-button size="small" @click="searchsCreate">创建任务</el-button>
<el-button type="primary" size="small">发布任务</el-button> <el-button type="primary" size="small" @click="searchsSend">发布任务</el-button>
<el-button type="primary" size="small">批量删除</el-button> <el-button type="primary" size="small" @click="searchsDels">批量删除</el-button>
</div> </div>
<div class="ztask-searchs-items">
<el-form class="ztask-searchs-forms" :inline="true" :model="data.search" label-width="auto">
<el-form-item label="柜组">
<el-select
size="small"
v-model="data.search.bar"
placeholder="请选择柜组"
style="width:160px;"
>
<el-option
v-for="item in cache.list.bar"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="任务类型">
<el-select
size="small"
v-model="data.search.taskType"
placeholder="请选择任务类型"
style="width:160px;"
>
<el-option
v-for="item in cache.list.taskType"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</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-select
size="small"
v-model="data.search.status"
placeholder="请选择状态"
style="width:160px;"
>
<el-option
v-for="item in cache.list.status"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="关键词">
<el-input
size="small"
v-model="data.search.keys"
style="width:160px"
placeholder="请输入关键词"
/>
</el-form-item>
</el-form>
<!-- 搜索区 -->
<el-form class="searchzone" :inline="true" :model="data.search" label-width="auto"> <el-button type="primary" size="small" @click="searchsSearch">搜 索</el-button>
<el-form-item label="柜组"> </div>
<el-select
size="small"
v-model="data.search.bar"
placeholder="请选择柜组"
style="width:160px;"
>
<el-option
v-for="item in cache.list.bar"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="任务类型" class="nature">
<el-select
size="small"
v-model="data.search.taskType"
placeholder="请选择任务类型"
style="width:160px;"
>
<el-option
v-for="item in cache.list.taskType"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="关键词">
<el-input
size="small"
v-model="data.search.keys"
style="width:160px"
placeholder="请输入关键词"
/>
</el-form-item>
<el-button class="button buttondark" size="small">批量删除</el-button>
</el-form>
</div> </div>
<div class="lists"> <div class="ztask-lists">
<el-table <el-table
stripe stripe
class="list"
ref="multipleTable" ref="multipleTable"
:data="list.main" :data="list.main"
tooltip-effect="dark" tooltip-effect="dark"
style="width: 100%" style="width: 100%"
@selection-change="listPick" @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="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 prop="bar" label="柜组" align="center" width="120"></el-table-column>
<el-table-column prop="taskContent" label="任务内容"></el-table-column> <el-table-column prop="createTime" label="创建日期" align="center" width="120"></el-table-column>
<el-table-column label="发布日期" width="120"> <el-table-column prop="taskDate" label="任务期限" align="center" width="200"></el-table-column>
<template slot-scope="scope">{{ scope.row.sendDate }}</template>
<el-table-column prop="taskDetail" label="任务详情" align="center" style="min-width: 200px;"></el-table-column>
<el-table-column label="状态" align="center" width="160">
<template slot-scope="scope">{{ scope.row.taskStatus }}</template>
</el-table-column> </el-table-column>
<el-table-column label="操作" align="center" fixed="right" width="240"> <el-table-column label="操作" align="center" fixed="right" width="240">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button type="text" @click="testButtonClick(scope.row)">详情</el-button> <el-button v-if="scope.row.taskStatus === 'Top'" type="text" @click="listsUntopClick(scope.row.id)">已置顶
<el-button type="text" @click="testButtonClick(scope.row)">编辑</el-button> </el-button>
<el-button type="text" @click="testButtonClick(scope.row.id)">下发</el-button> <el-button v-if="scope.row.taskStatus !== 'Top'" type="text" @click="listsTopClick(scope.row.id)">置顶
<el-button type="text" @click="testButtonClick(scope.row)" class="listButtonRed">删除</el-button> </el-button>
<el-button type="text" @click="listsSeeClick(scope.row.id)">详情</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> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
<div class="pages"> <div class="ztask-pages">
<el-pagination <el-pagination
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"
...@@ -90,11 +125,12 @@ ...@@ -90,11 +125,12 @@
:total="400" :total="400"
></el-pagination> ></el-pagination>
</div> </div>
<div class="dialogs">
<div class="ztask-dialogs">
<el-dialog <el-dialog
title="创建任务" title="创建任务"
:visible.sync="cache.status.createDialog" :visible.sync="cache.status.createDialog"
width="60%" width="50%"
:before-close="dialogCreateBeforeClose" :before-close="dialogCreateBeforeClose"
> >
<div class="dialogMain"> <div class="dialogMain">
...@@ -144,29 +180,10 @@ ...@@ -144,29 +180,10 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row> <el-row>
<el-col :span="24"> <el-col :span="24">
<el-form-item label="任务周期:" prop="taskTime"> <el-form-item label="产品周期:" prop="taskTime">
<el-select
v-model="data.create.bar"
placeholder="请选择柜组"
@change="dialogCreateBarChange"
style="width:100%;"
>
<el-option
v-for="item in cache.list.bar"
: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="taskTime">
<el-date-picker <el-date-picker
v-model="data.create.taskTime" v-model="data.create.taskTime"
type="daterange" type="daterange"
...@@ -176,35 +193,110 @@ ...@@ -176,35 +193,110 @@
style="width:100%;" style="width:100%;"
> >
</el-date-picker> </el-date-picker>
</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="dialogCreateSubmit('createForm')">保 存</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="50%"
: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="taskType">
<el-input :disabled="true" v-model="data.see.taskType" autocomplete="off" placeholder="任务类型为空"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="柜组:" prop="bar">
<el-input :disabled="true" v-model="data.see.bar" autocomplete="off" placeholder="柜组为空"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="任务期限:" prop="taskTime">
<el-input :disabled="true" v-model="data.see.taskTime" 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-form-item>
</el-col> </el-col>
</el-row> </el-row>
</el-form> </el-form>
</div> </div>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button size="small" @click="dialogCreateCancel">取 消</el-button> <el-button size="small" @click="dialogSeeCancel">取 消</el-button>
<el-button size="small" type="primary" @click="dialogCreateSubmit('createForm')">保 存</el-button> <el-button size="small" type="primary" @click="dialogSeeSubmitSend('seeForm')">任务下发</el-button>
<el-button size="small" type="primary" @click="dialogCreateSubmitSend('createForm')">保存并发布</el-button> </span>
</span>
</el-dialog> </el-dialog>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import TaskBar from "../bar/index";
import TaskCom from "../com/index";
import TaskCount from "../count/index";
export default { export default {
components: {}, components: {},
data() { data() {
return { return {
cache: { cache: {
status: { status: {
createDialog: false createDialog: false,
seeDialog: false,
}, },
list:{ list: {
bar: [
{
id: "0",
name: "全部"
},
{
id: "1",
name: "柜组1"
}
],
taskType: [ taskType: [
{ {
id: "0", id: "0",
...@@ -215,14 +307,14 @@ ...@@ -215,14 +307,14 @@
name: "测试" name: "测试"
} }
], ],
bar: [ status: [
{ {
id: "0", id: "0",
name: "全部" name: "全部"
}, },
{ {
id: "1", id: "1",
name: "柜组1" name: "已发布"
} }
], ],
} }
...@@ -230,37 +322,137 @@ ...@@ -230,37 +322,137 @@
list: { list: {
main: [ main: [
{ {
id: "1001", id: '1001',
taskName: "2019年男装销售任务", taskName: 'TaskComAlice',
taskType: "拉新", taskType: '拉新',
bar: "男装", bar: '男装',
taskContent: "任务内容任务内容任务内容...", createTime: '2020-01-01',
sendDate: "2019/02/08" taskDate: '2020-01-01 至 2020-01-01',
taskDetail: 'TaskComAliceDetail',
taskStatus: 'send'
},
{
id: '1002',
taskName: 'TaskComBob',
taskType: '拉新',
bar: '男装',
createTime: '2020-01-01',
taskDate: '2020-01-01 至 2020-01-01',
taskDetail: 'TaskComBobDetail',
taskStatus: 'nosend'
},
{
id: '1003',
taskName: 'TaskComClid',
taskType: '拉新',
bar: '男装',
createTime: '2020-01-01',
taskDate: '2020-01-01 至 2020-01-01',
taskDetail: 'TaskComClidDetail',
taskStatus: 'nosend'
},
{
id: '1004',
taskName: 'TaskComDive',
taskType: '拉新',
bar: '男装',
createTime: '2020-01-01',
taskDate: '2020-01-01 至 2020-01-01',
taskDetail: 'TaskComDiveDetail',
taskStatus: 'nosend'
}, },
{ {
id: "1002", id: '1005',
taskName: "2019年男装销售任务", taskName: 'TaskComEmma',
taskType: "拉新", taskType: '拉新',
bar: "男装", bar: '男装',
taskContent: "任务内容任务内容任务内容...", createTime: '2020-01-01',
sendDate: "2019/02/08" taskDate: '2020-01-01 至 2020-01-01',
taskDetail: 'TaskComEmmaDetail',
taskStatus: 'nosend'
}, },
{ {
id: "1003", id: '1006',
taskName: "2019年男装销售任务", taskName: 'TaskComFaker',
taskType: "拉新", taskType: '拉新',
bar: "男装", bar: '男装',
taskContent: "任务内容任务内容任务内容...", createTime: '2020-01-01',
sendDate: "2019/02/08" taskDate: '2020-01-01 至 2020-01-01',
} taskDetail: 'TaskComFakerDetail',
], taskStatus: 'nosend'
},
{
id: '1007',
taskName: 'TaskComGlass',
taskType: '拉新',
bar: '男装',
createTime: '2020-01-01',
taskDate: '2020-01-01 至 2020-01-01',
taskDetail: 'TaskComGlassDetail',
taskStatus: 'nosend'
},
{
id: '1008',
taskName: 'TaskComHardy',
taskType: '拉新',
bar: '男装',
createTime: '2020-01-01',
taskDate: '2020-01-01 至 2020-01-01',
taskDetail: 'TaskComHardyDetail',
taskStatus: 'nosend'
},
{
id: '1009',
taskName: 'TaskComIda',
taskType: '拉新',
bar: '男装',
createTime: '2020-01-01',
taskDate: '2020-01-01 至 2020-01-01',
taskDetail: 'TaskComIdaDetail',
taskStatus: 'nosend'
},
{
id: '1010',
taskName: 'TaskComJoke',
taskType: '拉新',
bar: '男装',
createTime: '2020-01-01',
taskDate: '2020-01-01 至 2020-01-01',
taskDetail: 'TaskComJokeDetail',
taskStatus: 'nosend'
},
{
id: '1011',
taskName: 'TaskComKey',
taskType: '拉新',
bar: '男装',
createTime: '2020-01-01',
taskDate: '2020-01-01 至 2020-01-01',
taskDetail: 'TaskComKeyDetail',
taskStatus: 'nosend'
},
{
id: '1012',
taskName: 'TaskComLux',
taskType: '拉新',
bar: '男装',
createTime: '2020-01-01',
taskDate: '2020-01-01 至 2020-01-01',
taskDetail: 'TaskComLuxDetail',
taskStatus: 'nosend'
},
]
}, },
data: { data: {
search: { search: {
bar: "", bar: '',
taskType: "", taskType: '',
date: "", taskDate: '',
keys: "" status: '',
keys: '',
},
page: {
nowPageNum: 1,
}, },
create: { create: {
taskName: '', taskName: '',
...@@ -276,37 +468,71 @@ ...@@ -276,37 +468,71 @@
taskTime: '', taskTime: '',
taskDetail: '', taskDetail: '',
}, },
page: { see: {
nowPageNum: 4 taskName: 'taskName',
taskType: 'taskType',
bar: 'bar',
taskTime: 'taskTime',
taskDetail: 'taskDetail',
},
seeDefault: {
taskName: '',
taskType: '',
bar: '',
taskTime: '',
taskDetail: '',
} }
}, },
rule:{ rule: {
create: { create: {
taskName: [{required: true, message: '任务名称不能为空', trigger: 'change'}], taskName: [{required: true, message: '任务名称不能为空', trigger: 'change'}],
taskType: [{required: true, message: '任务类型不能为空', trigger: 'change'}], taskType: [{required: true, message: '任务类型不能为空', trigger: 'change'}],
taskDetail: [{required: true, message: '任务详情不能为空', trigger: 'change'}],
bar: [{required: true, message: '柜组不能为空', trigger: 'change'}], bar: [{required: true, message: '柜组不能为空', trigger: 'change'}],
taskTime: [{required: true, message: '任务周期不能为空', trigger: 'change'}], taskTime: [{required: true, message: '任务周期不能为空', trigger: 'change'}],
} taskDetail: [{required: true, message: '任务详情不能为空', trigger: 'change'}],
},
see: {
},
} }
}; };
}, },
created() { created() {
}, },
methods: { methods: {
searchsCreate(){ searchsCreate() {
this.cache.status.createDialog = true this.cache.status.createDialog = true
}, },
listPick() { searchsSend() {
},
searchsDels() {
},
searchsSearch() {
},
listsSelectChange() {
},
listsUntopClick() {
},
listsTopClick() {
},
listsSeeClick(inData) {
this.cache.status.seeDialog = true
}, },
testButtonClick() { listsEditClick() {
}, },
listsDelClick() {
},
pagesSizeChange() { pagesSizeChange() {
}, },
pagesNowPageChange() { pagesNowPageChange() {
}, },
dialogCreateTaskTypeChange(){},
dialogCreateBarChange(){}, dialogCreateTaskTypeChange() {
},
dialogCreateBarChange() {
},
dialogCreateBeforeClose() { dialogCreateBeforeClose() {
this.cache.status.createDialog = false this.cache.status.createDialog = false
}, },
...@@ -316,7 +542,7 @@ ...@@ -316,7 +542,7 @@
}, },
dialogCreateSubmit(inForm) { dialogCreateSubmit(inForm) {
this.$refs[inForm].validate(valid => { this.$refs[inForm].validate(valid => {
if(valid){ if (valid) {
} else { } else {
return false return false
...@@ -325,90 +551,83 @@ ...@@ -325,90 +551,83 @@
}, },
dialogCreateSubmitSend() { dialogCreateSubmitSend() {
this.$refs[inForm].validate(valid => { this.$refs[inForm].validate(valid => {
if(valid){ if (valid) {
} else { } else {
return false 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>
<style lang="scss" scoped> <style lang="scss" scoped>
.main { .ztask-bars {
// border: 2px solid orange; /*border: 2px solid cyan;*/
height: 100vh;
display: flex; height: calc((100vh - 220px) * 1.0);
flex-direction: column;
justify-content: flex-start;
} }
/*.searchs {*/ .ztask-searchs {
/* !*border: 2px solid red;*!*/ /*border: 2px solid #0ea4c5;*/
/* height: 40px;*/ height: 70px;
/* 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; display: flex;
flex-direction: row; flex-direction: row;
justify-content: flex-start; justify-content: space-between;
} }
.searchzone { .ztask-searchs-items {
// border: 2px solid orange; /*border: 2px solid #00c561;*/
height: 40px;
margin: 17px 0px 20px 0px;
width: auto; width: auto;
min-width: 654px;
// display: flex; display: flex;
// flex-direction: row; flex-direction: row;
// justify-content: space-between; justify-content: flex-start;
// align-items: center; align-items: center;
} }
.lists { .ztask-searchs-forms {
/*border: 2px solid greenyellow;*/ /*border: 2px solid #f900ff;*/
height: auto; height: 30px;
// min-height: 400px; margin-bottom: 10px;
min-height: 70%;
width: 100%;
/*margin-top: 20px;*/
}
.list {
// border: 1px solid red;
} }
.listButtonRed { .ztask-lists {
// border: 2px solid green; /*border: 2px solid #0dc50e;*/
color: red; height: calc((100vh - 338px) * 1.0);
overflow: auto;
} }
.pages { .ztask-pages {
// border: 2px solid steelblue; /*border: 2px solid red;*/
height: 40px; /*height: 56px;*/
width: 100%; height: 42px;
display: flex; display: flex;
flex-direction: row; flex-direction: row;
justify-content: flex-end; justify-content: flex-end;
align-items: center; align-items: flex-end;
} }
</style>
<style lang="scss" scoped> .ztask-page {
.dialogMain {
/*border: 2px solid red;*/ /*border: 2px solid red;*/
height: 100%; position: relative;
margin-right: 0;
} }
</style> </style>
<template> <template>
<div>集团任务</div> <div class="ztask-coms">
<div class="ztask-searchs">
<div class="ztask-searchs-items">
<el-button size="small" @click="searchsCreate">创建任务</el-button>
<el-button type="primary" size="small" @click="searchsDels">批量删除</el-button>
</div>
<div class="ztask-searchs-items">
<el-form class="ztask-searchs-forms" :inline="true" :model="data.search" label-width="auto">
<el-form-item label="柜组">
<el-select
size="small"
v-model="data.search.bar"
placeholder="请选择柜组"
style="width:160px;"
>
<el-option
v-for="item in cache.list.bar"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="任务类型">
<el-select
size="small"
v-model="data.search.taskType"
placeholder="请选择任务类型"
style="width:160px;"
>
<el-option
v-for="item in cache.list.taskType"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</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-input
size="small"
v-model="data.search.keys"
style="width:160px"
placeholder="请输入关键词"
/>
</el-form-item>
</el-form>
<el-button type="primary" size="small" @click="searchsSearch">搜 索</el-button>
</div>
</div>
<div class="ztask-lists">
<el-table
stripe
ref="multipleTable"
:data="list.main"
tooltip-effect="dark"
style="width: 100%"
@selection-change="listsSelectChange"
>
<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="taskDetail" label="任务内容" align="center"></el-table-column>
<el-table-column label="创建日期" align="center" width="160">
<template slot-scope="scope">{{ scope.row.createTime }}</template>
</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>
</div>
<div class="ztask-pages">
<el-pagination
class="ztask-page"
@size-change="pagesSizeChange"
@current-change="pagesNowPageChange"
:current-page="data.page.nowPageNum"
:page-sizes="[100, 200, 300, 400]"
:page-size="100"
layout="prev, pager, next, sizes, jumper"
:total="400"
></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>
</div>
</div>
</template> </template>
<script>
export default {
components: {},
data() {
return {
cache: {
status: {
createDialog: false
},
list:{
bar: [
{
id: "0",
name: "全部"
},
{
id: "1",
name: "柜组1"
}
],
taskType: [
{
id: "0",
name: "全部"
},
{
id: "1",
name: "测试"
}
],
status: [
{
id: "0",
name: "全部"
},
{
id: "1",
name: "已发布"
}
],
}
},
list: {
main:[
{
id: '1001',
taskName: 'TaskComAlice',
taskDetail: 'TaskComAliceDetail',
createTime: '2020-01-01 01:01:00',
taskStatus: 'Top'
},
{
id: '1002',
taskName: 'TaskComBob',
taskDetail: 'TaskComBobDetail',
createTime: '2020-01-02 02:02:00',
taskStatus: ''
},
{
id: '1003',
taskName: 'TaskComClid',
taskDetail: 'TaskComClidDetail',
createTime: '2020-01-03 03:03:00',
taskStatus: ''
},
{
id: '1004',
taskName: 'TaskComDive',
taskDetail: 'TaskComDiveDetail',
createTime: '2020-01-04 04:04:00',
taskStatus: ''
},
{
id: '1005',
taskName: 'TaskComEmma',
taskDetail: 'TaskComEmmaDetail',
createTime: '2020-01-05 05:05:00',
taskStatus: ''
},
{
id: '1006',
taskName: 'TaskComFaker',
taskDetail: 'TaskComFakerDetail',
createTime: '2020-01-06 06:06:00',
taskStatus: ''
},
{
id: '1007',
taskName: 'TaskComGlass',
taskDetail: 'TaskComGlassDetail',
createTime: '2020-01-07 07:07:00',
taskStatus: ''
},
{
id: '1008',
taskName: 'TaskComHardy',
taskDetail: 'TaskComHardyDetail',
createTime: '2020-01-08 08:08:00',
taskStatus: ''
},
{
id: '1009',
taskName: 'TaskComIda',
taskDetail: 'TaskComIdaDetail',
createTime: '2020-01-09 09:09:00',
taskStatus: ''
},
{
id: '1010',
taskName: 'TaskComJoke',
taskDetail: 'TaskComJokeDetail',
createTime: '2020-01-10 10:10:00',
taskStatus: ''
},
{
id: '1011',
taskName: 'TaskComKey',
taskDetail: 'TaskComKeyDetail',
createTime: '2020-01-11 11:11:00',
taskStatus: ''
},
{
id: '1012',
taskName: 'TaskComLux',
taskDetail: 'TaskComLuxDetail',
createTime: '2020-01-12 12:12:00',
taskStatus: ''
},
],
man: [
{
id: '1001',
name: 'Alice'
},
{
id: '1002',
name: 'Bob'
},
{
id: '1003',
name: 'Clid'
},
{
id: '1004',
name: 'Dive'
},
]
},
data: {
search:{
bar: '',
taskType: '',
taskDate: '',
keys: '',
},
page:{
nowPageNum: 1,
},
create: {
taskName: '',
author: '',
taskDetail: '',
},
createDefault: {
taskName: '',
author: '',
taskDetail: '',
},
},
rule:{
create: {
taskName: [{required: true, message: '任务名称不能为空', trigger: 'change'}],
taskDetail: [{required: true, message: '任务详情不能为空', trigger: 'change'}],
}
}
};
},
created() {
},
methods: {
searchsCreate(){
this.cache.status.createDialog = true
},
searchsDels(){},
searchsSearch(){},
listsSelectChange(){},
listsUntopClick(){},
listsTopClick(){},
listsSeeClick(){},
listsEditClick(){},
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
}
})
},
}
};
</script>
<style lang="scss" scoped>
.ztask-coms {
/*border: 2px solid cyan;*/
height: calc((100vh - 220px) * 1.0);
}
.ztask-searchs {
/*border: 2px solid #0ea4c5;*/
height: 70px;
display: flex;
flex-direction: row;
justify-content: space-between;
}
.ztask-searchs-items {
/*border: 2px solid #00c561;*/
margin: 17px 0px 20px 0px;
width: auto;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
}
.ztask-searchs-forms{
/*border: 2px solid #f900ff;*/
height: 30px;
margin-bottom: 10px;
}
.ztask-lists {
/*border: 2px solid #0dc50e;*/
height: calc((100vh - 338px) * 1.0);
overflow: auto;
}
.ztask-pages {
/*border: 2px solid red;*/
/*height: 56px;*/
height: 42px;
display: flex;
flex-direction: row;
justify-content: flex-end;
align-items: flex-end;
}
.ztask-page{
/*border: 2px solid red;*/
position: relative;
margin-right: 0;
}
</style>
<template> <template>
<div>任务统计</div> <div class="ztask-coms">
<div class="ztask-searchs">
<div class="ztask-searchs-items">
<el-button size="small" @click="searchsCreate">创建任务</el-button>
<el-button type="primary" size="small" @click="searchsDels">批量删除</el-button>
</div>
<div class="ztask-searchs-items">
<el-form class="ztask-searchs-forms" :inline="true" :model="data.search" label-width="auto">
<el-form-item label="柜组">
<el-select
size="small"
v-model="data.search.bar"
placeholder="请选择柜组"
style="width:160px;"
>
<el-option
v-for="item in cache.list.bar"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="任务类型" class="nature">
<el-select
size="small"
v-model="data.search.taskType"
placeholder="请选择任务类型"
style="width:160px;"
>
<el-option
v-for="item in cache.list.taskType"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="关键词">
<el-input
size="small"
v-model="data.search.keys"
style="width:160px"
placeholder="请输入关键词"
/>
</el-form-item>
</el-form>
<el-button type="primary" size="small" @click="searchsSearch">搜 索</el-button>
</div>
</div>
<div class="ztask-lists">
<el-table
stripe
ref="multipleTable"
:data="list.main"
tooltip-effect="dark"
style="width: 100%"
@selection-change="listsSelectChange"
>
<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="taskDetail" label="任务内容" align="center"></el-table-column>
<el-table-column label="创建日期" align="center" width="160">
<template slot-scope="scope">{{ scope.row.createTime }}</template>
</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>
</div>
<div class="ztask-pages">
<!-- <el-pagination-->
<!-- class="ztask-page"-->
<!-- @size-change="pagesSizeChange"-->
<!-- @current-change="pagesNowPageChange"-->
<!-- :current-page="data.page.nowPageNum"-->
<!-- :page-sizes="[100, 200, 300, 400]"-->
<!-- :page-size="100"-->
<!-- layout="prev, pager, next, sizes, jumper"-->
<!-- :total="400"-->
<!-- ></el-pagination>-->
</div>
</div>
</template> </template>
<script>
export default {
components: {},
data() {
return {
cache: {
status: {
},
list:{
bar: [
{
id: "0",
name: "全部"
},
{
id: "1",
name: "柜组1"
}
],
taskType: [
{
id: "0",
name: "全部"
},
{
id: "1",
name: "测试"
}
],
}
},
list: {
main:[
{
id: '1001',
taskName: 'TaskComAlice',
taskDetail: 'TaskComAliceDetail',
createTime: '2020-01-01 01:01:00',
taskStatus: 'Top'
},
{
id: '1002',
taskName: 'TaskComBob',
taskDetail: 'TaskComBobDetail',
createTime: '2020-01-02 02:02:00',
taskStatus: ''
},
{
id: '1003',
taskName: 'TaskComClid',
taskDetail: 'TaskComClidDetail',
createTime: '2020-01-03 03:03:00',
taskStatus: ''
},
{
id: '1004',
taskName: 'TaskComDive',
taskDetail: 'TaskComDiveDetail',
createTime: '2020-01-04 04:04:00',
taskStatus: ''
},
{
id: '1005',
taskName: 'TaskComEmma',
taskDetail: 'TaskComEmmaDetail',
createTime: '2020-01-05 05:05:00',
taskStatus: ''
},
{
id: '1006',
taskName: 'TaskComFaker',
taskDetail: 'TaskComFakerDetail',
createTime: '2020-01-06 06:06:00',
taskStatus: ''
},
{
id: '1007',
taskName: 'TaskComGlass',
taskDetail: 'TaskComGlassDetail',
createTime: '2020-01-07 07:07:00',
taskStatus: ''
},
{
id: '1008',
taskName: 'TaskComHardy',
taskDetail: 'TaskComHardyDetail',
createTime: '2020-01-08 08:08:00',
taskStatus: ''
},
{
id: '1009',
taskName: 'TaskComIda',
taskDetail: 'TaskComIdaDetail',
createTime: '2020-01-09 09:09:00',
taskStatus: ''
},
{
id: '1010',
taskName: 'TaskComJoke',
taskDetail: 'TaskComJokeDetail',
createTime: '2020-01-10 10:10:00',
taskStatus: ''
},
{
id: '1011',
taskName: 'TaskComKey',
taskDetail: 'TaskComKeyDetail',
createTime: '2020-01-11 11:11:00',
taskStatus: ''
},
{
id: '1012',
taskName: 'TaskComLux',
taskDetail: 'TaskComLuxDetail',
createTime: '2020-01-12 12:12:00',
taskStatus: ''
},
]
},
data: {
search:{
bar: '',
taskType: '',
keys: '',
},
page:{
nowPageNum: '',
}
},
rule:{
}
};
},
created() {
},
methods: {
searchsCreate(){},
searchsDels(){},
searchsSearch(){},
listsSelectChange(){},
listsUntopClick(){},
listsTopClick(){},
listsSeeClick(){},
listsEditClick(){},
listsDelClick(){},
pagesSizeChange(){},
pagesNowPageChange(){},
}
};
</script>
<style lang="scss" scoped>
.ztask-coms {
/*border: 2px solid cyan;*/
height: calc((100vh - 220px) * 1.0);
}
.ztask-searchs {
/*border: 2px solid #0ea4c5;*/
height: 70px;
display: flex;
flex-direction: row;
justify-content: space-between;
}
.ztask-searchs-items {
border: 2px solid #00c561;
margin: 17px 0px 20px 0px;
width: auto;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
}
.ztask-searchs-forms{
/*border: 2px solid #f900ff;*/
height: 30px;
margin-bottom: 10px;
}
.ztask-lists {
/*border: 2px solid #0dc50e;*/
height: calc((100vh - 338px) * 1.0);
overflow: auto;
}
.ztask-pages {
/*border: 2px solid red;*/
/*height: 56px;*/
height: 42px;
display: flex;
flex-direction: row;
justify-content: flex-end;
align-items: flex-end;
}
.ztask-page{
/*border: 2px solid red;*/
position: relative;
margin-right: 0;
}
</style>
<template> <template>
<!-- <d2-container type="card"> --> <!-- <d2-container type="card"> -->
<el-card class="box-card mains"> <el-card class="box-card mains">
<el-tabs class="ztabs" v-model="cache.nowMenu" @tab-click="handleClick"> <el-tabs class="ztabs" v-model="cache.nowMenu" @tab-click="ztabsClick">
<el-tab-pane label="柜组任务" name="taskBar"> <el-tab-pane label="柜组任务" name="taskBar">
<task-bar /> <task-bar />
</el-tab-pane> </el-tab-pane>
...@@ -32,22 +32,31 @@ export default { ...@@ -32,22 +32,31 @@ export default {
nowMenu: "taskBar" nowMenu: "taskBar"
} }
}; };
},
methods:{
ztabsClick(){},
} }
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.mains { .mains {
border: 1px solid red; /*border: 1px solid red;*/
height: 90vh; height: calc((100vh - 140px) * 1.0);
margin: 10px 10px; min-width: 1000px;
margin: 10px 20px 10px 10px;
display: flex;
flex-direction: column;
justify-content: flex-start;
} }
.ztabs { .ztabs {
// border: 2px solid red; /*border: 2px solid darkviolet;*/
min-height: 100vh;
// min-height: 500px; height: calc((100vh - 180px) * 1.0);
}
d2-container { width: 100%;
overflow: hidden;
} }
</style> </style>
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