提交 c8964e1a authored 作者: lidongxu's avatar lidongxu

refactor(promotion): 调整:店内执行上报填充模式的常规陈列的样式

上级 29d1bf3a
...@@ -50,7 +50,8 @@ const props = defineProps({ ...@@ -50,7 +50,8 @@ const props = defineProps({
} }
}) })
const queryParams = reactive({ const queryParams = reactive({
salesMonth: '', // 当月
salesMonth: new Date(),
deptName: '', deptName: '',
dealerCN: '', dealerCN: '',
lineNameLike: '', lineNameLike: '',
......
...@@ -40,7 +40,10 @@ ...@@ -40,7 +40,10 @@
<template #header="{ column }"> <template #header="{ column }">
<!-- 只为特定公式列添加问号图标 --> <!-- 只为特定公式列添加问号图标 -->
<span class="formula-column"> <span class="formula-column">
{{ column.label }} <div class="column">
<p>{{ column.label }}</p>
<p v-if="col.subLabel">{{ col.subLabel }}</p>
</div>
<el-tooltip v-if="col.type === 'formula'" <el-tooltip v-if="col.type === 'formula'"
:content="col.formulaStr" :content="col.formulaStr"
placement="top"> placement="top">
...@@ -128,6 +131,7 @@ const emit = defineEmits(['updateColumns', 'getTableList', 'updateShowSearch']) ...@@ -128,6 +131,7 @@ const emit = defineEmits(['updateColumns', 'getTableList', 'updateShowSearch'])
/*************** 工具栏 ***************/ /*************** 工具栏 ***************/
// 切换平铺/填报模式 // 切换平铺/填报模式
const operation = ref('展示模式'); const operation = ref('展示模式');
// const operation = ref('填报模式');
const tableRef = ref(null) const tableRef = ref(null)
const checkTableColumns = async () => { const checkTableColumns = async () => {
// 通知外面传入 tableColumns / chooseColumns 数据源 // 通知外面传入 tableColumns / chooseColumns 数据源
...@@ -184,6 +188,19 @@ const getTableList = () => { ...@@ -184,6 +188,19 @@ const getTableList = () => {
justify-content: center; justify-content: center;
align-items: center; align-items: center;
.column {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
p {
margin: 0;
font-size: 12px;
color: #606266;
}
}
.el-icon { .el-icon {
margin-left: 2px; margin-left: 2px;
} }
...@@ -220,19 +237,27 @@ const getTableList = () => { ...@@ -220,19 +237,27 @@ const getTableList = () => {
width: 100% !important; width: 100% !important;
padding: 10px; padding: 10px;
/* 非 disabled 状态下的背景颜色 */ ::v-deep(.el-select__wrapper) {
&.no-disabled { border: 4px solid var(--el-background-editor-cell) !important;
background-color: var(--el-background-editor-cell);
} }
/* 非 disabled 状态下的背景颜色 */
/* &.no-disabled {
background-color: ;
} */
} }
.el-input { .el-input {
padding: 10px; padding: 10px;
&.no-disabled { ::v-deep(.el-input__wrapper) {
background-color: var(--el-background-editor-cell); border: 4px solid var(--el-background-editor-cell) !important;
} }
/* &.no-disabled {
background-color: var(--el-background-editor-cell);
} */
} }
.date-picker { .date-picker {
...@@ -253,11 +278,13 @@ const getTableList = () => { ...@@ -253,11 +278,13 @@ const getTableList = () => {
/* 填报模式-单元格 */ /* 填报模式-单元格 */
&.cell-no-padding { &.cell-no-padding {
/* 无上下内边距 */ /* 无上下内边距 */
::v-deep(.el-table__row) { ::v-deep(.el-table__row) {
.el-table__cell { .el-table__cell {
padding: 0; padding: 0;
.cell{
.cell {
padding: 0 !important; padding: 0 !important;
} }
} }
......
...@@ -34,31 +34,30 @@ ...@@ -34,31 +34,30 @@
{ {
label: "基础信息", // 类型标题 label: "基础信息", // 类型标题
children: [ children: [
{ // {
label: '操作提示', // label: '操作提示',
prop: 'operationTip', // 列属性 // prop: 'operationTip', // 列属性
visible: true, // 是否显示 // visible: true, // 是否显示
type: 'string', // 列类型 // type: 'string', // 列类型
fill: true, // 是否为填报列 // fill: true, // 是否为填报列
fixed: 'left', // 是否固定在左侧 // fixed: 'left', // 是否固定在左侧
width: 100, // width: 100,
onlyFill: true, // 只在填报列显示 // onlyFill: true, // 只在填报列显示
render: (_, row, col) => { // render: (_, row, col) => {
return ( // return (
<div class="operation_tip_cell"> // <div class="operation_tip_cell">
<p>计划</p> // <p>计划</p>
<p>实际</p> // <p>实际</p>
</div> // </div>
) // )
} // }
}, // },
{ {
label: '计划月份', // 列标题 label: '计划月份', // 列标题
prop: 'salesMonth', // 列属性 prop: 'salesMonth', // 列属性
visible: true, // 是否显示 visible: true, // 是否显示
type: 'string', // 列类型 type: 'string', // 列类型
fill: true, // 是否为填报列 fill: false, // 是否为填报列
fixed: 'left', // 是否固定在左侧
width: 90 width: 90
}, },
{ {
...@@ -150,35 +149,35 @@ ...@@ -150,35 +149,35 @@
fill: false, fill: false,
width: 90 width: 90
}, },
{ // {
label: "门店名称", // label: "门店名称",
prop: "storeNameCodeDealerName", //新增动态列(只在填报列显示) // prop: "storeNameCodeDealerName", //新增动态列(只在填报列显示)
visible: true, // visible: true,
type: 'string', // type: 'string',
fill: true, // fill: true,
// showOverflowTooltip: true, // // showOverflowTooltip: true,
onlyFill: true,// 仅仅在填报模式下生效 // onlyFill: true,// 仅仅在填报模式下生效
fixed: 'left', // fixed: 'left',
width: 225, // width: 225,
render: (h, row) => { // render: (h, row) => {
return h('div', { // return h('div', {
class: 'store-name-render-cell' // class: 'store-name-render-cell'
}, [ // }, [
h('p', row.storeName), // h('p', row.storeName),
h('p', row.storeCode), // h('p', row.storeCode),
h('p', row.dealerName) // h('p', row.dealerName)
]) // ])
} // }
}, // },
{ {
label: "门店名称", label: "门店名称",
prop: "storeName", prop: "storeName",
showOverflowTooltip: true, showOverflowTooltip: true,
visible: true, visible: true,
type: 'string', type: 'string',
fill: false, fill: true,
fixed: 'left', fixed: 'left',
width: 175 width: 195
}, },
{ {
label: "门店编码", label: "门店编码",
...@@ -186,8 +185,7 @@ ...@@ -186,8 +185,7 @@
showOverflowTooltip: true, showOverflowTooltip: true,
visible: true, visible: true,
type: 'string', type: 'string',
fill: false, fill: true,
fixed: 'left',
width: 125 width: 125
}, },
{ {
...@@ -196,8 +194,8 @@ ...@@ -196,8 +194,8 @@
showOverflowTooltip: true, showOverflowTooltip: true,
visible: true, visible: true,
type: 'string', type: 'string',
fill: false, fill: true,
fixed: 'left', // fixed: 'left',
width: 215 width: 215
}, },
{ {
...@@ -337,23 +335,17 @@ ...@@ -337,23 +335,17 @@
prop: 'fpColumns', prop: 'fpColumns',
children: [ children: [
{ {
label: "计划主货架-形式", label: "主货架形式",
subLabel: '计划',
prop: "plannedMainShelfType", prop: "plannedMainShelfType",
visible: true, visible: true,
type: 'string', type: 'string',
fill: false, fill: true,
width: 130 width: 100
},
{
label: "计划主货架-数量",
prop: "plannedMainShelfQty",
visible: true,
type: 'string',
fill: false,
width: 130
}, },
{ {
label: "计划主货架-单个费用", label: "主货架单个费用计划",
prop: "plannedMainShelfUnitCost", prop: "plannedMainShelfUnitCost",
visible: true, visible: true,
type: 'string', type: 'string',
...@@ -361,7 +353,7 @@ ...@@ -361,7 +353,7 @@
width: 155 width: 155
}, },
{ {
label: "计划主货架-总费用", label: "主货架总费用计划",
prop: "plannedMainShelfTotalCost", prop: "plannedMainShelfTotalCost",
visible: true, visible: true,
type: 'string', type: 'string',
...@@ -369,7 +361,8 @@ ...@@ -369,7 +361,8 @@
width: 145 width: 145
}, },
{ {
label: "实际主货架-形式", label: "主货架形式",
subLabel: '实际',
prop: "actualMainShelfType", prop: "actualMainShelfType",
visible: true, visible: true,
type: 'select', type: 'select',
...@@ -383,11 +376,11 @@ ...@@ -383,11 +376,11 @@
], ],
referenceKey: "plannedMainShelfType", referenceKey: "plannedMainShelfType",
fill: true, fill: true,
width: 140, width: 110,
render: (_, row, col) => { render: (_, row, col) => {
return ( return (
<div> <div>
<span>{row[col.referenceKey] || '-'}</span> {/* <span>{row[col.referenceKey] || '-'}</span> */}
<el-select modelValue={row[col.prop]} <el-select modelValue={row[col.prop]}
onUpdate:modelValue={(value) => { onUpdate:modelValue={(value) => {
row[col.prop] = value; row[col.prop] = value;
...@@ -412,7 +405,17 @@ ...@@ -412,7 +405,17 @@
requestKey: ["actualMainShelfQty", "actualMainShelfExecuted", "regularDisplayExecuted"] requestKey: ["actualMainShelfQty", "actualMainShelfExecuted", "regularDisplayExecuted"]
}, },
{ {
label: "实际主货架-数量", label: "主货架数量",
subLabel: '计划',
prop: "plannedMainShelfQty",
visible: true,
type: 'string',
fill: true,
width: 130
},
{
label: "主货架数量",
subLabel: '实际',
prop: "actualMainShelfQty", prop: "actualMainShelfQty",
visible: true, visible: true,
type: 'input', type: 'input',
...@@ -427,7 +430,7 @@ ...@@ -427,7 +430,7 @@
render: (_, row, col) => { render: (_, row, col) => {
return ( return (
<div> <div>
<span>{row[col.referenceKey] || '-'}</span> {/* <span>{row[col.referenceKey] || '-'}</span> */}
<el-input modelValue={row[col.prop]} <el-input modelValue={row[col.prop]}
onUpdate:modelValue={(value) => { onUpdate:modelValue={(value) => {
const numValue = value === '' ? 0 : Number(value); const numValue = value === '' ? 0 : Number(value);
...@@ -447,7 +450,7 @@ ...@@ -447,7 +450,7 @@
requestKey: ["actualMainShelfExecuted", "regularDisplayExecuted"] requestKey: ["actualMainShelfExecuted", "regularDisplayExecuted"]
}, },
{ {
label: "实际主货架-是否执行", label: "主货架是否执行实际",
prop: "actualMainShelfExecuted", prop: "actualMainShelfExecuted",
visible: true, visible: true,
type: 'formula', type: 'formula',
...@@ -476,15 +479,16 @@ ...@@ -476,15 +479,16 @@
width: 170 width: 170
}, },
{ {
label: "计划端架-数量", label: "端架数量",
subLabel: '计划',
prop: "plannedEndCapQty", prop: "plannedEndCapQty",
visible: true, visible: true,
type: 'string', type: 'string',
fill: false, fill: true,
width: 115 width: 115
}, },
{ {
label: "计划端架-总费用", label: "端架总费用计划",
prop: "plannedEndCapTotalCost", prop: "plannedEndCapTotalCost",
visible: true, visible: true,
type: 'string', type: 'string',
...@@ -492,7 +496,7 @@ ...@@ -492,7 +496,7 @@
width: 130 width: 130
}, },
{ {
label: "计划端架-单个费用", label: "端架单个费用计划",
prop: "plannedEndCapUnitCost", prop: "plannedEndCapUnitCost",
visible: true, visible: true,
type: 'string', type: 'string',
...@@ -500,7 +504,8 @@ ...@@ -500,7 +504,8 @@
width: 140 width: 140
}, },
{ {
label: "实际端架-数量", label: "端架数量",
subLabel: '实际',
prop: "actualEndCapQty", prop: "actualEndCapQty",
visible: true, visible: true,
type: 'select', type: 'select',
...@@ -516,7 +521,7 @@ ...@@ -516,7 +521,7 @@
render: (_, row, col) => { render: (_, row, col) => {
return ( return (
<div> <div>
<span>{row[col.referenceKey] || '-'}</span> {/* <span>{row[col.referenceKey] || '-'}</span> */}
<el-select modelValue={row[col.prop]} <el-select modelValue={row[col.prop]}
onUpdate:modelValue={(value) => { onUpdate:modelValue={(value) => {
// 判断空字符串给 0 // 判断空字符串给 0
...@@ -545,7 +550,7 @@ ...@@ -545,7 +550,7 @@
requestKey: ["actualEndCapExecuted", "regularDisplayExecuted"] requestKey: ["actualEndCapExecuted", "regularDisplayExecuted"]
}, },
{ {
label: "实际端架-是否执行", label: "端架是否执行实际",
prop: "actualEndCapExecuted", prop: "actualEndCapExecuted",
visible: true, visible: true,
type: 'formula', type: 'formula',
...@@ -563,23 +568,17 @@ ...@@ -563,23 +568,17 @@
width: 155 width: 155
}, },
{ {
label: "计划地堆-平米数(㎡)", label: "地堆平米数(㎡)",
subLabel: '计划',
prop: "plannedFloorStackArea", prop: "plannedFloorStackArea",
visible: true, visible: true,
type: 'string', type: 'string',
fill: false, fill: true,
width: 170 width: 170
}, },
{ {
label: "计划地堆-数量", label: "主题地堆是否计划",
prop: "plannedFloorStackQty",
visible: true,
type: 'string',
fill: false,
width: 115
},
{
label: "计划主题地堆-是否",
prop: "plannedThemedFloorStack", prop: "plannedThemedFloorStack",
visible: true, visible: true,
type: 'string', type: 'string',
...@@ -587,7 +586,7 @@ ...@@ -587,7 +586,7 @@
width: 140 width: 140
}, },
{ {
label: "计划地堆-总费用", label: "地堆总费用计划",
prop: "plannedFloorStackTotalCost", prop: "plannedFloorStackTotalCost",
visible: true, visible: true,
type: 'string', type: 'string',
...@@ -595,7 +594,7 @@ ...@@ -595,7 +594,7 @@
width: 130 width: 130
}, },
{ {
label: "计划折算1㎡-单个费用", label: "折算1㎡单个费用计划",
prop: "plannedFloorStackUnitCostPerSqm", prop: "plannedFloorStackUnitCostPerSqm",
visible: true, visible: true,
type: 'string', type: 'string',
...@@ -603,7 +602,8 @@ ...@@ -603,7 +602,8 @@
width: 160 width: 160
}, },
{ {
label: "实际地堆-平米数(㎡)", label: "地堆平米数(㎡)",
subLabel: '实际',
prop: "actualFloorStackArea", prop: "actualFloorStackArea",
visible: true, visible: true,
type: 'select', type: 'select',
...@@ -624,7 +624,7 @@ ...@@ -624,7 +624,7 @@
render: (_, row, col) => { render: (_, row, col) => {
return ( return (
<div> <div>
<span>{row[col.referenceKey] || '-'}</span> {/* <span>{row[col.referenceKey] || '-'}</span> */}
<el-select modelValue={row[col.prop]} <el-select modelValue={row[col.prop]}
onUpdate:modelValue={(value) => { onUpdate:modelValue={(value) => {
// 判断空字符串给 0 // 判断空字符串给 0
...@@ -653,7 +653,17 @@ ...@@ -653,7 +653,17 @@
requestKey: ["actualFloorStackExecuted", "regularDisplayExecuted"] requestKey: ["actualFloorStackExecuted", "regularDisplayExecuted"]
}, },
{ {
label: "实际地堆-数量", label: "地堆数量",
subLabel: '计划',
prop: "plannedFloorStackQty",
visible: true,
type: 'string',
fill: true,
width: 115
},
{
label: "地堆数量",
subLabel: '实际',
prop: "actualFloorStackQty", prop: "actualFloorStackQty",
visible: true, visible: true,
type: 'select', type: 'select',
...@@ -670,7 +680,7 @@ ...@@ -670,7 +680,7 @@
render: (_, row, col) => { render: (_, row, col) => {
return ( return (
<div> <div>
<span>{row[col.referenceKey] || '-'}</span> {/* <span>{row[col.referenceKey] || '-'}</span> */}
<el-select modelValue={row[col.prop]} <el-select modelValue={row[col.prop]}
onUpdate:modelValue={(value) => { onUpdate:modelValue={(value) => {
// 判断空字符串给 0 // 判断空字符串给 0
...@@ -699,7 +709,7 @@ ...@@ -699,7 +709,7 @@
requestKey: ["actualFloorStackExecuted", "regularDisplayExecuted"] requestKey: ["actualFloorStackExecuted", "regularDisplayExecuted"]
}, },
{ {
label: "实际主题地堆-是否", label: "主题地堆是否实际",
prop: "actualThemedFloorStack", prop: "actualThemedFloorStack",
referenceKey: "plannedThemedFloorStack", referenceKey: "plannedThemedFloorStack",
visible: true, visible: true,
...@@ -734,7 +744,7 @@ ...@@ -734,7 +744,7 @@
} }
}, },
{ {
label: "实际地堆是否执行", label: "地堆是否执行实际",
prop: "actualFloorStackExecuted", prop: "actualFloorStackExecuted",
visible: true, visible: true,
type: 'formula', type: 'formula',
...@@ -751,17 +761,17 @@ ...@@ -751,17 +761,17 @@
fill: true, fill: true,
width: 150 width: 150
}, },
{ {
label: "计划多点陈列-数量+形式", label: "多点陈列数量形式",
subLabel: '计划',
prop: "plannedMultiDisplay", prop: "plannedMultiDisplay",
visible: true, visible: true,
type: 'string', type: 'string',
fill: false, fill: true,
width: 175 width: 175
}, },
{ {
label: "计划多点陈列-总费用", label: "多点陈列总费用计划",
prop: "plannedMultiDisplayTotalCost", prop: "plannedMultiDisplayTotalCost",
visible: true, visible: true,
type: 'string', type: 'string',
...@@ -769,7 +779,8 @@ ...@@ -769,7 +779,8 @@
width: 155 width: 155
}, },
{ {
label: "实际多点陈列-数量+形式", label: "多点陈列数量形式",
subLabel: '实际',
prop: "actualMultiDisplay", prop: "actualMultiDisplay",
visible: true, visible: true,
type: 'select', type: 'select',
...@@ -783,7 +794,7 @@ ...@@ -783,7 +794,7 @@
render: (_, row, col) => { render: (_, row, col) => {
return ( return (
<div> <div>
<span>{row[col.referenceKey] || '-'}</span> {/* <span>{row[col.referenceKey] || '-'}</span> */}
<el-select modelValue={row[col.prop]} <el-select modelValue={row[col.prop]}
onUpdate:modelValue={(value) => { onUpdate:modelValue={(value) => {
row[col.prop] = value; row[col.prop] = value;
...@@ -808,7 +819,7 @@ ...@@ -808,7 +819,7 @@
requestKey: ["actualMultiDisplayExecuted"] requestKey: ["actualMultiDisplayExecuted"]
}, },
{ {
label: "实际多点陈列-是否执行", label: "多点陈列是否执行实际",
prop: "actualMultiDisplayExecuted", prop: "actualMultiDisplayExecuted",
referenceKey: 'actualMultiDisplay', referenceKey: 'actualMultiDisplay',
visible: true, visible: true,
...@@ -827,15 +838,17 @@ ...@@ -827,15 +838,17 @@
width: 180, width: 180,
}, },
{ {
label: "计划挂条-数量+形式", label: "挂条数量形式",
subLabel: '计划',
prop: "plannedHangingStripQuantityForm", prop: "plannedHangingStripQuantityForm",
visible: true, visible: true,
type: 'string', type: 'string',
fill: false, fill: true,
width: 175 width: 175
}, },
{ {
label: "实际挂条-数量+形式", label: "挂条数量形式",
subLabel: '实际',
prop: "actualHangingStripQuantityForm", prop: "actualHangingStripQuantityForm",
visible: true, visible: true,
type: 'select', type: 'select',
...@@ -849,7 +862,7 @@ ...@@ -849,7 +862,7 @@
render: (_, row, col) => { render: (_, row, col) => {
return ( return (
<div> <div>
<span>{row[col.referenceKey] || '-'}</span> {/* <span>{row[col.referenceKey] || '-'}</span> */}
<el-select modelValue={row[col.prop]} <el-select modelValue={row[col.prop]}
onUpdate:modelValue={(value) => { onUpdate:modelValue={(value) => {
row[col.prop] = value; row[col.prop] = value;
...@@ -940,7 +953,7 @@ ...@@ -940,7 +953,7 @@
// width: 160 // width: 160
// }, // },
{ {
label: "付费陈列- 是否", label: "付费陈列-是否",
prop: "paidDisplay", prop: "paidDisplay",
visible: true, visible: true,
type: 'string', type: 'string',
...@@ -948,7 +961,7 @@ ...@@ -948,7 +961,7 @@
width: 120 width: 120
}, },
{ {
label: "计划-当月拜访目标", label: "当月拜访目标计划",
prop: "monthlyVisitTarget", prop: "monthlyVisitTarget",
visible: true, visible: true,
type: 'string', type: 'string',
...@@ -956,7 +969,7 @@ ...@@ -956,7 +969,7 @@
width: 135 width: 135
}, },
{ {
label: "实际-当月是否拜访", label: "当月是否拜访实际",
prop: "monthlyVisited", prop: "monthlyVisited",
visible: true, visible: true,
type: 'string', type: 'string',
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论