Commit 32dd7a90 authored by Z's avatar Z

💄 Z: Style: table style in element is change.

parent 969e05e4
...@@ -47,6 +47,7 @@ ...@@ -47,6 +47,7 @@
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<!-- </el-col> --> <!-- </el-col> -->
<!-- 关键字 --> <!-- 关键字 -->
...@@ -73,8 +74,8 @@ ...@@ -73,8 +74,8 @@
tooltip-effect="dark" tooltip-effect="dark"
style="width: 100%" style="width: 100%"
@selection-change="listPick" @selection-change="listPick"
:header-cell-style="setListsHeadStyle"
> >
<!-- :header-cell-style="setListsHeadStyle"-->
<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>
...@@ -105,173 +106,225 @@ ...@@ -105,173 +106,225 @@
:total="400" :total="400"
></el-pagination> ></el-pagination>
</div> </div>
<div class="dialogs">
<el-dialog
title="创建任务"
:visible.sync="cache.status.createDialog"
width="60%"
:before-close="dialogCreateBeforeClose">
<div class="dialogMain">
<span>会当凌绝顶,一览众山小。</span>
</div>
<span slot="footer" class="dialog-footer">
<el-button size="small" @click="dialogCreateCancel">取 消</el-button>
<el-button size="small" type="primary" @click="dialogCreateSubmit">保 存</el-button>
<el-button size="small" type="primary" @click="dialogCreateSubmitSend">保存并发布</el-button>
</span>
</el-dialog>
</div>
</div> </div>
</template> </template>
<script> <script>
import TaskBar from "../bar/index"; import TaskBar from "../bar/index";
import TaskCom from "../com/index"; import TaskCom from "../com/index";
import TaskCount from "../count/index"; import TaskCount from "../count/index";
export default { export default {
components: {}, components: {},
data() { data() {
return { return {
list: { cache: {
main: [ status: {
{ createDialog: false
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: { list: {
bar: [ main: [
{ {
id: "1", id: "1001",
name: "全部" taskName: "2019年男装销售任务",
taskType: "拉新",
bar: "男装",
taskContent: "任务内容任务内容任务内容...",
sendDate: "2019/02/08"
}, },
{ {
id: "2", id: "1002",
name: "测试" taskName: "2019年男装销售任务",
} taskType: "拉新",
], bar: "男装",
taskType: [ taskContent: "任务内容任务内容任务内容...",
{ sendDate: "2019/02/08"
id: "1",
name: "全部"
}, },
{ {
id: "2", id: "1003",
name: "测试" 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
}
} }
};
},
created() {
},
methods: {
listPick() {
}, },
data: { testButtonClick() {
search: { },
bar: "", pagesSizeChange() {
taskType: "", },
date: "", pagesNowPageChange() {
keys: "" },
}, setListsHeadStyle({row, column, rowIndex, columnIndex}) {
page: { if (rowIndex === 0) {
nowPageNum: 4 return "background-color: #0B0F32; border-right: 1px solid white;color: white;";
} else {
return "";
} }
} },
}; dialogCreateBeforeClose() {
}, },
created() {}, dialogCreateCancel() {
methods: { },
listPick() {}, dialogCreateSubmit() {
testButtonClick() {}, },
pagesSizeChange() {}, dialogCreateSubmitSend() {
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 lang="scss" scoped> <style lang="scss" scoped>
.main { .main {
// border: 2px solid orange; // border: 2px solid orange;
height: 100vh; 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;
}
display: flex; .buttons {
flex-direction: column; // border: 2px solid darkcyan;
justify-content: flex-start; // width: 30%;
} // min-width: 266px;
.searchs { width: 266px;
// border: 2px solid red; display: flex;
height: 40px; flex-direction: row;
width: 100%; justify-content: flex-start;
}
.buttonlight {
background-color: #e8e9fe;
color: #4e59c7;
border: 1px solid #4e59c7;
box-sizing: border-box;
}
.buttonlight:hover {
}
.buttondark {
background-color: #4e59c7;
color: #ffffff;
border: 1px solid #4e59c7;
box-sizing: border-box;
}
.buttondark:hover {
}
display: flex; .searchzone {
flex-direction: row; // border: 2px solid orange;
justify-content: space-between; height: 40px;
align-items: center; width: auto;
} min-width: 654px;
.buttons {
// border: 2px solid darkcyan;
// width: 30%;
// min-width: 266px;
width: 266px;
display: flex;
flex-direction: row;
justify-content: flex-start;
}
.buttonlight {
background-color: #e8e9fe;
color: #4e59c7;
border: 1px solid #4e59c7;
box-sizing: border-box;
}
.buttonlight:hover {
}
.buttondark {
background-color: #4e59c7;
color: #ffffff;
border: 1px solid #4e59c7;
box-sizing: border-box;
}
.buttondark:hover {
}
.searchzone {
// border: 2px solid orange;
height: 40px;
width: auto;
min-width: 654px;
// display: flex; // display: flex;
// flex-direction: row; // flex-direction: row;
// justify-content: space-between; // justify-content: space-between;
// align-items: center; // align-items: center;
} }
.lists {
// border: 2px solid greenyellow; .lists {
height: auto; /*border: 2px solid greenyellow;*/
// min-height: 400px; height: auto;
min-height: 70%; // min-height: 400px;
width: 100%; min-height: 70%;
margin-top: 20px; width: 100%;
} margin-top: 20px;
.list { }
// border: 1px solid red;
} .list {
.listButtonRed { // border: 1px solid red;
// border: 2px solid green; }
color: red;
} .listButtonRed {
.pages { // border: 2px solid green;
// border: 2px solid steelblue; color: red;
height: 40px; }
width: 100%;
display: flex; .pages {
flex-direction: row; // border: 2px solid steelblue;
justify-content: flex-end; height: 40px;
align-items: center; width: 100%;
} display: flex;
flex-direction: row;
justify-content: flex-end;
align-items: center;
}
</style>
<style lang="scss" scoped>
.dialogMain {
border: 2px solid red;
height: 100%;
}
</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