Commit 534694f7 authored by xd's avatar xd

柜组添加

parents e1c5c08f 7127565a
# 所有环境默认
# 页面 title 前缀
VUE_APP_TITLE=D2Admin
VUE_APP_TITLE = 亿百分
# 网络请求公用地址
VUE_APP_API=/api/
......
# 开发环境
# 页面 title 前缀
# VUE_APP_TITLE=D2Admin Dev
VUE_APP_TITLE=亿百分
# VUE_APP_TITLE= D2Admin Dev
VUE_APP_TITLE = 亿百分
......@@ -25,6 +25,7 @@
</script>
<style lang="scss">
@import '~@/assets/style/public-class.scss';
@import '~@/assets/style/public-class.scss';
@import '~@/assets/style/button/index.scss';
@import '~@/assets/style/pagination/index.scss';
</style>
.searchs{
height: 40px;
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin:16px 0 20px 0;
.buttons{
width: 266px;
display: flex;
flex-direction: row;
justify-content: flex-start;
}
.buttonlight {
width: 88px;
height: 32px;
background-color: #e8e9fe;
color: #4e59c7;
border: 1px solid #4e59c7;
box-sizing: border-box;
margin-top: 4px;
&:hover{
background-color: rgba(78, 89, 199, 0.8);
color: #fff;
}
}
.buttondark {
width: 88px;
height: 32px;
background-color: #4e59c7;
color: #ffffff;
border: 1px solid #4e59c7;
box-sizing: border-box;
margin-top: 4px;
&:hover{
background-color: rgba(78, 89, 199, 0.8);
color: #fff;
}
}
}
.el-pagination{
position: absolute;
bottom:00px;
right: 30px;
}
/*修改滚动条样式*/
div::-webkit-scrollbar{
width:10px;
height:10px;
/**/
}
div::-webkit-scrollbar-track{
background: rgb(239, 239, 239);
border-radius:2px;
}
div::-webkit-scrollbar-thumb{
background: #bfbfbf;
border-radius:10px;
}
div::-webkit-scrollbar-thumb:hover{
background: #555;
}
div::-webkit-scrollbar-corner{
background: #179a16;
}
.el-table.list{
.el-button--text{
color: #666666;
font-weight: normal;
&:hover{
color: #333333;
}
&.listButtonRed{
color: #D0021B;
&:hover{
color: red;
}
}
}
}
......@@ -55,3 +55,7 @@ $sizes: (0, 5, 10, 15, 20);
.#{$prefix}-pr { padding-right: 20px !important; }
.#{$prefix}-pb { padding-bottom: 20px !important; }
.#{$prefix}-pl { padding-left: 20px !important; }
.pRelative{
position: relative;
}
......@@ -4,12 +4,13 @@ $theme-name: 'd2';
$theme-bg-color: #ebf1f6;
// 主题背景图片遮罩
$theme-bg-mask: rgba(#000, 0);
$theme-border-color: #EEEEEE;
// container组件
$theme-container-background-color: rgba(#FFF, 1);
$theme-container-header-footer-background-color: #FFF;
$theme-container-border-inner: 1px solid #cfd7e5;
$theme-container-border-outer: 1px solid #cfd7e5;
$theme-container-border-inner: 1px solid $theme-border-color;
$theme-container-border-outer: 1px solid $theme-border-color;
$theme-multiple-page-control-color: $color-text-normal;
$theme-multiple-page-control-color-active: #2f74ff;
......@@ -58,4 +59,4 @@ $theme-aside-menu-empty-text-color: $color-text-normal;
$theme-aside-menu-empty-background-color: rgba(#000, .03);
$theme-aside-menu-empty-icon-color-hover: $color-text-main;
$theme-aside-menu-empty-text-color-hover: $color-text-main;
$theme-aside-menu-empty-background-color-hover: rgba(#000, .05);
\ No newline at end of file
$theme-aside-menu-empty-background-color-hover: rgba(#000, .05);
......@@ -288,16 +288,13 @@
display: flex;
flex-direction: column;
overflow: hidden;
padding: 16px;
.d2-container-full__header {
padding: 20px;
padding:0 16px 16px 16px;
}
.d2-container-full__body {
flex-grow: 1;
// height: 100%;
// Z-style
// border: 2px solid red;
height: 100%;
padding: 20px 20px;
overflow: auto;
position: relative;
}
......
......@@ -60,7 +60,7 @@
.el-menu--horizontal .el-menu .el-submenu__title:hover {
@include theme-menu-hover-style;
}
// 顶栏
.d2-theme-header {
// 顶栏菜单空间不足时显示的滚动控件
......@@ -296,15 +296,14 @@
// [组件]
// d2-container-full 填充型
.d2-container-full {
border: $theme-container-border-outer;
border-top: none;
border-bottom: none;
background-color: $theme-container-header-footer-background-color;
.d2-container-full__header {
border-bottom: $theme-container-border-inner;
background: $theme-container-header-footer-background-color;
}
.d2-container-full__body {
background: $theme-container-background-color;
//background: $theme-container-background-color;
}
.d2-container-full__footer {
border-top: $theme-container-border-inner;
......
<template>
<d2-container>
<template slot="header">header</template>
goods/main/index.vue
<template slot="footer">footer</template>
<d2-container class="pRelative">
<template slot="header">
全部商品( 共5个 )
</template>
<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="formData" label-width="auto">
<el-form-item label="状态">
<el-select
size="small"
v-model="formData.status"
placeholder="请选择状态"
style="width:160px;"
>
<el-option
v-for="item in statusList"
: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="formData.keys"
style="width:160px"
placeholder="请输入关键词"
/>
</el-form-item>
<el-button class="button buttondark" size="small">搜索</el-button>
</el-form>
</div>
<el-table :data="data" class="list" style="width: 100%" empty-text="暂无商品信息" height="calc(100% - 120px)">
<el-table-column type="selection" width="55"> </el-table-column>
<el-table-column prop="name" label="商品图片"></el-table-column>
<el-table-column prop="name" label="商品名称"></el-table-column>
<el-table-column prop="name" label="商品价格"></el-table-column>
<el-table-column prop="name" label="库存"></el-table-column>
<el-table-column prop="name" label="佣金"></el-table-column>
<el-table-column prop="message" label="状态"></el-table-column>
<!-- 查看详情 -->
<el-table-column
fixed="right"
align="center"
label="操作"
width="140"
@selection-change="listPick">
<template slot-scope="scope">
<el-button type="text" @click="">详情</el-button>
<el-button type="text" @click="">编辑</el-button>
<el-button type="text" @click="" class="listButtonRed">删除</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
@current-change="handleCurrentChange"
:current-page="page.currentPage"
:page-size="page.size"
layout="total, prev, pager, next, jumper"
:total="page.total">
</el-pagination>
</d2-container>
</template>
<script>
export default {
data () {
return {
formData:{
status:'',
keys:''
},
statusList:[],
data: [
{
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄',
forbidEdit: true,
showEditButton: true
},
{
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄',
forbidEdit: false,
showEditButton: true
},
{
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄',
forbidEdit: false,
showEditButton: false
},
{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄',
forbidEdit: false,
showEditButton: true
},
{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄',
forbidEdit: false,
showEditButton: true
},
{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄',
forbidEdit: false,
showEditButton: true
},
{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄',
forbidEdit: false,
showEditButton: true
},
{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄',
forbidEdit: false,
showEditButton: true
},
{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄',
forbidEdit: false,
showEditButton: true
},
{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄',
forbidEdit: false,
showEditButton: true
},
],
page:{
currentPage:1,
size:20,
total:100
}
}
},
methods: {
handleCurrentChange(val) {
console.log(`当前页: ${val}`);
},
listPick() {
},
}
}
</script>
<style lang="scss">
</style>
<template>
<div class="gz">柜组</div>
</template>
<script>
export default {
}
</script>
<style scoped>
.gz {
width: 100px;
height: 100px;
background-color: pink;
}
</style>
<template>
<div class="ct">
<el-dialog
:visible.sync="moveDialog"
width="65%"
:show-close="false"
:close-on-click-modal="false"
>
<div class="choose">
<div class="title">
<div class="cg">选择分组</div>
<div class="circle" @click="handleClose">
<d2-icon-svg name="close" class="icon" />
</div>
</div>
<div class="br">
<el-form class="searchzone" :model="formData" label-width="auto">
<el-form-item label="柜组名称:">
<el-input
size="small"
v-model="formData.name"
style="width:240px"
placeholder="请输入柜组名称"
/>
</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="柜组负责人:">
<el-select
size="small"
v-model="formData.people"
placeholder="请选择柜组负责人"
style="width:240px"
>
<el-option
v-for="item in personList"
: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="formData.area"
style="width:240px"
placeholder="请输入所在区域"
/>
</el-form-item>
<el-form-item label="门店:">
<div>
<el-transfer
style="text-align: left; display: inline-block"
v-model="value4"
:left-default-checked="[]"
:right-default-checked="[]"
:titles="['选择', '已选']"
:button-texts="['删除', '添加']"
@change="handleChange"
:data="data"
>
<span slot-scope="{ option }"
>{{ option.key }} - {{ option.label }}</span
>
</el-transfer>
</div>
</el-form-item>
</el-form>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="handleCancel" size="small">取 消</el-button>
<el-button type="primary" @click="handleFinish" size="small"
>确 定</el-button
>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
props: {
moveDialog: {
type: Boolean,
default: false
}
},
data() {
const generateData = _ => {
const data = [];
for (let i = 1; i <= 15; i++) {
data.push({
key: i,
label: `备选项 ${i}`
});
}
return data;
};
return {
data: generateData(),
value: [1],
value4: [1],
renderFunc(h, option) {
return (
<span>
{option.key} - {option.label}
</span>
);
},
formData: {
name: "",
code: "",
people: ""
},
personList: [
{
id: "1",
name: "张三"
},
{
id: "2",
name: "李四"
}
]
};
},
methods: {
handleCancel() {
this.$emit("handleCancel");
},
handleFinish() {
this.$emit("handleFinish", false);
},
handleChange() {},
handleClose() {
this.$emit("handleCancel");
}
}
};
</script>
<style scoped>
.choose {
padding: 16px;
font-size: 16px;
font-weight: bold;
color: rgba(56, 56, 56, 1);
box-sizing: border-box;
margin-bottom: 20px;
}
.title {
display: flex;
align-items: center;
justify-content: space-between;
/* border-bottom: 1px solid #f8f8f8; */
padding-bottom: 10px;
}
.transfer-footer {
margin-left: 20px;
padding: 6px 5px;
}
.ct >>> .el-dialog__header {
padding: 0 !important;
}
.ct >>> .el-dialog__body {
padding: 0;
}
.ct >>> .el-transfer-panel {
width: 250px;
}
.circle {
width: 30px;
height: 30px;
line-height: 30px;
border-radius: 50%;
border: 1px solid rgba(208, 2, 27, 1);
position: relative;
}
.circle >>> .icon {
width: 28px;
height: 28px;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.br {
border-top: 1px solid #f8f8f8;
border-bottom: 1px solid #f8f8f8;
padding: 24px 60px;
}
</style>
<template>
<div class="ct">
<el-dialog
:visible.sync="moveDialog"
width="65%"
:show-close="false"
:close-on-click-modal="false"
>
<div class="choose">
<div class="title">
<div class="cg">选择分组</div>
<div class="circle" @click="handleClose">
<d2-icon-svg name="close" class="icon" />
</div>
</div>
<div class="br">
<el-form class="searchzone" :model="formData" label-width="auto">
<el-form-item label="柜组名称:">
<el-input
size="small"
v-model="formData.name"
style="width:240px"
placeholder="请输入柜组名称"
/>
</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="柜组负责人:">
<el-select
size="small"
v-model="formData.people"
placeholder="请选择柜组负责人"
style="width:240px"
>
<el-option
v-for="item in personList"
: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="formData.area"
style="width:240px"
placeholder="请输入所在区域"
/>
</el-form-item>
<el-form-item label="门店:">
<div>
<el-transfer
style="text-align: left; display: inline-block"
v-model="value4"
:left-default-checked="[]"
:right-default-checked="[]"
:titles="['选择', '已选']"
:button-texts="['删除', '添加']"
@change="handleChange"
:data="data"
>
<span slot-scope="{ option }"
>{{ option.key }} - {{ option.label }}</span
>
</el-transfer>
</div>
</el-form-item>
</el-form>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="handleCancel" size="small">取 消</el-button>
<el-button type="primary" @click="handleFinish" size="small"
>确 定</el-button
>
</span>
</el-dialog>
</div>
</template>
<script>
export default {
props: {
moveDialog: {
type: Boolean,
default: false
}
},
data() {
const generateData = _ => {
const data = [];
for (let i = 1; i <= 15; i++) {
data.push({
key: i,
label: `备选项 ${i}`
});
}
return data;
};
return {
data: generateData(),
value: [1],
value4: [1],
renderFunc(h, option) {
return (
<span>
{option.key} - {option.label}
</span>
);
},
formData: {
name: "",
code: "",
people: ""
},
personList: [
{
id: "1",
name: "张三"
},
{
id: "2",
name: "李四"
}
]
};
},
methods: {
handleCancel() {
this.$emit("handleCancel");
},
handleFinish() {
this.$emit("handleFinish", false);
},
handleChange() {},
handleClose() {
this.$emit("handleCancel");
}
}
};
</script>
<style scoped>
.choose {
padding: 16px;
font-size: 16px;
font-weight: bold;
color: rgba(56, 56, 56, 1);
box-sizing: border-box;
margin-bottom: 20px;
}
.title {
display: flex;
align-items: center;
justify-content: space-between;
/* border-bottom: 1px solid #f8f8f8; */
padding-bottom: 10px;
}
.transfer-footer {
margin-left: 20px;
padding: 6px 5px;
}
.ct >>> .el-dialog__header {
padding: 0 !important;
}
.ct >>> .el-dialog__body {
padding: 0;
}
.ct >>> .el-transfer-panel {
width: 250px;
}
.circle {
width: 30px;
height: 30px;
line-height: 30px;
border-radius: 50%;
border: 1px solid rgba(208, 2, 27, 1);
position: relative;
}
.circle >>> .icon {
width: 28px;
height: 28px;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.br {
border-top: 1px solid #f8f8f8;
border-bottom: 1px solid #f8f8f8;
padding: 24px 60px;
}
</style>
......@@ -7,28 +7,30 @@
:close-on-click-modal="false"
>
<div class="choose">
<div class="br">
<div class="title">
<div class="cg">选择分组</div>
<div class="circle" @click="handleClose">
<d2-icon-svg name="close" class="icon" />
</div>
</div>
</div>
<div style="text-align: center">
<el-transfer
style="text-align: left; display: inline-block"
v-model="value4"
:left-default-checked="[]"
:right-default-checked="[]"
:titles="['选择', '已选']"
:button-texts="['删除', '添加']"
@change="handleChange"
:data="data"
>
<span slot-scope="{ option }"
>{{ option.key }} - {{ option.label }}</span
>
</el-transfer>
<div class="br">
<div style="text-align: center">
<el-transfer
style="text-align: left; display: inline-block"
v-model="value4"
:left-default-checked="[]"
:right-default-checked="[]"
:titles="['选择', '已选']"
:button-texts="['删除', '添加']"
@change="handleChange"
:data="data"
>
<span slot-scope="{ option }"
>{{ option.key }} - {{ option.label }}</span
>
</el-transfer>
</div>
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="handleCancel" size="small">取 消</el-button>
......@@ -81,7 +83,7 @@ export default {
},
handleChange() {},
handleClose() {
this.$emit("handleCancel");
this.$emit("handleCancel");
}
}
};
......@@ -89,21 +91,19 @@ export default {
<style scoped>
.choose {
height: 52px;
padding: 16px;
font-size: 16px;
font-weight: bold;
color: rgba(56, 56, 56, 1);
box-sizing: border-box;
margin-bottom: 20px;
}
.br {
.title {
display: flex;
align-items: center;
justify-content: space-between;
border-bottom: 1px solid #f8f8f8;
padding-bottom: 10px;
/* border-bottom: 1px solid #f8f8f8; */
padding-bottom: 10px;
}
.transfer-footer {
margin-left: 20px;
......@@ -134,4 +134,9 @@ export default {
top: 50%;
transform: translate(-50%, -50%);
}
.br {
border-top: 1px solid #f8f8f8;
border-bottom: 1px solid #f8f8f8;
padding: 24px 0;
}
</style>
......@@ -33,8 +33,8 @@
:data="list.main"
tooltip-effect="dark"
style="width: 100%"
height="calc(100% - 120px)"
@selection-change="listPick"
:header-cell-style="setListsHeadStyle"
>
<el-table-column type="selection" width="60"></el-table-column>
<el-table-column
......@@ -72,7 +72,7 @@
<el-table-column label="操作" align="center" fixed="right" width="200">
<template slot-scope="scope">
<el-button type="text" class="btn" @click="testButtonClick(scope.row)"
<el-button type="text" class="btn" @click="handleDetail(scope.row)"
>详情</el-button
>
<el-button type="text" class="btn" @click="testButtonClick(scope.row)"
......@@ -99,11 +99,15 @@
:total="400"
></el-pagination>
</div>
<counter-detail v-if="DetailDialog" :moveDialog="DetailDialog" @handleCancel="DetailDialog = false" ></counter-detail>
</div>
</template>
<script>
import CounterDetail from "./components/counterDetail"
export default {
components: {},
components: {
CounterDetail
},
data() {
return {
list: {
......@@ -166,7 +170,8 @@ export default {
page: {
nowPageNum: 4
}
}
},
DetailDialog: false
};
},
created() {},
......@@ -175,13 +180,9 @@ export default {
testButtonClick() {},
pagesSizeChange() {},
pagesNowPageChange() {},
setListsHeadStyle({ row, column, rowIndex, columnIndex }) {
if (rowIndex === 0) {
return "background-color: #0B0F32; border-right: 1px solid white;color: white;";
} else {
return "";
}
}
handleDetail() {
},
}
};
</script>
......
......@@ -67,22 +67,31 @@ export default {
</script>
<style></style>
<style scoped>
.ct >>> .d2-container-full__body{
overflow: visible !important;
}
.ct >>> .d2-container-full {
padding: 0 !important;
}
.d2-theme-container-main {
background-color: #f8f8f8;
}
.test {
/* border: 2px solid red; */
width: 13%;
min-height: 100%;
/* box-shadow: 0px 2px 4px 0px rgba(221, 221, 221, 1); */
display: flex;
}
.content {
width: 82%;
}
.ct >>> .d2-container-full__body {
display: flex;
justify-content: space-between;
padding: 0 !important;
}
.tac {
width:180px;
/* width:180px; */
height: 100%;
/* box-shadow: 0px 4px 0px 0px rgba(221, 221, 221, 1); */
}
......
......@@ -48,117 +48,105 @@
</el-tree>
</div>
<div class="end">
<span class="add-l">添加柜组</span>
<span class="add-l" @click="addCounter">添加柜组</span>
<span class="add-r">添加部门</span>
</div>
</div>
<div class="right">
<div class="main">
<div class="searchs">
<div class="buttons">
<el-button
class="button buttonlight"
size="small"
@click="synchronismMember"
>同步成员</el-button
>
<el-button
class="button buttondark"
size="small"
@click="handleMove"
>移动
</el-button>
</div>
<el-form
class="searchzone"
:inline="true"
:model="data.search"
label-width="auto"
>
<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 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"
<template slot="header">
全部商品( 共5个 )
</template>
<div class="searchs">
<div class="buttons">
<el-button class="button buttonlight" size="small" @click="synchronismMember"
>同步成员</el-button
>
<el-table-column type="selection" width="60"></el-table-column>
<el-table-column
prop="taskName"
label="姓名"
align="center"
></el-table-column>
<el-table-column
prop="taskType"
label="部门"
align="center"
width="150"
></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="150"
></el-table-column>
<el-table-column label="同步时间" width="180" 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="pageData.pageSize"
:page-sizes="[100, 200, 300, 400]"
:page-size="100"
layout="prev, pager, next, sizes, jumper"
:total="400"
></el-pagination>
<el-button class="button buttondark" size="small" @click="handleMove">移动</el-button>
</div>
<!-- 搜索区 -->
<el-form
class="searchzone"
:inline="true"
:model="formData"
label-width="auto"
>
<el-form-item label="关键词">
<el-input
size="small"
v-model="formData.keys"
style="width:160px"
placeholder="请输入关键词"
/>
</el-form-item>
<el-button class="button buttondark" size="small">搜索</el-button>
</el-form>
</div>
<el-table
stripe
class="list"
ref="multipleTable"
:data="list.main"
tooltip-effect="dark"
style="width: 100%"
height="calc(100% - 120px)"
@selection-change="listPick"
>
<el-table-column type="selection" width="60"></el-table-column>
<el-table-column
prop="taskName"
label="姓名"
align="center"
></el-table-column>
<el-table-column
prop="taskType"
label="部门"
align="center"
width="150"
></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="150"
></el-table-column>
<el-table-column label="同步时间" width="180" 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>
<el-pagination
@current-change="handleCurrentChange"
:current-page="page.currentPage"
:page-size="page.size"
layout="total, prev, pager, next, jumper"
:total="page.total"
>
</el-pagination>
</div>
<move-dialog v-if = "moveDialogShow" :moveDialog = "moveDialogShow" @handleCancel="moveDialogShow = false" @handleFinish="removeFinish"></move-dialog>
<!-- <share
v-if="showReviewModel"
:dialogVisible="showReviewModel"
@handleCancel="showReviewModel = false"
@handlePeopleId="getPeopleId"
></share>-->
<move-dialog
v-if="moveDialogShow"
:moveDialog="moveDialogShow"
@handleCancel="moveDialogShow = false"
@handleFinish="removeFinish"
></move-dialog>
<add-counter v-if="counterDialog" :moveDialog="counterDialog" @handleCancel="counterDialog = false" @handleFinish="addCounterFinish"></add-counter>
</div>
</template>
<script>
import MoveDialog from "./components/move"
import MoveDialog from "./components/move";
import AddCounter from "./components/addCounter";
export default {
data() {
const data1 = [
......@@ -264,26 +252,23 @@ export default {
}
},
isShow: false,
data: {
search: {
bar: "",
taskType: "",
date: "",
keys: ""
},
page: {
nowPageNum: 4
}
formData: {
status: "",
keys: ""
},
statusList: [],
page: {
currentPage: 1,
size: 20,
total: 100
},
moveDialogShow: false,
pageData: {
pageSize: 1,
total: 10
}
counterDialog: false
};
},
components: {
MoveDialog
MoveDialog,
AddCounter
},
methods: {
append(data) {
......@@ -304,27 +289,23 @@ export default {
testButtonClick() {},
pagesSizeChange() {},
pagesNowPageChange() {},
setListsHeadStyle({ row, column, rowIndex, columnIndex }) {
if (rowIndex === 0) {
return "background-color: #0B0F32; border-right: 1px solid white;color: white;";
} else {
return "";
}
},
synchronismMember() {
this.isShow = true;
this.$emit("isShow", this.isShow);
},
handleMove() {
this.moveDialogShow = true
this.moveDialogShow = true;
console.log(111111);
},
removeFinish() {
this.moveDialogShow = false
this.moveDialogShow = false;
},
currentPage() {
currentPage() {},
addCounter() {
this.counterDialog = true
},
addCounterFinish() {
this.counterDialog = false
}
}
};
......@@ -333,12 +314,12 @@ export default {
<style scoped>
.end {
position: absolute;
height: 32px;
display: flex;
align-items: center;
border: 1px solid rgba(78, 89, 199, 1);
width: 100%;
bottom: 0;
box-sizing: border-box;
}
.add-l,
.add-r {
......@@ -389,16 +370,19 @@ export default {
.left {
position: relative;
width: 20%;
}
.left,
.right {
background-color: #fff;
min-height: 100%;
height: 518px;
overflow: auto;
box-sizing: border-box;
}
.right {
padding: 10px;
margin-left: 10px;
width: 80%;
width: 78%;
}
.number {
font-size: 14px;
......@@ -411,66 +395,21 @@ export default {
height: 16px;
}
main {
.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;
text-align: right;
}
.lists {
/* // border: 2px solid greenyellow; */
height: auto;
/* // min-height: 400px; */
min-height: 70%;
width: 100%;
margin-top: 20px;
......
......@@ -39,7 +39,6 @@
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
......@@ -207,14 +206,7 @@ export default {
flex-direction: column;
justify-content: flex-start;
}
.searchs {
height: 40px;
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.buttons {
width: 266px;
display: flex;
......
<template>
<div class="shop">门店</div>
</template>
<script>
export default {
}
</script>
<style scoped>
.shop {
width: 100px;
height: 100px;
background-color: pink;
}
</style>
<template>
<d2-container>
<template slot="header">header</template>
Hello World
<template slot="footer">footer</template>
</d2-container>
</template>
......@@ -47,6 +47,7 @@
></el-option>
</el-select>
</el-form-item>
<!-- </el-col> -->
<!-- 关键字 -->
......@@ -73,8 +74,8 @@
tooltip-effect="dark"
style="width: 100%"
@selection-change="listPick"
:header-cell-style="setListsHeadStyle"
>
<!-- :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>
......@@ -105,173 +106,225 @@
:total="400"
></el-pagination>
</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>
</template>
<script>
import TaskBar from "../bar/index";
import TaskCom from "../com/index";
import TaskCount from "../count/index";
import TaskBar from "../bar/index";
import TaskCom from "../com/index";
import TaskCount from "../count/index";
export default {
components: {},
data() {
return {
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"
export default {
components: {},
data() {
return {
cache: {
status: {
createDialog: false
}
],
search: {
bar: [
},
list: {
main: [
{
id: "1",
name: "全部"
id: "1001",
taskName: "2019年男装销售任务",
taskType: "拉新",
bar: "男装",
taskContent: "任务内容任务内容任务内容...",
sendDate: "2019/02/08"
},
{
id: "2",
name: "测试"
}
],
taskType: [
{
id: "1",
name: "全部"
id: "1002",
taskName: "2019年男装销售任务",
taskType: "拉新",
bar: "男装",
taskContent: "任务内容任务内容任务内容...",
sendDate: "2019/02/08"
},
{
id: "2",
name: "测试"
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
}
}
};
},
created() {
},
methods: {
listPick() {
},
data: {
search: {
bar: "",
taskType: "",
date: "",
keys: ""
},
page: {
nowPageNum: 4
testButtonClick() {
},
pagesSizeChange() {
},
pagesNowPageChange() {
},
setListsHeadStyle({row, column, rowIndex, columnIndex}) {
if (rowIndex === 0) {
return "background-color: #0B0F32; border-right: 1px solid white;color: white;";
} else {
return "";
}
}
};
},
created() {},
methods: {
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 "";
}
},
dialogCreateBeforeClose() {
},
dialogCreateCancel() {
},
dialogCreateSubmit() {
},
dialogCreateSubmitSend() {
},
}
}
};
};
</script>
<style lang="scss" scoped>
.main {
// border: 2px solid orange;
height: 100vh;
.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;
}
display: flex;
flex-direction: column;
justify-content: flex-start;
}
.searchs {
// border: 2px solid red;
height: 40px;
width: 100%;
.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 {
}
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 {
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;
.searchzone {
// border: 2px solid orange;
height: 40px;
width: auto;
min-width: 654px;
// display: flex;
// flex-direction: row;
// justify-content: space-between;
// align-items: center;
}
.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;
}
// display: flex;
// flex-direction: row;
// justify-content: space-between;
// align-items: center;
}
.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 lang="scss" scoped>
.dialogMain {
border: 2px solid red;
height: 100%;
}
</style>
......@@ -13,7 +13,6 @@
</el-tab-pane>
</el-tabs>
</el-card>
<!-- </d2-container> -->
</template>
<script>
......
......@@ -121,43 +121,43 @@ const frameIn = [
title: '活动商品'
}
},
// 演示页面
{
path: 'page1',
name: 'page1',
meta: {
title: '页面 1',
auth: true
},
component: _import('demo/page1')
},
{
path: 'page2',
name: 'page2',
meta: {
title: '页面 2',
auth: true
},
component: _import('demo/page2')
},
{
path: 'page3',
name: 'page3',
meta: {
title: '页面 3',
auth: true
},
component: _import('demo/page3')
},
{
path: '/page-demo',
name: 'page-demo',
component: () => import('@/pages/page-demo'),
meta: {
auth: true,
title: '新建示例'
}
},
// // 演示页面
// {
// path: 'page1',
// name: 'page1',
// meta: {
// title: '页面 1',
// auth: true
// },
// component: _import('demo/page1')
// },
// {
// path: 'page2',
// name: 'page2',
// meta: {
// title: '页面 2',
// auth: true
// },
// component: _import('demo/page2')
// },
// {
// path: 'page3',
// name: 'page3',
// meta: {
// title: '页面 3',
// auth: true
// },
// component: _import('demo/page3')
// },
// {
// path: '/page-demo',
// name: 'page-demo',
// component: () => import('@/pages/page-demo'),
// meta: {
// auth: true,
// title: '新建示例'
// }
// },
// 系统 前端日志
{
path: 'log',
......
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