|
|
@@ -1,16 +1,44 @@
|
|
|
<script>
|
|
|
import { LIST } from "@/api/business/purchase/apply";
|
|
|
-import { FormColumns, SearchColumns } from "./column";
|
|
|
-import { initPage, initDicts, initParams } from "@/utils/init";
|
|
|
+import { TableColumns, SearchColumns } from "./column";
|
|
|
+const initParams = (prop, key = "key", value = "value") => {
|
|
|
+ // get params
|
|
|
+ const object1 = Object.fromEntries(
|
|
|
+ prop.map(({ item, attr }) => [item[key], attr[value]])
|
|
|
+ );
|
|
|
+ // get mapping params
|
|
|
+ const object2 = {};
|
|
|
+ prop
|
|
|
+ .filter((item) => item.attr.dataMapping)
|
|
|
+ .map(({ attr: { dataMapping } }) => {
|
|
|
+ for (let key in dataMapping) {
|
|
|
+ object2[key] = null;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ return { ...object1, ...object2 };
|
|
|
+};
|
|
|
+
|
|
|
+// 初始化字典
|
|
|
+const initDicts = (prop) => {
|
|
|
+ return Array.from(
|
|
|
+ new Set(
|
|
|
+ prop
|
|
|
+ .filter((item) => item.attr.dictName)
|
|
|
+ .map((item) => item.attr.dictName)
|
|
|
+ )
|
|
|
+ );
|
|
|
+};
|
|
|
+
|
|
|
export default {
|
|
|
name: "PuchaseApply",
|
|
|
- dicts: [...initDicts(SearchColumns), ...initDicts(FormColumns)],
|
|
|
+ dicts: [...initDicts([...TableColumns, ...SearchColumns])],
|
|
|
components: {
|
|
|
AddModel: () => import("./add/index.vue"),
|
|
|
SeeModel: () => import("./see/index.vue"),
|
|
|
EditModel: () => import("./edit/index.vue"),
|
|
|
SubmitModel: () => import("./submit/index.vue"),
|
|
|
DeleteModel: () => import("./delete/index.vue"),
|
|
|
+ ElPopoverSelectV2: () => import("@/components/popover-select-v2/index.vue"),
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
@@ -20,7 +48,7 @@ export default {
|
|
|
params: initParams(SearchColumns),
|
|
|
tableData: [],
|
|
|
selectData: [],
|
|
|
- tableColumns: FormColumns,
|
|
|
+ tableColumns: TableColumns,
|
|
|
page: { pageNum: 1, pageSize: 10, total: 0 },
|
|
|
};
|
|
|
},
|
|
|
@@ -29,6 +57,12 @@ export default {
|
|
|
this.params.status = "0";
|
|
|
this.useQuery(this.params, this.page);
|
|
|
},
|
|
|
+ provide() {
|
|
|
+ return {
|
|
|
+ initParams,
|
|
|
+ $dicts: () => this.dict.type,
|
|
|
+ };
|
|
|
+ },
|
|
|
methods: {
|
|
|
//
|
|
|
setSelectable(row) {
|
|
|
@@ -74,7 +108,8 @@ export default {
|
|
|
},
|
|
|
// 重 置
|
|
|
useReset() {
|
|
|
- this.page = initPage();
|
|
|
+ this.page.pageNum = 1;
|
|
|
+ this.page.pageSize = 10;
|
|
|
this.params = initParams(SearchColumns);
|
|
|
this.useQuery(this.params, this.page);
|
|
|
},
|
|
|
@@ -153,16 +188,7 @@ export default {
|
|
|
</script>
|
|
|
|
|
|
<template>
|
|
|
- <el-card
|
|
|
- v-loading="loading"
|
|
|
- style="
|
|
|
- width: calc(100% - 20px);
|
|
|
- height: 100%;
|
|
|
- margin: 10px;
|
|
|
- padding: 0 20px 20px 0;
|
|
|
- "
|
|
|
- :body-style="{ padding: 0 }"
|
|
|
- >
|
|
|
+ <el-card v-loading="loading" :body-style="{ padding: 0 }">
|
|
|
<see-model ref="SeeModel"></see-model>
|
|
|
<add-model ref="AddModel" @success="useReset"></add-model>
|
|
|
<edit-model ref="EditModel" @success="useQuery(params, page)"></edit-model>
|
|
|
@@ -179,56 +205,48 @@ export default {
|
|
|
:model="params"
|
|
|
label-width="auto"
|
|
|
label-position="right"
|
|
|
- style="padding: 20px 20px 0"
|
|
|
+ @submit.native.prevent
|
|
|
>
|
|
|
- <el-row :gutter="20" style="display: flex; flex-wrap: wrap">
|
|
|
+ <el-row :gutter="20">
|
|
|
<el-col
|
|
|
v-for="column in searchColumns"
|
|
|
- :key="column.title"
|
|
|
- :span="column.span || 6"
|
|
|
+ :key="column.item.title"
|
|
|
+ :span="column.item.span || 6"
|
|
|
>
|
|
|
- <el-form-item :prop="column.key" :label="column.title">
|
|
|
- <el-input
|
|
|
- v-if="column.inputType === 'Input'"
|
|
|
- v-model="params[column.key]"
|
|
|
- :placeholder="column.placeholder"
|
|
|
- style="width: 100%"
|
|
|
- @keyup.enter.native="useQuery(params, page)"
|
|
|
- ></el-input>
|
|
|
- <el-select
|
|
|
- v-if="column.inputType === 'Select'"
|
|
|
- v-model="params[column.key]"
|
|
|
- :disabled="column.disabled"
|
|
|
- :clearable="column.clearable"
|
|
|
- :placeholder="column.placeholder"
|
|
|
- style="width: 100%"
|
|
|
+ <el-form-item :prop="column.item.key" :label="column.item.title">
|
|
|
+ <component
|
|
|
+ v-if="column.attr.referName"
|
|
|
+ v-bind="column.attr"
|
|
|
+ v-model="params[column.item.key]"
|
|
|
+ :source.sync="params"
|
|
|
+ :is="column.attr.component"
|
|
|
@change="useQuery(params, page)"
|
|
|
@keyup.enter.native="useQuery(params, page)"
|
|
|
+ ></component>
|
|
|
+ <component
|
|
|
+ v-else-if="column.attr.dictName"
|
|
|
+ v-bind="column.attr"
|
|
|
+ v-model="params[column.item.key]"
|
|
|
+ :is="column.attr.component"
|
|
|
+ @change="useQuery(params, page)"
|
|
|
+ style="width: 100%"
|
|
|
>
|
|
|
<el-option
|
|
|
- v-for="item in dict.type[column.referName]"
|
|
|
+ v-for="item in dict.type[column.attr.dictName]"
|
|
|
:key="item.value"
|
|
|
:label="item.label"
|
|
|
:value="item.value"
|
|
|
>
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- <dr-popover-select
|
|
|
- v-if="column.inputType === 'PopoverSelect'"
|
|
|
- v-model="params[column.key]"
|
|
|
- :size="size"
|
|
|
- :source.sync="params"
|
|
|
- :title="column.title"
|
|
|
- :type="column.referName"
|
|
|
- :multiple="column.multiple"
|
|
|
- :readonly="column.readonly"
|
|
|
- :value-key="column.valueKey"
|
|
|
- :placeholder="column.placeholder"
|
|
|
- :data-mapping="column.dataMapping"
|
|
|
+ </el-option
|
|
|
+ ></component>
|
|
|
+ <component
|
|
|
+ v-else
|
|
|
+ v-bind="column.attr"
|
|
|
+ v-model="params[column.item.key]"
|
|
|
+ :is="column.attr.component"
|
|
|
@change="useQuery(params, page)"
|
|
|
@keyup.enter.native="useQuery(params, page)"
|
|
|
- >
|
|
|
- </dr-popover-select>
|
|
|
+ ></component>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
@@ -279,23 +297,28 @@ export default {
|
|
|
<el-table-column
|
|
|
v-for="(column, index) in tableColumns"
|
|
|
:key="index"
|
|
|
- :prop="column.key"
|
|
|
- :label="column.title"
|
|
|
- :width="column.width || 200"
|
|
|
+ :prop="column.item.key"
|
|
|
+ :label="column.item.title"
|
|
|
+ :width="column.item.width || 200"
|
|
|
show-overflow-tooltip
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
<dict-tag
|
|
|
- v-if="column.inputType === 'Select'"
|
|
|
+ v-if="column.attr.dictName"
|
|
|
:size="size"
|
|
|
- :value="scope.row[column.key]"
|
|
|
- :options="dict.type[column.referName]"
|
|
|
+ :value="scope.row[column.item.key]"
|
|
|
+ :options="dict.type[column.attr.dictName]"
|
|
|
/>
|
|
|
<dr-file-preview
|
|
|
- v-else-if="column.inputType === 'Upload' && scope.row[column.key]"
|
|
|
- v-model="scope.row[column.key]"
|
|
|
+ v-else-if="
|
|
|
+ column.attr.component === 'dr-file-preview' &&
|
|
|
+ scope.row[column.item.key]
|
|
|
+ "
|
|
|
+ v-model="scope.row[column.item.key]"
|
|
|
></dr-file-preview>
|
|
|
- <span v-else>{{ scope.row[column.key] }}</span>
|
|
|
+ <component is="span" v-else>{{
|
|
|
+ scope.row[column.item.key]
|
|
|
+ }}</component>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
@@ -307,3 +330,26 @@ export default {
|
|
|
/>
|
|
|
</el-card>
|
|
|
</template>
|
|
|
+<style scoped lang="scss">
|
|
|
+.el-card {
|
|
|
+ width: calc(100% - 20px);
|
|
|
+ height: 100%;
|
|
|
+ margin: 10px;
|
|
|
+ padding: 0 0 20px 0;
|
|
|
+ .el-form {
|
|
|
+ padding: 20px 0 0;
|
|
|
+ }
|
|
|
+ .el-row {
|
|
|
+ display: flex;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ padding: 0 20px;
|
|
|
+ }
|
|
|
+ ::v-deep .el-table--mini {
|
|
|
+ width: 100%;
|
|
|
+ margin: 20px 0 0 0;
|
|
|
+ .el-table__cell {
|
|
|
+ height: 50px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
002201