|
|
@@ -2,22 +2,43 @@
|
|
|
<a-table :data="table_data" :pagination="false" :bordered="false" :scroll="scroll" :loading="is_loading">
|
|
|
<!-- <a-table :data="table_data" :pagination="false" :bordered="false" :scroll="scroll" :loading="is_loading"> -->
|
|
|
<template #columns>
|
|
|
- <a-table-column v-for="item in columns" :key="item.dataIndex" :title="item.title" :data-index="item.dataIndex"
|
|
|
- :header-cell-style="{ backgroundColor: '#E6F2F2' }" align="center" :width="item.width">
|
|
|
+ <a-table-column
|
|
|
+ v-for="item in columns"
|
|
|
+ :key="item.dataIndex"
|
|
|
+ :title="item.title"
|
|
|
+ :data-index="item.dataIndex"
|
|
|
+ :header-cell-style="{ backgroundColor: 'var(--table-th-bg)' }"
|
|
|
+ align="center"
|
|
|
+ :width="item.width"
|
|
|
+ >
|
|
|
<template #cell="{ record, column, rowIndex }">
|
|
|
<div class="column" v-if="item.dataIndex === 'title'">
|
|
|
<!-- <a-input v-model="table_data[rowIndex].title" :disabled="table_data[rowIndex].disabled"
|
|
|
@change="inputChange(rowIndex)" :style="{ width: '150px' }" placeholder="列名" /> -->
|
|
|
- <a-select v-model="table_data[rowIndex].shown_title" @change="selectChangeTitle(rowIndex)"
|
|
|
- :disabled="table_data[rowIndex].disabled" :style="{ width: '150px' }" placeholder="数据类型">
|
|
|
- <a-option v-for="item in sheet_title_list" :key="item.title" :value="item.all_title"
|
|
|
- :disabled="item.disabled">{{ item.all_title
|
|
|
- }}</a-option>
|
|
|
+ <a-select
|
|
|
+ v-model="table_data[rowIndex].shown_title"
|
|
|
+ @change="selectChangeTitle(rowIndex)"
|
|
|
+ :disabled="table_data[rowIndex].disabled"
|
|
|
+ :style="{ width: '150px' }"
|
|
|
+ placeholder="数据类型"
|
|
|
+ >
|
|
|
+ <a-option
|
|
|
+ v-for="item in sheet_title_list"
|
|
|
+ :key="item.title"
|
|
|
+ :value="item.all_title"
|
|
|
+ :disabled="item.disabled"
|
|
|
+ >{{ item.all_title }}</a-option
|
|
|
+ >
|
|
|
</a-select>
|
|
|
</div>
|
|
|
<div class="column" v-if="item.dataIndex === 'rule_type'">
|
|
|
- <a-select v-model="table_data[rowIndex].rule_type" @change="selectChange(rowIndex)"
|
|
|
- :disabled="table_data[rowIndex].disabled" :style="{ width: '150px' }" placeholder="数据类型">
|
|
|
+ <a-select
|
|
|
+ v-model="table_data[rowIndex].rule_type"
|
|
|
+ @change="selectChange(rowIndex)"
|
|
|
+ :disabled="table_data[rowIndex].disabled"
|
|
|
+ :style="{ width: '150px' }"
|
|
|
+ placeholder="数据类型"
|
|
|
+ >
|
|
|
<a-option v-for="item in data_types" :key="item.label" :value="item.value">{{ item.label }}</a-option>
|
|
|
</a-select>
|
|
|
</div>
|
|
|
@@ -25,45 +46,89 @@
|
|
|
<a-tooltip :content="table_data[rowIndex].rule_text">
|
|
|
<div class="rule_range">{{ table_data[rowIndex].rule_text }}</div>
|
|
|
</a-tooltip>
|
|
|
- <a-trigger ref="triggerRefs" :popup-visible="table_data[rowIndex].show_trigger"
|
|
|
- @popup-visible-change="(val) => handleVisibleChange(val, rowIndex)" trigger="click"
|
|
|
- :unmount-on-close="false" :popup-translate="[-180, 20]" scroll-to-close>
|
|
|
- <img class="icon" src="../../../assets/chat_excel/expond.svg" alt="">
|
|
|
+ <a-trigger
|
|
|
+ ref="triggerRefs"
|
|
|
+ :popup-visible="table_data[rowIndex].show_trigger"
|
|
|
+ @popup-visible-change="(val) => handleVisibleChange(val, rowIndex)"
|
|
|
+ trigger="click"
|
|
|
+ :unmount-on-close="false"
|
|
|
+ :popup-translate="[-180, 20]"
|
|
|
+ scroll-to-close
|
|
|
+ >
|
|
|
+ <img class="icon" src="../../../assets/chat_excel/expond.svg" alt="" />
|
|
|
<template #content>
|
|
|
<div class="demo-basic">
|
|
|
- <RuleConfig v-if="table_data[rowIndex].show_trigger" :type="table_data[rowIndex].rule_type"
|
|
|
- :index="rowIndex" :rules="table_data[rowIndex].rule_data" @closeConfig="closeRuleConfig"
|
|
|
- @saveConfig="saveRuleConfig">
|
|
|
+ <RuleConfig
|
|
|
+ v-if="table_data[rowIndex].show_trigger"
|
|
|
+ :type="table_data[rowIndex].rule_type"
|
|
|
+ :index="rowIndex"
|
|
|
+ :rules="table_data[rowIndex].rule_data"
|
|
|
+ @closeConfig="closeRuleConfig"
|
|
|
+ @saveConfig="saveRuleConfig"
|
|
|
+ >
|
|
|
</RuleConfig>
|
|
|
</div>
|
|
|
</template>
|
|
|
</a-trigger>
|
|
|
</div>
|
|
|
<div class="column" v-if="item.dataIndex === 'repeat'">
|
|
|
- <a-switch v-model="table_data[rowIndex].rule_data.repeat" :checked-value="1" :unchecked-value="2"
|
|
|
- :disabled="table_data[rowIndex].disabled" checked-color="#0A817E"
|
|
|
- @change="switchRepeatChange(rowIndex)" />
|
|
|
+ <a-switch
|
|
|
+ v-model="table_data[rowIndex].rule_data.repeat"
|
|
|
+ :checked-value="1"
|
|
|
+ :unchecked-value="2"
|
|
|
+ :disabled="table_data[rowIndex].disabled"
|
|
|
+ checked-color="#0A817E"
|
|
|
+ @change="switchRepeatChange(rowIndex)"
|
|
|
+ />
|
|
|
</div>
|
|
|
<div class="column" v-if="item.dataIndex === 'required'">
|
|
|
- <a-switch v-model="table_data[rowIndex].rule_data.required" :checked-value="1" :unchecked-value="2"
|
|
|
- :disabled="table_data[rowIndex].disabled" checked-color="#0A817E"
|
|
|
- @change="switchRequiredChange(rowIndex)" />
|
|
|
+ <a-switch
|
|
|
+ v-model="table_data[rowIndex].rule_data.required"
|
|
|
+ :checked-value="1"
|
|
|
+ :unchecked-value="2"
|
|
|
+ :disabled="table_data[rowIndex].disabled"
|
|
|
+ checked-color="#0A817E"
|
|
|
+ @change="switchRequiredChange(rowIndex)"
|
|
|
+ />
|
|
|
</div>
|
|
|
<div class="operate" v-if="item.dataIndex === 'operate'">
|
|
|
- <a-popconfirm content-class="my_custom_popconfirm" content="确认删除该条数据?" type="warning"
|
|
|
- @ok="toRemoveRule(rowIndex)">
|
|
|
- <img class="icon" src="../../../assets/chat-report/reduce.svg" v-if="!table_data[rowIndex].is_edit"
|
|
|
- alt="">
|
|
|
+ <a-popconfirm
|
|
|
+ content-class="my_custom_popconfirm"
|
|
|
+ content="确认删除该条数据?"
|
|
|
+ type="warning"
|
|
|
+ @ok="toRemoveRule(rowIndex)"
|
|
|
+ >
|
|
|
+ <img
|
|
|
+ class="icon"
|
|
|
+ src="../../../assets/chat-report/reduce.svg"
|
|
|
+ v-if="!table_data[rowIndex].is_edit"
|
|
|
+ alt=""
|
|
|
+ />
|
|
|
</a-popconfirm>
|
|
|
|
|
|
- <img class="icon" :class="table_data.length > 1 ? 'icon_add' : 'icon_add_only'"
|
|
|
+ <img
|
|
|
+ class="icon"
|
|
|
+ :class="table_data.length > 1 ? 'icon_add' : 'icon_add_only'"
|
|
|
src="../../../assets/chat-report/add.svg"
|
|
|
- v-if="!table_data[rowIndex].is_edit && rowIndex == table_data.length - 1" alt="" @click=addRule(rowIndex)>
|
|
|
- <img class="icon" :class="table_data.length > 1 ? 'icon_add' : 'icon_add_only'"
|
|
|
- src="../../../assets/chat_excel/close.svg" v-if="table_data[rowIndex].is_edit" alt=""
|
|
|
- @click=unsaveRule(rowIndex)>
|
|
|
- <img class="icon" src="../../../assets/chat_excel/changed.svg" v-if="table_data[rowIndex].is_edit" alt=""
|
|
|
- @click=saveRule(rowIndex)>
|
|
|
+ v-if="!table_data[rowIndex].is_edit && rowIndex == table_data.length - 1"
|
|
|
+ alt=""
|
|
|
+ @click="addRule(rowIndex)"
|
|
|
+ />
|
|
|
+ <img
|
|
|
+ class="icon"
|
|
|
+ :class="table_data.length > 1 ? 'icon_add' : 'icon_add_only'"
|
|
|
+ src="../../../assets/chat_excel/close.svg"
|
|
|
+ v-if="table_data[rowIndex].is_edit"
|
|
|
+ alt=""
|
|
|
+ @click="unsaveRule(rowIndex)"
|
|
|
+ />
|
|
|
+ <img
|
|
|
+ class="icon"
|
|
|
+ src="../../../assets/chat_excel/changed.svg"
|
|
|
+ v-if="table_data[rowIndex].is_edit"
|
|
|
+ alt=""
|
|
|
+ @click="saveRule(rowIndex)"
|
|
|
+ />
|
|
|
</div>
|
|
|
</template>
|
|
|
</a-table-column>
|
|
|
@@ -72,13 +137,13 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-import { reactive, ref, computed, watch } from 'vue'
|
|
|
+import { reactive, ref, computed, watch } from 'vue';
|
|
|
import RuleConfig from './rule-setting/RuleConfig.vue';
|
|
|
import { deleteTableRules, addTableRules, editTableRules } from '../../table-dialog/api-dialog';
|
|
|
import { Message } from '@arco-design/web-vue';
|
|
|
import { getUserId } from '../../../utils/get-user-id';
|
|
|
import { getRuleText } from './use-rule-format';
|
|
|
-import { funcDebounce } from '../../../utils/utils'
|
|
|
+import { funcDebounce } from '../../../utils/utils';
|
|
|
|
|
|
const props = defineProps({
|
|
|
table_list: Array,
|
|
|
@@ -86,9 +151,9 @@ const props = defineProps({
|
|
|
is_loading: Boolean,
|
|
|
event_id: String,
|
|
|
sheet_name: String
|
|
|
-})
|
|
|
+});
|
|
|
|
|
|
-const emit = defineEmits(['updateList'])
|
|
|
+const emit = defineEmits(['updateList']);
|
|
|
|
|
|
const scroll = {
|
|
|
x: '100%',
|
|
|
@@ -110,24 +175,24 @@ const columns = [
|
|
|
title: '校验规则',
|
|
|
dataIndex: 'data_range',
|
|
|
slotName: 'data_range',
|
|
|
- width: 400 // 增加校验规则列的宽度
|
|
|
+ width: 400 // 增加校验规则列的宽度
|
|
|
},
|
|
|
{
|
|
|
title: '重复值校验',
|
|
|
- dataIndex: 'repeat',
|
|
|
+ dataIndex: 'repeat'
|
|
|
},
|
|
|
{
|
|
|
title: '是否必填',
|
|
|
dataIndex: 'required',
|
|
|
- slotName: 'required',
|
|
|
+ slotName: 'required'
|
|
|
},
|
|
|
{
|
|
|
title: '操作',
|
|
|
- dataIndex: 'operate',
|
|
|
- },
|
|
|
-]
|
|
|
+ dataIndex: 'operate'
|
|
|
+ }
|
|
|
+];
|
|
|
|
|
|
-const table_data = reactive([])
|
|
|
+const table_data = reactive([]);
|
|
|
|
|
|
const data_types = [
|
|
|
{
|
|
|
@@ -149,32 +214,31 @@ const data_types = [
|
|
|
{
|
|
|
label: '百分比',
|
|
|
value: 'percentage'
|
|
|
- },
|
|
|
-]
|
|
|
+ }
|
|
|
+];
|
|
|
|
|
|
const sheet_title_list = computed(() => {
|
|
|
- const list_all = props.title_list
|
|
|
- const table_data_title_list = table_data.map(item => item.title)
|
|
|
- list_all.forEach(item => {
|
|
|
+ const list_all = props.title_list;
|
|
|
+ const table_data_title_list = table_data.map((item) => item.title);
|
|
|
+ list_all.forEach((item) => {
|
|
|
if (table_data_title_list.includes(item.title)) {
|
|
|
- item.disabled = true
|
|
|
+ item.disabled = true;
|
|
|
} else {
|
|
|
- item.disabled = false
|
|
|
+ item.disabled = false;
|
|
|
}
|
|
|
- })
|
|
|
- return list_all
|
|
|
-})
|
|
|
-
|
|
|
-const triggerRefs = ref(null)
|
|
|
+ });
|
|
|
+ return list_all;
|
|
|
+});
|
|
|
|
|
|
+const triggerRefs = ref(null);
|
|
|
|
|
|
const addRule = () => {
|
|
|
- if (table_data.some(item => item.is_edit)) return
|
|
|
- table_data.forEach(item => {
|
|
|
- item.show_trigger = false
|
|
|
- item.is_edit = false
|
|
|
- item.disabled = true
|
|
|
- })
|
|
|
+ if (table_data.some((item) => item.is_edit)) return;
|
|
|
+ table_data.forEach((item) => {
|
|
|
+ item.show_trigger = false;
|
|
|
+ item.is_edit = false;
|
|
|
+ item.disabled = true;
|
|
|
+ });
|
|
|
|
|
|
table_data.push({
|
|
|
title: '',
|
|
|
@@ -188,198 +252,209 @@ const addRule = () => {
|
|
|
disabled: false,
|
|
|
is_edit: true,
|
|
|
rule_text: ''
|
|
|
- })
|
|
|
-}
|
|
|
-const toRemoveRule = funcDebounce(async (idx) => {
|
|
|
- await removeRule(idx)
|
|
|
-}, 500, true)
|
|
|
+ });
|
|
|
+};
|
|
|
+const toRemoveRule = funcDebounce(
|
|
|
+ async (idx) => {
|
|
|
+ await removeRule(idx);
|
|
|
+ },
|
|
|
+ 500,
|
|
|
+ true
|
|
|
+);
|
|
|
const removeRule = async (idx) => {
|
|
|
- if (table_data[idx].disabled) return
|
|
|
- table_data[idx].disabled = true
|
|
|
- const res = await deleteCommonRulesFunc({ table_rule_id: table_data[idx].id, event_id: props.event_id, sheet_name: props.sheet_name })
|
|
|
+ if (table_data[idx].disabled) return;
|
|
|
+ table_data[idx].disabled = true;
|
|
|
+ const res = await deleteCommonRulesFunc({
|
|
|
+ table_rule_id: table_data[idx].id,
|
|
|
+ event_id: props.event_id,
|
|
|
+ sheet_name: props.sheet_name
|
|
|
+ });
|
|
|
if (res.code / 1 == 200) {
|
|
|
table_data.splice(idx, 1);
|
|
|
} else {
|
|
|
- table_data[idx].disabled = false
|
|
|
- Message.error('删除失败')
|
|
|
+ table_data[idx].disabled = false;
|
|
|
+ Message.error('删除失败');
|
|
|
}
|
|
|
-
|
|
|
-}
|
|
|
-const saveRule = funcDebounce(async (idx) => {
|
|
|
- if (table_data[idx].disabled) return
|
|
|
- table_data[idx].disabled = true
|
|
|
- const user_id = await getUserId()
|
|
|
- const data = table_data[idx]
|
|
|
-
|
|
|
- if (table_data[idx].shown_title.split('-').length > 1) {
|
|
|
- table_data[idx].title = table_data[idx].shown_title.split('-')[1]
|
|
|
- }
|
|
|
- if (!data.title.trim()) {
|
|
|
- return Message.error('列名必填')
|
|
|
- }
|
|
|
- // 编辑
|
|
|
- if (data.id) {
|
|
|
- const params_data = {
|
|
|
- title: data.title,
|
|
|
- rule_type: data.rule_type,
|
|
|
- rule_data: data.rule_data,
|
|
|
- user_id,
|
|
|
- event_id: props.event_id,
|
|
|
- sheet_name: props.sheet_name,
|
|
|
- table_rule_id: data.id,
|
|
|
- col_idx: data.col_idx,
|
|
|
- }
|
|
|
- const res = await editCommonRulesFunc(params_data)
|
|
|
- if (res.code / 1 === 200) {
|
|
|
- Message.success('编辑成功')
|
|
|
- emit('updateList')
|
|
|
- table_data.forEach(item => {
|
|
|
- item.is_edit = false
|
|
|
- item.disabled = false
|
|
|
- })
|
|
|
- } else {
|
|
|
- Message.error(res.msg)
|
|
|
+};
|
|
|
+const saveRule = funcDebounce(
|
|
|
+ async (idx) => {
|
|
|
+ if (table_data[idx].disabled) return;
|
|
|
+ table_data[idx].disabled = true;
|
|
|
+ const user_id = await getUserId();
|
|
|
+ const data = table_data[idx];
|
|
|
+
|
|
|
+ if (table_data[idx].shown_title.split('-').length > 1) {
|
|
|
+ table_data[idx].title = table_data[idx].shown_title.split('-')[1];
|
|
|
}
|
|
|
-
|
|
|
- } else {
|
|
|
- // 新增
|
|
|
- const params_data = {
|
|
|
- title: data.title,
|
|
|
- rule_type: data.rule_type,
|
|
|
- rule_data: data.rule_data,
|
|
|
- user_id,
|
|
|
- event_id: props.event_id,
|
|
|
- sheet_name: props.sheet_name,
|
|
|
- col_idx: data.col_idx
|
|
|
+ if (!data.title.trim()) {
|
|
|
+ return Message.error('列名必填');
|
|
|
}
|
|
|
- const res = await addCommonRulesFunc(params_data)
|
|
|
- if (res.code / 1 === 200) {
|
|
|
- Message.success('新增成功')
|
|
|
- emit('updateList')
|
|
|
- table_data.forEach(item => {
|
|
|
- item.is_edit = false
|
|
|
- item.disabled = false
|
|
|
- })
|
|
|
+ // 编辑
|
|
|
+ if (data.id) {
|
|
|
+ const params_data = {
|
|
|
+ title: data.title,
|
|
|
+ rule_type: data.rule_type,
|
|
|
+ rule_data: data.rule_data,
|
|
|
+ user_id,
|
|
|
+ event_id: props.event_id,
|
|
|
+ sheet_name: props.sheet_name,
|
|
|
+ table_rule_id: data.id,
|
|
|
+ col_idx: data.col_idx
|
|
|
+ };
|
|
|
+ const res = await editCommonRulesFunc(params_data);
|
|
|
+ if (res.code / 1 === 200) {
|
|
|
+ Message.success('编辑成功');
|
|
|
+ emit('updateList');
|
|
|
+ table_data.forEach((item) => {
|
|
|
+ item.is_edit = false;
|
|
|
+ item.disabled = false;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ Message.error(res.msg);
|
|
|
+ }
|
|
|
} else {
|
|
|
- Message.error(res.msg)
|
|
|
+ // 新增
|
|
|
+ const params_data = {
|
|
|
+ title: data.title,
|
|
|
+ rule_type: data.rule_type,
|
|
|
+ rule_data: data.rule_data,
|
|
|
+ user_id,
|
|
|
+ event_id: props.event_id,
|
|
|
+ sheet_name: props.sheet_name,
|
|
|
+ col_idx: data.col_idx
|
|
|
+ };
|
|
|
+ const res = await addCommonRulesFunc(params_data);
|
|
|
+ if (res.code / 1 === 200) {
|
|
|
+ Message.success('新增成功');
|
|
|
+ emit('updateList');
|
|
|
+ table_data.forEach((item) => {
|
|
|
+ item.is_edit = false;
|
|
|
+ item.disabled = false;
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ Message.error(res.msg);
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
-}, 500, true)
|
|
|
+ },
|
|
|
+ 500,
|
|
|
+ true
|
|
|
+);
|
|
|
const unsaveRule = (idx) => {
|
|
|
-
|
|
|
if (table_data[idx].id) {
|
|
|
- const origin_data = table_data[idx].origin_data
|
|
|
- table_data[idx] = { ...origin_data, origin_data }
|
|
|
- table_data.forEach(item => {
|
|
|
- item.disabled = false
|
|
|
- item.is_edit = false
|
|
|
- })
|
|
|
+ const origin_data = table_data[idx].origin_data;
|
|
|
+ table_data[idx] = { ...origin_data, origin_data };
|
|
|
+ table_data.forEach((item) => {
|
|
|
+ item.disabled = false;
|
|
|
+ item.is_edit = false;
|
|
|
+ });
|
|
|
} else {
|
|
|
- table_data.splice(table_data.length - 1, 1)
|
|
|
- table_data.forEach(item => {
|
|
|
- item.disabled = false
|
|
|
- item.is_edit = false
|
|
|
- })
|
|
|
+ table_data.splice(table_data.length - 1, 1);
|
|
|
+ table_data.forEach((item) => {
|
|
|
+ item.disabled = false;
|
|
|
+ item.is_edit = false;
|
|
|
+ });
|
|
|
}
|
|
|
-}
|
|
|
+};
|
|
|
|
|
|
const saveRuleConfig = (data) => {
|
|
|
- const { idx, rule_data } = data
|
|
|
+ const { idx, rule_data } = data;
|
|
|
table_data[idx].rule_data = {
|
|
|
// ...table_data[idx].rule_data,
|
|
|
repeat: table_data[idx].rule_data.repeat,
|
|
|
required: table_data[idx].rule_data.required,
|
|
|
...rule_data
|
|
|
- }
|
|
|
- table_data[idx].rule_text = getRuleText(idx, table_data)
|
|
|
+ };
|
|
|
+ table_data[idx].rule_text = getRuleText(idx, table_data);
|
|
|
// 所有数据都是禁用状态
|
|
|
- commonFunToChangeStatus(idx)
|
|
|
- table_data[idx].show_trigger = false
|
|
|
-}
|
|
|
+ commonFunToChangeStatus(idx);
|
|
|
+ table_data[idx].show_trigger = false;
|
|
|
+};
|
|
|
|
|
|
const closeRuleConfig = (index) => {
|
|
|
- table_data[index].show_trigger = false
|
|
|
-}
|
|
|
+ table_data[index].show_trigger = false;
|
|
|
+};
|
|
|
|
|
|
const selectChangeTitle = (idx) => {
|
|
|
- commonFunToChangeStatus(idx)
|
|
|
- const col_name = table_data[idx].shown_title.split('-')[0]
|
|
|
+ commonFunToChangeStatus(idx);
|
|
|
+ const col_name = table_data[idx].shown_title.split('-')[0];
|
|
|
if (col_name) {
|
|
|
- table_data[idx].col_idx = props.title_list.find(item => item.col_name == col_name).col_idx
|
|
|
+ table_data[idx].col_idx = props.title_list.find((item) => item.col_name == col_name).col_idx;
|
|
|
}
|
|
|
-}
|
|
|
+};
|
|
|
|
|
|
const selectChange = (idx) => {
|
|
|
- commonFunToChangeStatus(idx)
|
|
|
+ commonFunToChangeStatus(idx);
|
|
|
table_data[idx].rule_data = {
|
|
|
repeat: table_data[idx].rule_data.repeat,
|
|
|
- required: table_data[idx].rule_data.required,
|
|
|
- }
|
|
|
-
|
|
|
-}
|
|
|
+ required: table_data[idx].rule_data.required
|
|
|
+ };
|
|
|
+};
|
|
|
|
|
|
const switchRepeatChange = (idx) => {
|
|
|
- commonFunToChangeStatus(idx)
|
|
|
-}
|
|
|
+ commonFunToChangeStatus(idx);
|
|
|
+};
|
|
|
|
|
|
const switchRequiredChange = (idx) => {
|
|
|
- commonFunToChangeStatus(idx)
|
|
|
-}
|
|
|
+ commonFunToChangeStatus(idx);
|
|
|
+};
|
|
|
|
|
|
const handleVisibleChange = (value, idx) => {
|
|
|
- if (table_data[idx].disabled) return
|
|
|
- table_data[idx].show_trigger = value
|
|
|
-}
|
|
|
+ if (table_data[idx].disabled) return;
|
|
|
+ table_data[idx].show_trigger = value;
|
|
|
+};
|
|
|
|
|
|
const commonFunToChangeStatus = (idx) => {
|
|
|
- table_data.forEach(item => {
|
|
|
- item.disabled = true
|
|
|
- })
|
|
|
+ table_data.forEach((item) => {
|
|
|
+ item.disabled = true;
|
|
|
+ });
|
|
|
// 当前行处于编辑状态且不禁用
|
|
|
- table_data[idx].is_edit = true
|
|
|
- table_data[idx].disabled = false
|
|
|
-}
|
|
|
+ table_data[idx].is_edit = true;
|
|
|
+ table_data[idx].disabled = false;
|
|
|
+};
|
|
|
// 新增
|
|
|
const addCommonRulesFunc = async (data) => {
|
|
|
- const res = await addTableRules(data)
|
|
|
- return res
|
|
|
-}
|
|
|
+ const res = await addTableRules(data);
|
|
|
+ return res;
|
|
|
+};
|
|
|
// 编辑
|
|
|
const editCommonRulesFunc = async (data) => {
|
|
|
- const res = await editTableRules(data)
|
|
|
- return res
|
|
|
-}
|
|
|
+ const res = await editTableRules(data);
|
|
|
+ return res;
|
|
|
+};
|
|
|
// 删除
|
|
|
const deleteCommonRulesFunc = async (data) => {
|
|
|
- const res = await deleteTableRules(data)
|
|
|
- return res
|
|
|
-}
|
|
|
+ const res = await deleteTableRules(data);
|
|
|
+ return res;
|
|
|
+};
|
|
|
|
|
|
-watch(() => props.table_list, (newList) => {
|
|
|
- const list = newList.map((item, index) => {
|
|
|
- return {
|
|
|
- ...item,
|
|
|
- show_trigger: false,
|
|
|
- is_edit: false,
|
|
|
- disabled: false,
|
|
|
- rule_text: getRuleText(index, newList)
|
|
|
- }
|
|
|
- })
|
|
|
- table_data.length = 0
|
|
|
- // Object.assign(table_data, list)
|
|
|
- Object.assign(table_data, JSON.parse(JSON.stringify(list)))
|
|
|
- // 保留一份原始数据,用于取消修改用
|
|
|
- table_data.forEach(item => {
|
|
|
- item.origin_data = JSON.parse(JSON.stringify(item))
|
|
|
- item.shown_title = props.title_list.find(it => it.col_idx === item.col_idx).col_name + '-' + item.title
|
|
|
- })
|
|
|
-}, {
|
|
|
- deep: true
|
|
|
-})
|
|
|
+watch(
|
|
|
+ () => props.table_list,
|
|
|
+ (newList) => {
|
|
|
+ const list = newList.map((item, index) => {
|
|
|
+ return {
|
|
|
+ ...item,
|
|
|
+ show_trigger: false,
|
|
|
+ is_edit: false,
|
|
|
+ disabled: false,
|
|
|
+ rule_text: getRuleText(index, newList)
|
|
|
+ };
|
|
|
+ });
|
|
|
+ table_data.length = 0;
|
|
|
+ // Object.assign(table_data, list)
|
|
|
+ Object.assign(table_data, JSON.parse(JSON.stringify(list)));
|
|
|
+ // 保留一份原始数据,用于取消修改用
|
|
|
+ table_data.forEach((item) => {
|
|
|
+ item.origin_data = JSON.parse(JSON.stringify(item));
|
|
|
+ item.shown_title = props.title_list.find((it) => it.col_idx === item.col_idx).col_name + '-' + item.title;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ {
|
|
|
+ deep: true
|
|
|
+ }
|
|
|
+);
|
|
|
defineExpose({
|
|
|
addRule
|
|
|
-})
|
|
|
-
|
|
|
+});
|
|
|
</script>
|
|
|
<style scoped lang="css">
|
|
|
.column {
|
|
|
@@ -393,13 +468,12 @@ defineExpose({
|
|
|
.column_range {
|
|
|
position: relative;
|
|
|
box-sizing: border-box;
|
|
|
- border: 1px solid #BFBFBF;
|
|
|
+ border: 1px solid #bfbfbf;
|
|
|
width: 400px;
|
|
|
height: 40px;
|
|
|
border-radius: 8px;
|
|
|
padding: 0 40px 0px 20px;
|
|
|
justify-content: flex-start;
|
|
|
-
|
|
|
}
|
|
|
|
|
|
.rule_range {
|
|
|
@@ -426,7 +500,6 @@ defineExpose({
|
|
|
|
|
|
.operate {
|
|
|
position: relative;
|
|
|
-
|
|
|
}
|
|
|
|
|
|
.operate .icon {
|
|
|
@@ -454,14 +527,13 @@ defineExpose({
|
|
|
.my_custom_popconfirm .arco-btn-primary,
|
|
|
.arco-btn-primary[type='button'],
|
|
|
.arco-btn-primary[type='submit'] {
|
|
|
- background-color: #0a817e;
|
|
|
+ background-color: var(--primary-default);
|
|
|
}
|
|
|
|
|
|
-
|
|
|
.my_custom_popconfirm .arco-btn-primary:hover,
|
|
|
.arco-btn-primary[type='button']:hover,
|
|
|
.arco-btn-primary[type='submit']:hover {
|
|
|
- background-color: #0a817e;
|
|
|
+ background-color: var(--primary-default);
|
|
|
opacity: 0.6;
|
|
|
}
|
|
|
</style>
|