|
|
@@ -2,21 +2,20 @@
|
|
|
<div class="bigBox">
|
|
|
<div class="info">
|
|
|
<p class="tt">基础信息</p>
|
|
|
- <div v-for="item in infoData[0]" :key="item.title">
|
|
|
- <span class="titlestyle">{{ item.value }}</span>
|
|
|
- <span
|
|
|
- class="infostyle"
|
|
|
- v-for="(val, index) in infoData[1]"
|
|
|
- :key="index"
|
|
|
- >{{ val[item.key] }}</span
|
|
|
- >
|
|
|
+ <div
|
|
|
+ class="base-info-item"
|
|
|
+ v-for="{ label, prop, value } in infoData"
|
|
|
+ :key="prop"
|
|
|
+ >
|
|
|
+ <span class="titlestyle">{{ label }}</span>
|
|
|
+ <span class="infostyle">{{ value }}</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="tableBox">
|
|
|
<div class="top">
|
|
|
- <div class="left" v-if="tableCount[0]">
|
|
|
- <p>{{ tableCount[0].statisticTitle }}</p>
|
|
|
- <i>{{ tableCount[0].result }}</i>
|
|
|
+ <div class="left" v-if="topTableCountInfo.length">
|
|
|
+ <p>{{ topTableCountInfo[0].title }}</p>
|
|
|
+ <i>{{ topTableCountInfo[0].value }}</i>
|
|
|
</div>
|
|
|
<div class="right">
|
|
|
<p>是否外协</p>
|
|
|
@@ -42,37 +41,47 @@
|
|
|
<el-form ref="tableform" :model="tableDataForm">
|
|
|
<el-table
|
|
|
border
|
|
|
- :data="tableData[1].data"
|
|
|
+ :data="tableData"
|
|
|
style="width: 100%; margin-bottom: 20px"
|
|
|
>
|
|
|
<el-table-column
|
|
|
- v-for="item in tableData[0].column"
|
|
|
- :prop="item.key"
|
|
|
- :label="item.value"
|
|
|
- :key="item.value"
|
|
|
+ v-for="item in columns"
|
|
|
+ :prop="item.prop"
|
|
|
+ :label="item.label"
|
|
|
+ :key="item.prop"
|
|
|
width="180"
|
|
|
+ align="center"
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
<el-input
|
|
|
- :v-if="scope.row[item.key]"
|
|
|
- v-model="scope.row[item.key]"
|
|
|
+ v-if="!scope.row.id"
|
|
|
+ v-model="scope.row[item.prop]"
|
|
|
></el-input>
|
|
|
+ <span v-else>
|
|
|
+ {{ scope.row[item.prop] }}
|
|
|
+ </span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
- v-if="isShowExcuteCol"
|
|
|
label="操作"
|
|
|
align="center"
|
|
|
class-name="small-padding fixed-width"
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
- <Menu
|
|
|
+ <!-- <Menu
|
|
|
:row="scope.row"
|
|
|
v-for="btnObj in excuteBtnArr"
|
|
|
:key="btnObj.id"
|
|
|
:listAll="btnObj"
|
|
|
@excuteHandler="excuteHandler"
|
|
|
- ></Menu>
|
|
|
+ ></Menu> -->
|
|
|
+ <el-button
|
|
|
+ type="danger"
|
|
|
+ size="small"
|
|
|
+ @click="deleteHandler(scope.$index, scope.row)"
|
|
|
+ >
|
|
|
+ 删除
|
|
|
+ </el-button>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
@@ -80,7 +89,7 @@
|
|
|
<div>
|
|
|
<b>统计信息 </b>
|
|
|
<span v-for="(item, index) in subCount" :key="index"
|
|
|
- >{{ item.statisticTitle }}: {{ item.result }}</span
|
|
|
+ >{{ item.title }}: {{ item.value }}</span
|
|
|
>
|
|
|
</div>
|
|
|
|
|
|
@@ -108,6 +117,9 @@ import {
|
|
|
btnCommonApi,
|
|
|
dragTableInfo,
|
|
|
unionListTableData,
|
|
|
+ getStatisticList,
|
|
|
+ addTableData,
|
|
|
+ delTableData,
|
|
|
} from "@/api/tablelist/commonTable";
|
|
|
import { camelCase } from "@/utils";
|
|
|
import Menu from "@/views/tablelist/commonTable/BtnMenu.vue";
|
|
|
@@ -120,12 +132,22 @@ export default {
|
|
|
components: { Menu },
|
|
|
data() {
|
|
|
return {
|
|
|
+ conditions: {}, //查询条件
|
|
|
+ // 当前行信息
|
|
|
+ row: {},
|
|
|
+ groupKey: "",
|
|
|
// 基础信息行数据
|
|
|
infoData: [],
|
|
|
listInfo: {},
|
|
|
// 是否外协
|
|
|
checked: false,
|
|
|
+ topTableCountInfo: [], //上部状态统计信息
|
|
|
+ // 表格数据
|
|
|
tableData: [],
|
|
|
+ columns: [],
|
|
|
+ tableBtnInfo: {},
|
|
|
+ subTableName: "",
|
|
|
+ subCount: [], //表格统计数据
|
|
|
// 动态增加表格数据
|
|
|
editData: [],
|
|
|
tableDataForm: {},
|
|
|
@@ -148,7 +170,6 @@ export default {
|
|
|
// tableCondition: ''
|
|
|
},
|
|
|
},
|
|
|
- columns: [],
|
|
|
// 排序方式 默认降序
|
|
|
sortOrder: true,
|
|
|
tableName: "",
|
|
|
@@ -165,7 +186,7 @@ export default {
|
|
|
controlBtnArr: [],
|
|
|
};
|
|
|
},
|
|
|
- props: ["groupKey", "rowobj", "tableCount", "subCount", "subTableName"],
|
|
|
+ props: ["rowobj", "tableCount"],
|
|
|
computed: {
|
|
|
isShowExcuteCol() {
|
|
|
return !this.excuteBtnArr?.every((arr) => arr.children.length == 0);
|
|
|
@@ -177,33 +198,151 @@ export default {
|
|
|
let obj = {
|
|
|
// id:'',
|
|
|
};
|
|
|
+ this.columns.forEach((item) => {
|
|
|
+ obj[item.prop] = "";
|
|
|
+ });
|
|
|
+ console.log(obj);
|
|
|
this.addListData.push(obj);
|
|
|
- this.tableData[1].data.push(obj);
|
|
|
+ this.tableData.push(obj);
|
|
|
},
|
|
|
// 保存
|
|
|
saveBtnHandler() {
|
|
|
- console.log(this.addListData);
|
|
|
+ let addCondition = {
|
|
|
+ task_key: this.row.bpmExecuteProcessTaskKey,
|
|
|
+ task_node_key: this.row.benTaskNodeKey,
|
|
|
+ };
|
|
|
+ // console.log(this.conditions);
|
|
|
+ // for (const key in this.conditions) {
|
|
|
+ // addCondition[key.replace("#{", "").split(".")[1]] =
|
|
|
+ // this.conditions[key];
|
|
|
+ // }
|
|
|
+ let addListData = this.tableData.filter((item) => !item.id);
|
|
|
+ addListData.forEach((item) => {
|
|
|
+ Object.assign(item, addCondition);
|
|
|
+ });
|
|
|
+
|
|
|
let data = {
|
|
|
- addListMap: this.addListData,
|
|
|
+ addListMap: addListData,
|
|
|
basicMap: {
|
|
|
- btnType: 10,
|
|
|
+ // btnType: "INSERT",
|
|
|
tableName: this.subTableName,
|
|
|
- visible: true,
|
|
|
+ // visible: true,
|
|
|
},
|
|
|
commMap: {},
|
|
|
conditionMap: {},
|
|
|
};
|
|
|
- btnCommonApi(data).then((res) => {
|
|
|
+ // btnCommonApi(data).then((res) => {
|
|
|
+ // console.log("保存", res);
|
|
|
+ // });
|
|
|
+ addTableData(data).then((res) => {
|
|
|
console.log("保存", res);
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.reloadInfo();
|
|
|
+ this.$message.success("保存成功!");
|
|
|
+ } else {
|
|
|
+ this.$message.error("网络异常,请稍后保存");
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 设置基础信息-表格信息
|
|
|
+ setBaseInfo(baseObj, dataObj) {
|
|
|
+ let tempObj = JSON.parse(baseObj.dtColumnNameEcho);
|
|
|
+ let Keys = tempObj.map((item) => {
|
|
|
+ return {
|
|
|
+ prop: Object.keys(item)[0],
|
|
|
+ label: item[Object.keys(item)[0]],
|
|
|
+ };
|
|
|
+ });
|
|
|
+ this.infoData = Keys.map((item) => {
|
|
|
+ return {
|
|
|
+ ...item,
|
|
|
+ value: dataObj.resultMap[item.prop],
|
|
|
+ };
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 设置表格数据
|
|
|
+ async setTableData(tableInfo, tableData) {
|
|
|
+ let { dtColumnNameEcho, dragTableBtnList, tableKey, dtTableName } =
|
|
|
+ tableInfo;
|
|
|
+ this.tableData =
|
|
|
+ tableData.map((item) => {
|
|
|
+ return item.resultMap;
|
|
|
+ }) || [];
|
|
|
+ console.log(this.tableData);
|
|
|
+ this.subTableName = dtTableName;
|
|
|
+ console.log(this.subTableName);
|
|
|
+ this.tableBtnInfo = dragTableBtnList;
|
|
|
+ this.columns = JSON.parse(dtColumnNameEcho)?.map((item) => {
|
|
|
+ let prop = Object.keys(item)[0];
|
|
|
+ return {
|
|
|
+ prop,
|
|
|
+ label: item[prop],
|
|
|
+ };
|
|
|
+ });
|
|
|
+ let res = await this.getStatisticsData(tableKey);
|
|
|
+ this.subCount = res.map((item) => {
|
|
|
+ return {
|
|
|
+ title: item.statisticTitle,
|
|
|
+ value: item.result,
|
|
|
+ };
|
|
|
});
|
|
|
},
|
|
|
+ // 设置顶部状态数据
|
|
|
+ setTopData(baseObj, dataObj) {
|
|
|
+ let { dtColumnNameEcho, dragTableBtnList, tableKey } = baseObj;
|
|
|
+ console.log(dragTableBtnList);
|
|
|
+ let temp = JSON.parse(dtColumnNameEcho) || [];
|
|
|
+ this.topTableCountInfo = temp.map((item) => {
|
|
|
+ let prop = camelCase(Object.keys(item)[0]);
|
|
|
+ return {
|
|
|
+ prop,
|
|
|
+ title: item[Object.keys(item)[0]],
|
|
|
+ value: dataObj.resultMap[prop] || "未知状态",
|
|
|
+ };
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 获取统计数据
|
|
|
+ async getStatisticsData(tableKey) {
|
|
|
+ try {
|
|
|
+ let res = await getStatisticList({
|
|
|
+ queryMap: { tableKey, ...this.conditions },
|
|
|
+ });
|
|
|
+ if (res.code == 200) {
|
|
|
+ console.log(res);
|
|
|
+ return res.data;
|
|
|
+ } else {
|
|
|
+ throw new Error();
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.log(error);
|
|
|
+ this.$message.error("网络异常,获取数据失败");
|
|
|
+ }
|
|
|
+ },
|
|
|
+ reloadInfo() {
|
|
|
+ let { row, groupKey } = this;
|
|
|
+ this.getLists({ row, groupKey });
|
|
|
+ },
|
|
|
// 获取弹窗信息
|
|
|
async getLists(payload) {
|
|
|
// let res = await dragGroupTableInfo({ queryMap: { groupKey: groupKey } });
|
|
|
- let resTableInfo = await getProcessPopupTableInfo({ queryMap: payload });
|
|
|
- let resTableData = await getProcessPopupTableList({ queryMap: payload });
|
|
|
+ this.addListData = [];
|
|
|
+ this.row = payload.row;
|
|
|
+ this.groupKey = payload.groupKey;
|
|
|
+ let resTableInfo = await getProcessPopupTableInfo({
|
|
|
+ queryMap: { groupKey: payload.groupKey },
|
|
|
+ });
|
|
|
+
|
|
|
+ if (resTableInfo.code == 200) {
|
|
|
+ let res = await this.getTableData(resTableInfo.data, payload.row);
|
|
|
+ let { template } = resTableInfo.data.resultMap;
|
|
|
+ this.setBaseInfo(template[0], res[0][0]); //设置基础信息
|
|
|
+ this.setTableData(template[1], res[1]);
|
|
|
+ this.setTopData(template[2], res[2][0]);
|
|
|
+ }
|
|
|
+
|
|
|
// 获取表格tablekey 和 sort
|
|
|
- console.log(resTableData);
|
|
|
+ console.log(resTableInfo);
|
|
|
+ return;
|
|
|
this.tableLists = JSON.parse(res.msg);
|
|
|
|
|
|
this.tableLists.forEach(async (item) => {
|
|
|
@@ -242,6 +381,34 @@ export default {
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
+ // 获取所有表格数据
|
|
|
+ async getTableData(tableInfo, row) {
|
|
|
+ let queryMap = {
|
|
|
+ groupKey: this.groupKey,
|
|
|
+ },
|
|
|
+ conditionKeys = [];
|
|
|
+ conditionKeys = tableInfo.resultMap?.condition.map((item) =>
|
|
|
+ camelCase(item.replace("#{", "").replace(".", "_"))
|
|
|
+ );
|
|
|
+ this.conditions = {};
|
|
|
+ conditionKeys.forEach((item, index) => {
|
|
|
+ queryMap[tableInfo.resultMap?.condition[index]] = row[item];
|
|
|
+ this.conditions[tableInfo.resultMap?.condition[index]] = row[item];
|
|
|
+ });
|
|
|
+
|
|
|
+ try {
|
|
|
+ let resTableData = await getProcessPopupTableList({
|
|
|
+ queryMap,
|
|
|
+ });
|
|
|
+ if (resTableData.code == 200) {
|
|
|
+ console.log("resTableData", resTableData);
|
|
|
+ return resTableData.data.resultMap.result;
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.log(error);
|
|
|
+ this.$message.error("网络异常");
|
|
|
+ }
|
|
|
+ },
|
|
|
// 获取基础信息 表头数据
|
|
|
async getTableHandle(res, sort) {
|
|
|
this.columns = [];
|
|
|
@@ -336,6 +503,15 @@ export default {
|
|
|
return this.tableList;
|
|
|
}
|
|
|
},
|
|
|
+ // 删除回调
|
|
|
+ async deleteHandler(index, row) {
|
|
|
+ if (row.id) {
|
|
|
+ // 发送请求 删除数据
|
|
|
+ let res = await delTableData();
|
|
|
+ } else {
|
|
|
+ this.tableData.splice(index, 1);
|
|
|
+ }
|
|
|
+ },
|
|
|
// 处理列表信息
|
|
|
columnsHandler(columns) {
|
|
|
let resArr = [];
|
|
|
@@ -426,7 +602,7 @@ export default {
|
|
|
border-radius: 20px;
|
|
|
}
|
|
|
.infostyle {
|
|
|
- background-color: #ebedf2;
|
|
|
+ // background-color: #ebedf2;
|
|
|
color: #e84e95;
|
|
|
}
|
|
|
}
|
|
|
@@ -489,4 +665,8 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+.base-info-item {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+}
|
|
|
</style>
|
lph