|
|
@@ -7,7 +7,7 @@ import {
|
|
|
initParams,
|
|
|
initComponents,
|
|
|
} from "@/utils/init-something";
|
|
|
-import { initColumns } from "./config/add";
|
|
|
+import { initColumns, initTabColumns } from "./column";
|
|
|
|
|
|
export default {
|
|
|
name: "AddPurchaseContractDrawer",
|
|
|
@@ -20,15 +20,15 @@ export default {
|
|
|
rules: initRules(initColumns()),
|
|
|
params: initParams(initColumns()),
|
|
|
tabColumns: initTabColumns(),
|
|
|
- tabName: "first",
|
|
|
- tabTableDatas: {
|
|
|
- first: [],
|
|
|
- second: [],
|
|
|
- third: [],
|
|
|
- fourth: [],
|
|
|
- fifth: [],
|
|
|
+ tabName: "PuContractItem",
|
|
|
+ tabTableParams: {
|
|
|
+ PuContractItem: [],
|
|
|
+ PuContractClause: [],
|
|
|
+ PuContractExpense: [],
|
|
|
+ PuContractAgreement: [],
|
|
|
+ PuContractApplyOrg: [],
|
|
|
},
|
|
|
- currentComponent: { name: "", title: "", value: "", row: {} },
|
|
|
+ currentComponent: { name: "", title: "", value: "", row: {}, source: {} },
|
|
|
};
|
|
|
},
|
|
|
computed: {},
|
|
|
@@ -43,7 +43,17 @@ export default {
|
|
|
setVisible(prop) {
|
|
|
this.visible = prop;
|
|
|
},
|
|
|
- addTableRow() {},
|
|
|
+ addTableRow(prop) {
|
|
|
+ this.$notify.info({ message: prop });
|
|
|
+ this.tabTableParams[prop].push(
|
|
|
+ arr2obj(
|
|
|
+ initTabColumns().find((element) => element.key === prop).tableColumns,
|
|
|
+ "key",
|
|
|
+ ""
|
|
|
+ )
|
|
|
+ );
|
|
|
+ console.log(this.tabTableParams);
|
|
|
+ },
|
|
|
cancel() {
|
|
|
this.setVisible(false);
|
|
|
this.params = arr2obj(this.columns, "key", "value");
|
|
|
@@ -64,7 +74,7 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
//
|
|
|
- openAsyncInputDialog(prop, type) {
|
|
|
+ openAsyncInputDialog(prop, type, source) {
|
|
|
try {
|
|
|
const {
|
|
|
key,
|
|
|
@@ -74,6 +84,7 @@ export default {
|
|
|
this.currentComponent.row = prop;
|
|
|
this.currentComponent.title = title;
|
|
|
this.currentComponent.name = componentName;
|
|
|
+ this.currentComponent.source = source;
|
|
|
if (type === "change") {
|
|
|
this.currentComponent.value = this.params[key];
|
|
|
}
|
|
|
@@ -87,6 +98,7 @@ export default {
|
|
|
} catch (err) {
|
|
|
this.$notify.error({ title: "error", message: err });
|
|
|
} finally {
|
|
|
+ console.log(this.currentComponent, source, this.tabTableParams);
|
|
|
}
|
|
|
},
|
|
|
updateParams(prop) {
|
|
|
@@ -94,7 +106,7 @@ export default {
|
|
|
config: { dataMapping },
|
|
|
} = this.currentComponent.row;
|
|
|
for (let key in dataMapping) {
|
|
|
- this.params[key] = prop[dataMapping[key]];
|
|
|
+ this.currentComponent.source[key] = prop[dataMapping[key]];
|
|
|
}
|
|
|
},
|
|
|
},
|
|
|
@@ -113,47 +125,47 @@ export default {
|
|
|
:visible.sync="visible"
|
|
|
@open="beforeOpen"
|
|
|
>
|
|
|
- <el-card
|
|
|
- :body-style="{
|
|
|
- padding: '20px',
|
|
|
- display: 'flex',
|
|
|
- 'flex-wrap': 'wrap',
|
|
|
- }"
|
|
|
- style="margin: 10px"
|
|
|
+ <el-form
|
|
|
+ size="mini"
|
|
|
+ label-position="right"
|
|
|
+ label-width="135px"
|
|
|
+ :model="params"
|
|
|
+ :rules="rules"
|
|
|
>
|
|
|
- <div
|
|
|
- slot="header"
|
|
|
- style="
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- "
|
|
|
+ <el-card
|
|
|
+ :body-style="{
|
|
|
+ padding: '20px',
|
|
|
+ display: 'flex',
|
|
|
+ 'flex-wrap': 'wrap',
|
|
|
+ }"
|
|
|
+ style="margin: 10px"
|
|
|
>
|
|
|
- <h3>新增</h3>
|
|
|
- <div style="text-align: right">
|
|
|
- <el-button size="mini" @click="cancel">取消</el-button>
|
|
|
- <el-button size="mini" type="danger" @click="sava">保存</el-button>
|
|
|
- <el-button size="mini" type="info" @click="submitSava">
|
|
|
- 保存并新增
|
|
|
- </el-button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <component
|
|
|
- v-if="currentComponent.name"
|
|
|
- :is="currentComponent.name"
|
|
|
- :ref="currentComponent.name"
|
|
|
- :title="currentComponent.title"
|
|
|
- :value="currentComponent.value"
|
|
|
- @confirm="updateParams"
|
|
|
- ></component>
|
|
|
- <el-row>
|
|
|
- <el-form
|
|
|
- size="mini"
|
|
|
- label-position="right"
|
|
|
- label-width="135px"
|
|
|
- :model="params"
|
|
|
- :rules="rules"
|
|
|
+ <div
|
|
|
+ slot="header"
|
|
|
+ style="
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ "
|
|
|
>
|
|
|
+ <h3>新增</h3>
|
|
|
+ <div style="text-align: right">
|
|
|
+ <el-button size="mini" @click="cancel">取消</el-button>
|
|
|
+ <el-button size="mini" type="danger" @click="sava">保存</el-button>
|
|
|
+ <el-button size="mini" type="info" @click="submitSava">
|
|
|
+ 保存并新增
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <component
|
|
|
+ v-if="currentComponent.name"
|
|
|
+ :is="currentComponent.name"
|
|
|
+ :ref="currentComponent.name"
|
|
|
+ :title="currentComponent.title"
|
|
|
+ :value="currentComponent.value"
|
|
|
+ @confirm="updateParams"
|
|
|
+ ></component>
|
|
|
+ <el-row>
|
|
|
<el-col
|
|
|
v-for="(column, index) in columns"
|
|
|
:key="index"
|
|
|
@@ -175,14 +187,16 @@ export default {
|
|
|
:clearable="column.clearable"
|
|
|
:disabled="column.disabled"
|
|
|
style="width: 100%"
|
|
|
- @blur="openAsyncInputDialog(column, 'change')"
|
|
|
- @change="openAsyncInputDialog(column, 'change')"
|
|
|
+ @blur="openAsyncInputDialog(column, 'change', params)"
|
|
|
+ @change="openAsyncInputDialog(column, 'change', params)"
|
|
|
>
|
|
|
<template #suffix>
|
|
|
<el-icon
|
|
|
class="el-icon-s-operation"
|
|
|
style="cursor: pointer"
|
|
|
- @click.native.stop="openAsyncInputDialog(column, 'click')"
|
|
|
+ @click.native.stop="
|
|
|
+ openAsyncInputDialog(column, 'click', params)
|
|
|
+ "
|
|
|
></el-icon>
|
|
|
</template>
|
|
|
</el-input>
|
|
|
@@ -275,40 +289,85 @@ export default {
|
|
|
</el-upload>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
- </el-form>
|
|
|
- </el-row>
|
|
|
- </el-card>
|
|
|
- <el-card
|
|
|
- :body-style="{
|
|
|
- padding: '20px',
|
|
|
- display: 'flex',
|
|
|
- 'flex-wrap': 'wrap',
|
|
|
- position: 'relative',
|
|
|
- }"
|
|
|
- style="margin: 10px"
|
|
|
- >
|
|
|
- <el-tabs v-model="tabName" @tab-click="handleClick" style="width: 100%">
|
|
|
- <el-tab-pane
|
|
|
- v-for="(column, index) in tabColumns"
|
|
|
- :key="index"
|
|
|
- :label="column.title"
|
|
|
- :name="column.key"
|
|
|
- >
|
|
|
- <el-table :data="tabTableDatas[column.key]" style="width: 100%">
|
|
|
- <el-table-column
|
|
|
- v-for="(cColumn, cIndex) in column.tableColumns"
|
|
|
- :key="cIndex"
|
|
|
- :prop="cColumn.key"
|
|
|
- :label="cColumn.title"
|
|
|
- :width="cColumn.width"
|
|
|
- >
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </el-tab-pane>
|
|
|
- </el-tabs>
|
|
|
- <el-row style="position: absolute; top: 20px; right: 20px">
|
|
|
- <el-button size="mini" @click="addTableRow">增行</el-button>
|
|
|
- </el-row>
|
|
|
- </el-card>
|
|
|
+ </el-row>
|
|
|
+ </el-card>
|
|
|
+ <el-card
|
|
|
+ :body-style="{
|
|
|
+ padding: '20px',
|
|
|
+ display: 'flex',
|
|
|
+ 'flex-wrap': 'wrap',
|
|
|
+ position: 'relative',
|
|
|
+ }"
|
|
|
+ style="margin: 10px"
|
|
|
+ >
|
|
|
+ <el-tabs v-model="tabName" @tab-click="handleClick" style="width: 100%">
|
|
|
+ <el-tab-pane
|
|
|
+ v-for="(column, index) in tabColumns"
|
|
|
+ :key="index"
|
|
|
+ :label="column.title"
|
|
|
+ :name="column.key"
|
|
|
+ >
|
|
|
+ <el-table :data="tabTableParams[column.key]" style="width: 100%">
|
|
|
+ <el-table-column
|
|
|
+ v-for="(cColumn, cIndex) in column.tableColumns"
|
|
|
+ :key="cIndex"
|
|
|
+ :prop="cColumn.key"
|
|
|
+ :label="cColumn.title"
|
|
|
+ :width="cColumn.width"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-tag v-if="cColumn.key === 'index'">
|
|
|
+ {{ scope.$index + 1 }}
|
|
|
+ </el-tag>
|
|
|
+ <el-input
|
|
|
+ v-if="cColumn.type === 'Input'"
|
|
|
+ v-model="scope.row[cColumn.key]"
|
|
|
+ :placeholder="cColumn.placeholder"
|
|
|
+ :clearable="cColumn.clearable"
|
|
|
+ :disabled="cColumn.disabled"
|
|
|
+ size="mini"
|
|
|
+ style="width: 100%"
|
|
|
+ ></el-input>
|
|
|
+ <el-input-number
|
|
|
+ v-if="cColumn.type === 'InputNumber'"
|
|
|
+ v-model="scope.row[cColumn.key]"
|
|
|
+ :controls-position="cColumn.config.controlsPosition"
|
|
|
+ :placeholder="cColumn.placeholder"
|
|
|
+ :clearable="cColumn.clearable"
|
|
|
+ :disabled="cColumn.disabled"
|
|
|
+ size="mini"
|
|
|
+ style="width: 100%"
|
|
|
+ ></el-input-number>
|
|
|
+ <el-input
|
|
|
+ v-if="cColumn.type === 'InputDialog'"
|
|
|
+ v-model="scope.row[cColumn.key]"
|
|
|
+ :placeholder="cColumn.placeholder"
|
|
|
+ :clearable="cColumn.clearable"
|
|
|
+ :disabled="cColumn.disabled"
|
|
|
+ size="mini"
|
|
|
+ style="width: 100%"
|
|
|
+ @blur="openAsyncInputDialog(cColumn, 'change', scope.row)"
|
|
|
+ @change="openAsyncInputDialog(cColumn, 'change', scope.row)"
|
|
|
+ >
|
|
|
+ <template #suffix>
|
|
|
+ <el-icon
|
|
|
+ class="el-icon-s-operation"
|
|
|
+ style="cursor: pointer"
|
|
|
+ @click.native.stop="
|
|
|
+ openAsyncInputDialog(cColumn, 'click', scope.row)
|
|
|
+ "
|
|
|
+ ></el-icon>
|
|
|
+ </template>
|
|
|
+ </el-input>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ <el-row style="position: absolute; top: 20px; right: 20px">
|
|
|
+ <el-button size="mini" @click="addTableRow(tabName)">增行</el-button>
|
|
|
+ </el-row>
|
|
|
+ </el-card>
|
|
|
+ </el-form>
|
|
|
</el-drawer>
|
|
|
</template>
|
002201