标签管理添加界面排序

lihua
Showing 2 changed files with 52 additions and 28 deletions
src/components/Table/index.vue
src/views/data_anonymization/labelManagement.vue
--- a/src/components/Table/index.vue
View file @4b0914c
+++ b/src/components/Table/index.vue
View file @4b0914c
@@ -339,7 +339,7 @@ onMounted(() => {
          <span v-if="item.unit">{{ item.unit }}</span>
        </template>
        <template #default="scope" v-else-if="item.type == 'switch'">
-          <el-switch v-model="scope.row[item.field]" inline-prompt
+          <el-switch v-model="scope.row[item.field]" inline-prompt :key="scope.row.guid"
            :disabled="!item.isDisabled ? false : item.isDisabled(scope)" :active-value="item.activeValue"
            :inactive-value="item.inactiveValue" :width="item.switchWidth" :active-text="item.activeText"
            :inactive-text="item.inactiveText" :before-change="() => beforeChange(scope, item)"
--- a/src/views/data_anonymization/labelManagement.vue
View file @4b0914c
+++ b/src/views/data_anonymization/labelManagement.vue
View file @4b0914c
@@ -49,6 +49,7 @@ const tableInfo = ref({
  // multiple:true,
  fields: [
    { label: "序号", type: "index", width: TableColumnWidth.INDEX, align: "center" },
+    { label: "界面排序", field: "orderNum", width: 90, align: "center" },
    { label: "标签名称", field: "labelName", width: 140 },
    { label: "标签类型", field: "labelTypeName", width: 140 },
    { label: '状态', field: 'bizState', type: 'switch', activeText: '启用', inactiveText: '禁用', activeValue: 'Y', inactiveValue: 'N', switchWidth: 56, width: 100, align: 'center' },
@@ -76,6 +77,11 @@ const tableInfo = ref({
              const detail = res.data || {};
              currTableData.value = Object.assign({}, currTableData.value, detail);
              newCreateLabelFormItems.value.forEach(item => {
+                if (item.children?.length) {
+                  item.children.forEach(child => child.default = detail[child.field]);
+                } else {
+                  item.default = detail[item.field];
+                }
                item.default = detail[item.field];
              });
              let labelRuleField = detail.labelRuleField || {};
@@ -225,20 +231,35 @@ const newCreateLabelFormItems = ref<any>([{
  visible: true,
 },
 {
-  label: '标签类型',
+  label: ' ',
-  type: 'select',
+  type: 'select-group',
  placeholder: '请选择',
-  field: 'labelTypeCode',
+  field: 'labelgroup',
-  default: '',
+  children: [{
-  options: labelTypeList.value,
+    label: '标签类型',
-  props: {
+    type: 'select',
-    label: "label",
+    placeholder: '请选择',
-    value: "value",
+    field: 'labelTypeCode',
-  },
+    default: '',
-  required: true,
+    options: labelTypeList.value,
-  filterable: true,
+    props: {
-  clearable: true,
+      label: "label",
-  visible: true,
+      value: "value",
+    },
+    required: true,
+    filterable: true,
+    clearable: true,
+    visible: true,
+  }, {
+    label: '界面排序',
+    type: 'input',
+    placeholder: '请输入',
+    field: 'orderNum',
+    maxlength: 6,
+    regexp: /\D/g,
+    required: false,
+    clearable: true,
+  }],
 }, {
  type: 'radio-group',
  label: '规则配置',
@@ -254,7 +275,7 @@ const newCreateLabelFormItems = ref<any>([{
 const newCreateLabelFormRules = ref({
  labelName: [required('请输入标签名称')],
-  labelTypeCode: [required('请选择标签类型')],
+  labelTypeCode: [required('请选择标签类型')]
 });
 const ruleContentFormRef = ref();
@@ -299,6 +320,7 @@ const newCreateLabelDialogInfo = ref({
      let submitLabel = () => {
        let params = Object.assign({}, info, {
          bizState: 'Y',
+          orderNum: info.orderNum != null ? parseInt(info.orderNum) : null,
          labelRuleField: {
            matchChValue: matchChValue.value.value,
            matchEnValue: matchEnValue.value.value,
@@ -432,10 +454,15 @@ const tabChange = (val) => {
 const handleCreate = () => {
  newCreateLabelFormItems.value.forEach(item => {
-    if (item.field == 'matchType') {
+    if (item.children?.length) {
-      item.default = 1;
+      item.children[0].default = ''
+      item.children[1].default = ''
    } else {
-      item.default = '';
+      if (item.field == 'matchType') {
+        item.default = 1;
+      } else {
+        item.default = '';
+      }
    }
  });
  matchChValue.value.value = '';
@@ -602,8 +629,8 @@ onBeforeMount(() => {
  }).then((res: any) => {
    if (res.code == proxy.$passCode) {
      labelTypeList.value = res.data || [];
-      let item = newCreateLabelFormItems.value.find(item => item.field == 'labelTypeCode');
+      let item = newCreateLabelFormItems.value.find(item => item.field == 'labelgroup');
-      item && (item.options = labelTypeList.value);
+      item && (item.children[0].options = labelTypeList.value);
    } else {
      proxy.$ElMessage.error(res.msg);
    }
@@ -652,12 +679,10 @@ onBeforeMount(() => {
              </span>
            </div>
            <div class="v-match">
-              <el-input v-model="matchChValue.value"  maxlength="200"
+              <el-input v-model="matchChValue.value" maxlength="200" style="width: 272px;height:94px;" show-word-limit
-                style="width: 272px;height:94px;" show-word-limit type="textarea" class="no-resize"
+                type="textarea" class="no-resize" placeholder="请输入字段中文" />
-                placeholder="请输入字段中文" />
+              <el-input v-model="matchEnValue.value" maxlength="200" style="width: 272px;height:94px;" show-word-limit
-              <el-input v-model="matchEnValue.value" maxlength="200"
+                type="textarea" class="no-resize" placeholder="请输入字段英文" />
-                style="width: 272px;height:94px;" show-word-limit type="textarea" class="no-resize"
-                placeholder="请输入字段英文" />
            </div>
          </div>
          <div class="dim-label" style="margin-top: 16px;">
@@ -684,8 +709,7 @@ onBeforeMount(() => {
              <el-input v-model="row.matchValue" class="v-input" placeholder="请输入匹配值" />
              <!-- 删除按钮 -->
-              <el-button class="extra-icon" :icon="Delete" @click="deleteRow(index)" circle
+              <el-button class="extra-icon" :icon="Delete" @click="deleteRow(index)" circle style="margin-left: 8px;" />
-                style="margin-left: 8px;" />
            </div>
          </div>