|
@@ -1,267 +1,137 @@
|
|
|
<script>
|
|
|
-import { Columns, TabColumns } from "../add/column";
|
|
|
-import {
|
|
|
- edit,
|
|
|
- item,
|
|
|
- itemTableList,
|
|
|
-} from "@/api/business/purchase/contract";
|
|
|
-import { initColumns, initDicts, initRules, initParams } from "@/utils/init";
|
|
|
-
|
|
|
-const NewColumns = initColumns(Columns);
|
|
|
-const NewTabColumns = TabColumns.map((element) => ({
|
|
|
- ...element,
|
|
|
- tableColumns: initColumns(element.tableColumns),
|
|
|
-}));
|
|
|
+import { TableColumns } from "../column";
|
|
|
+import { EDIT } from "@/api/business/purchase/contract";
|
|
|
+import { initDicts, initRules, initParams } from "@/utils/init";
|
|
|
|
|
|
export default {
|
|
|
- name: "EditDrawer",
|
|
|
- dicts: initDicts(NewColumns),
|
|
|
- components: {
|
|
|
-
|
|
|
- },
|
|
|
+ name: "EditDialog",
|
|
|
+ dicts: initDicts(TableColumns),
|
|
|
+ components: {},
|
|
|
data() {
|
|
|
return {
|
|
|
size: "mini",
|
|
|
visible: false,
|
|
|
loading: false,
|
|
|
- columns: NewColumns,
|
|
|
- rules: initRules(NewColumns),
|
|
|
- params: {
|
|
|
- ...initParams(NewColumns),
|
|
|
- contractItemList: [],
|
|
|
- contractClauseList: [],
|
|
|
- contractExpenseList: [],
|
|
|
- contractAgreementList: [],
|
|
|
- contractApplyOrgList: [],
|
|
|
- },
|
|
|
-
|
|
|
- tabColumns: NewTabColumns,
|
|
|
- tabName: "contractItemList",
|
|
|
+ columns: TableColumns,
|
|
|
+ rules: initRules(TableColumns),
|
|
|
+ params: initParams(TableColumns),
|
|
|
};
|
|
|
},
|
|
|
computed: {},
|
|
|
- watch: {
|
|
|
- "params.contractType": function (newProp) {
|
|
|
- this.tabColumns = NewTabColumns.filter((element) =>
|
|
|
- newProp === "1" ? element.key !== "contractItemList" : element
|
|
|
- );
|
|
|
- this.tabName = this.tabColumns[0].key;
|
|
|
- },
|
|
|
- tabName: function (newProp) {
|
|
|
- const { id } = this.params;
|
|
|
- this.fetchTable(id, newProp);
|
|
|
- },
|
|
|
- },
|
|
|
+ watch: {},
|
|
|
methods: {
|
|
|
- setVisible(prop) {
|
|
|
- this.visible = prop;
|
|
|
+ //
|
|
|
+ open(prop) {
|
|
|
+ this.visible = true;
|
|
|
+ this.fetchItem(prop);
|
|
|
},
|
|
|
- // 查询详细
|
|
|
- async fetchItem(prop) {
|
|
|
- try {
|
|
|
- this.loading = true;
|
|
|
- const { code, msg, data } = await item(prop);
|
|
|
- if (code === 200) {
|
|
|
- this.params = data;
|
|
|
- this.$notify.success({ title: msg });
|
|
|
- } else {
|
|
|
- this.$notify.warning({ title: msg });
|
|
|
- }
|
|
|
- } catch (err) {
|
|
|
- //
|
|
|
- } finally {
|
|
|
- this.loading = false;
|
|
|
- }
|
|
|
+ //
|
|
|
+ hide() {
|
|
|
+ this.visible = false;
|
|
|
+ this.params = initParams(this.columns);
|
|
|
},
|
|
|
- // 查询详情关联TABLE
|
|
|
- async fetchTable(prop, name) {
|
|
|
+ //
|
|
|
+ async fetchItem(prop) {
|
|
|
try {
|
|
|
this.loading = true;
|
|
|
- const { code, msg, rows } = await itemTableList({ id: prop }, name);
|
|
|
- if (code === 200) {
|
|
|
- this.params[name] = rows;
|
|
|
- this.$notify.success({ title: msg });
|
|
|
- } else {
|
|
|
- this.$notify.warning({ title: msg });
|
|
|
- }
|
|
|
+ this.params = prop;
|
|
|
} catch (err) {
|
|
|
//
|
|
|
} finally {
|
|
|
this.loading = false;
|
|
|
}
|
|
|
},
|
|
|
- // 新增行
|
|
|
- addTableRow(prop) {
|
|
|
- const arr = this.tabColumns.find(
|
|
|
- (element) => element.key === this.tabName
|
|
|
- ).tableColumns;
|
|
|
- prop.push(initParams(arr, "key", "value"));
|
|
|
- },
|
|
|
- // 删除行
|
|
|
- delTableRow(prop, index) {
|
|
|
- prop.splice(index, 1);
|
|
|
- },
|
|
|
- // 取消
|
|
|
- handleCancel() {
|
|
|
- this.setVisible(false);
|
|
|
- this.params = initParams(this.columns, "key", "value");
|
|
|
- },
|
|
|
- // 保存
|
|
|
- handleSava() {
|
|
|
- this.setVisible(false);
|
|
|
- },
|
|
|
- // 保存并新增
|
|
|
- async handleSubmit() {
|
|
|
- try {
|
|
|
- const createById = this.params.buyer;
|
|
|
- const createByName = this.params.buyerName;
|
|
|
- const updateById = this.$store.state.user.id;
|
|
|
- const updateByName = this.$store.state.user.name;
|
|
|
- const { code, msg } = await edit({
|
|
|
- createById,
|
|
|
- createByName,
|
|
|
- updateById,
|
|
|
- updateByName,
|
|
|
- ...this.params,
|
|
|
- });
|
|
|
- if (code === 200) {
|
|
|
- this.$notify.success({ title: msg });
|
|
|
- this.setVisible(false);
|
|
|
+ //
|
|
|
+ submit(prop) {
|
|
|
+ this.$refs[prop].validate(async (valid) => {
|
|
|
+ if (valid) {
|
|
|
+ try {
|
|
|
+ const { code, msg } = await EDIT({
|
|
|
+ ...this.params,
|
|
|
+ });
|
|
|
+ if (code === 200) {
|
|
|
+ this.hide();
|
|
|
+ this.$emit("submit-success");
|
|
|
+ this.$notify.success({ title: msg });
|
|
|
+ } else {
|
|
|
+ this.$notify.warning({ title: msg });
|
|
|
+ }
|
|
|
+ } catch (err) {
|
|
|
+ //
|
|
|
+ } finally {
|
|
|
+ //
|
|
|
+ }
|
|
|
} else {
|
|
|
- this.$notify.warning({ title: msg });
|
|
|
+ return false;
|
|
|
}
|
|
|
- } catch (err) {
|
|
|
- //
|
|
|
- } finally {
|
|
|
- // this.setVisible(false);
|
|
|
- }
|
|
|
+ });
|
|
|
},
|
|
|
},
|
|
|
- created() {
|
|
|
- console.log("ADD CREATED");
|
|
|
- },
|
|
|
- mounted() { },
|
|
|
- destroyed() { },
|
|
|
+ created() {},
|
|
|
+ mounted() {},
|
|
|
+ destroyed() {},
|
|
|
};
|
|
|
</script>
|
|
|
<template>
|
|
|
- <el-drawer direction="btt" size="100%" :with-header="false" :visible.sync="visible" @open="beforeOpen"
|
|
|
- @close="$emit('close')">
|
|
|
- <el-form v-loading="loading" :size="size" label-position="right" label-width="135px" :model="params" :rules="rules">
|
|
|
- <el-card :body-style="{
|
|
|
- padding: '20px',
|
|
|
- display: 'flex',
|
|
|
- 'flex-wrap': 'wrap',
|
|
|
- }" style="margin: 10px">
|
|
|
- <div slot="header" style="
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- ">
|
|
|
- <h3>编辑</h3>
|
|
|
- <div style="text-align: right">
|
|
|
- <el-button :size="size" @click="handleCancel">取 消</el-button>
|
|
|
- <el-button :size="size" type="danger" @click="handleSava">更 新</el-button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <el-row>
|
|
|
- <el-col v-for="(column, index) in columns" :key="index" :span="column.span || 6">
|
|
|
- <el-form-item :prop="column.key" :label="column.title">
|
|
|
- <el-input v-if="column.type === 'Input'" v-model="params[column.key]" :placeholder="column.placeholder"
|
|
|
- :clearable="column.clearable" :disabled="column.disabled" style="width: 100%"></el-input>
|
|
|
- <dr-popover-select v-if="column.type === 'InputDialog'" v-model="params[column.key]" :source.sync="params"
|
|
|
- :type="column.config.componentName" :data-mapping="column.config.dataMapping" :title="column.title"
|
|
|
- :disabled="column.disabled" :readonly="column.readonly" :clearable="column.clearable"
|
|
|
- :placeholder="column.placeholder">
|
|
|
- </dr-popover-select>
|
|
|
- <el-input v-if="column.type === 'Textarea'" v-model="params[column.key]" type="textarea"
|
|
|
- :placeholder="column.placeholder" :clearable="column.clearable" :disabled="column.disabled"
|
|
|
- style="width: 100%"></el-input>
|
|
|
- <el-input-number v-if="column.type === 'InputNumber'" v-model="params[column.key]"
|
|
|
- :controls-position="column.config.controlsPosition" :placeholder="column.placeholder"
|
|
|
- :clearable="column.clearable" :disabled="column.disabled" style="width: 100%"></el-input-number>
|
|
|
- <el-select v-if="column.type === 'Select'" v-model="params[column.key]" :placeholder="column.placeholder"
|
|
|
- :clearable="column.clearable" :disabled="column.disabled" style="width: 100%">
|
|
|
- <el-option v-for="item in dict.type[column.config.optionsName]" :key="item.value" :label="item.label"
|
|
|
- :value="item.value">
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- <el-select v-if="column.type === 'TagSelect'" v-model="params[column.key]" multiple clearable collapse-tags
|
|
|
- :placeholder="column.placeholder" :clearable="column.clearable" :disabled="column.disabled"
|
|
|
- style="width: 100%">
|
|
|
- <template #prefix>
|
|
|
- <el-icon class="el-icon-view" style="cursor: pointer" @click.stop="$message.info(234)"></el-icon>
|
|
|
- </template>
|
|
|
- <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- <el-date-picker v-if="column.type === 'DatePicker'" v-model="params[column.key]" :type="column.config.type"
|
|
|
- :placeholder="column.placeholder" :clearable="column.clearable" :disabled="column.disabled"
|
|
|
- :picker-options="column.pickerOptions" style="width: 100%">
|
|
|
- </el-date-picker>
|
|
|
- <el-upload v-if="column.type === 'Upload'" :file-list="params[column.key]" :disabled="column.disabled" drag
|
|
|
- action="https://sy.derom.com/document-center/fastdfs/upload" multiple>
|
|
|
- <i class="el-icon-upload"></i>
|
|
|
- <div class="el-upload__text">
|
|
|
- 将文件拖到此处,或<em>点击上传</em>
|
|
|
- </div>
|
|
|
- <!-- <div class="el-upload__tip" slot="tip">
|
|
|
- 只能上传jpg/png文件,且不超过500kb
|
|
|
- </div> -->
|
|
|
- </el-upload>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </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" style="width: 100%">
|
|
|
- <el-tab-pane v-for="(column, index) in tabColumns" :key="index" :label="column.title" :name="column.key">
|
|
|
- <el-table :data="params[column.key]" style="width: 100%">
|
|
|
- <el-table-column label="序号">
|
|
|
- <template slot-scope="scope">
|
|
|
- {{ scope.$index + 1 }}
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <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">
|
|
|
- <span v-if="!cColumn.type">
|
|
|
- {{ scope.row[cColumn.key] }}</span>
|
|
|
- <el-input v-if="cColumn.type === 'Input'" v-model="scope.row[cColumn.key]"
|
|
|
- :placeholder="cColumn.placeholder" :clearable="cColumn.clearable" :disabled="cColumn.disabled"
|
|
|
- :size="size" style="width: 100%"></el-input>
|
|
|
- <dr-popover-select v-if="cColumn.type === 'InputDialog'" v-model="scope.row[cColumn.key]"
|
|
|
- :placeholder="cColumn.placeholder" :clearable="cColumn.clearable" :disabled="cColumn.disabled"
|
|
|
- :readonly="cColumn.readonly" :title="cColumn.title" :type="cColumn.config.componentName"
|
|
|
- :data-mapping="cColumn.config.dataMapping" :source.sync="scope.row" :size="size">
|
|
|
- </dr-popover-select>
|
|
|
- <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="size"
|
|
|
- style="width: 100%"></el-input-number>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column fixed="right" label="操作" width="120">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-button @click.native.prevent="
|
|
|
- delTableRow(params[tabName], scope.$index)
|
|
|
- " type="text" size="small">
|
|
|
- 删行
|
|
|
- </el-button>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </el-tab-pane>
|
|
|
- </el-tabs>
|
|
|
- <el-row style="position: absolute; top: 20px; right: 20px">
|
|
|
- <el-button :size="size" @click="addTableRow(params[tabName])">增行</el-button>
|
|
|
- </el-row>
|
|
|
- </el-card>
|
|
|
+ <el-dialog :visible.sync="visible" title="新增" fullscreen @close="hide">
|
|
|
+ <el-form
|
|
|
+ ref="ruleForm"
|
|
|
+ v-loading="loading"
|
|
|
+ :size="size"
|
|
|
+ :rules="rules"
|
|
|
+ :model="params"
|
|
|
+ label-width="auto"
|
|
|
+ label-position="right"
|
|
|
+ >
|
|
|
+ <el-row :gutter="20" style="display: flex; flex-wrap: wrap">
|
|
|
+ <el-col
|
|
|
+ v-for="(column, index) in columns"
|
|
|
+ :key="index"
|
|
|
+ :span="column.span || 8"
|
|
|
+ >
|
|
|
+ <el-form-item :prop="column.key" :label="column.title">
|
|
|
+ <el-input
|
|
|
+ v-if="column.inputType === 'Input'"
|
|
|
+ v-model="params[column.key]"
|
|
|
+ :disabled="column.disabled"
|
|
|
+ :readonly="column.readonly"
|
|
|
+ :clearable="column.clearable"
|
|
|
+ :placeholder="column.placeholder"
|
|
|
+ style="width: 100%"
|
|
|
+ ></el-input>
|
|
|
+ <dr-popover-select
|
|
|
+ v-if="column.inputType === 'PopoverSelect'"
|
|
|
+ v-model="params[column.key]"
|
|
|
+ :source.sync="params"
|
|
|
+ :title="column.title"
|
|
|
+ :type="column.referName"
|
|
|
+ :disabled="column.disabled"
|
|
|
+ :readonly="column.readonly"
|
|
|
+ :clearable="column.clearable"
|
|
|
+ :placeholder="column.placeholder"
|
|
|
+ :data-mapping="column.dataMapping"
|
|
|
+ style="width: 100%"
|
|
|
+ >
|
|
|
+ </dr-popover-select>
|
|
|
+ <el-switch
|
|
|
+ v-if="column.inputType === 'Switch'"
|
|
|
+ v-model="params[column.key]"
|
|
|
+ active-value="1"
|
|
|
+ inactive-value="0"
|
|
|
+ >
|
|
|
+ </el-switch>
|
|
|
+ <file-upload
|
|
|
+ v-if="column.inputType === 'Upload'"
|
|
|
+ v-model="params[column.key]"
|
|
|
+ :file-type="column.fileType"
|
|
|
+ ></file-upload>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
</el-form>
|
|
|
- </el-drawer>
|
|
|
+ <div style="text-align: right">
|
|
|
+ <el-button :size="size" @click="hide">取 消</el-button>
|
|
|
+ <el-button :size="size" @click="submit('ruleForm')">新 增</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
</template>
|