cloud-web-corejs 1.0.281 → 1.1.0-dev.11

package/src/views/bd/setting/table_model/mixins/zdDialog.js

@@ -1,148 +1,148 @@
-import { selectDialogMixins } from "@base/mixins/selectDialog";
-
-let modules = {};
-modules = {
-  name: "zdDialog",
-  props: ["visiable", "multi", "rows", "param", "taBm"],
-  mixins: [selectDialogMixins],
-  components: {},
-  created() {
-    this.initSetting();
-  },
-  mounted() {
-    this.initTableM1();
-  },
-  data() {
-    return {
-      showDialog: true,
-      falseValue: false,
-      selectMulti: true,
-      formData: {},
-      vxeOption: {},
-      showSaleOrgDialog: false,
-      fieldKey: "taZdMc",
-    };
-  },
-  methods: {
-    initTableM1() {
-      let that = this;
-
-      let zdTypeMap = {
-        Boolean: this.$t1("布尔"),
-        Integer: this.$t1("整数"),
-        Long: this.$t1("长整数"),
-        Decimal: this.$t1("精度小数"),
-        Money: this.$t1("金额"),
-        Text: this.$t1("文本"),
-        TextArea: this.$t1("长文本"),
-        DateTime: this.$t1("日期时间"),
-        Reference: this.$t1("关联表(文本)"),
-        ReferenceLong: this.$t1("关联表(长整型)"),
-      };
-
-      let tableOption = {
-        vue: that,
-        tableRef: "table-m1",
-        tableName: "bd_table_model_field_dialog-m1",
-        path: USER_PREFIX + "/szTaMb/getSzTaZdMbsByTaBm",
-        param: () => {
-          return {
-            taBm: this.taBm,
-            enabled: true,
-            searchDb: true,
-            ...this.formData,
-            ...this.param,
-          };
-        },
-        callback: (rows) => {
-          this.restoreChecked(rows);
-        },
-        columns: [
-          { type: "checkbox", width: 48, resizable: false, fixed: "left" },
-          {
-            title: this.$t1("实体字段名称"),
-            field: "zdEn",
-            width: 150,
-          },
-          {
-            title: this.$t1("数据库表字段名"),
-            field: "taZdMc",
-            width: 150,
-          },
-          {
-            title: this.$t1("字段描述"),
-            field: "zdCh",
-            width: 150,
-          },
-          {
-            title: this.$t1("字段类型"),
-            field: "zdType",
-            width: 150,
-            slots: {
-              default: ({ row, rowIndex, $table }) => {
-                return zdTypeMap[row.zdType];
-              },
-            },
-          },
-          {
-            title: this.$t1("关联字段"),
-            field: "referenceZd",
-            width: 150,
-          },
-          {
-            width: 47,
-            fixed: "right",
-            title: "",
-            sortable: false,
-          },
-        ],
-        config: {
-          checkboxConfig: {
-            checkStrictly: true,
-            showHeader: this.selectMulti,
-            trigger: "row",
-          },
-          proxyConfig: {
-            props: {
-              result: "objx", // 配置响应结果列表字段
-              total: "objx.length", // 配置响应结果总页数字段
-            },
-          },
-        },
-      };
-      this.$vxeTableUtil.initVxeTable(tableOption).then((opts) => {
-        that.vxeOption = opts;
-      });
-    },
-    /**
-     * 列表每次查询完，把已选中的字段重新勾上。
-     *
-     * selectDialogMixins.initSetting 只把 rows 播种进 checkRows（右侧已选列表），
-     * 表格自身的勾选状态没人恢复 —— 不补这一步，弹框打开时左边一个勾都没有，
-     * 用户再勾一个新字段就会把原有的显示字段整组顶掉。
-     */
-    restoreChecked(rows) {
-      let checkRows = this.checkRows;
-      if (!checkRows || !checkRows.length || !rows || !rows.length) {
-        return;
-      }
-      let fieldKey = this.fieldKey;
-      let keys = checkRows.map((item) => item[fieldKey]);
-      let targetRows = rows.filter((row) => keys.includes(row[fieldKey]));
-      if (!targetRows.length) {
-        return;
-      }
-      // 回填进来的可能只是 { taZdMc } 这样的占位行，用列表里的真实行替换掉，
-      // 保证「确定」抛给调用方的是带 zdEn / zdCh 的完整数据
-      this.checkRows = checkRows.map((item) => {
-        let real = targetRows.find((row) => row[fieldKey] === item[fieldKey]);
-        return real || item;
-      });
-      let $grid = this.$refs[this.defaultTableRefName];
-      if ($grid && $grid.setCheckboxRow) {
-        $grid.setCheckboxRow(targetRows, true);
-      }
-    },
-  },
-};
-export default modules;
+import { selectDialogMixins } from "@base/mixins/selectDialog";
+
+let modules = {};
+modules = {
+  name: "zdDialog",
+  props: ["visiable", "multi", "rows", "param", "taBm"],
+  mixins: [selectDialogMixins],
+  components: {},
+  created() {
+    this.initSetting();
+  },
+  mounted() {
+    this.initTableM1();
+  },
+  data() {
+    return {
+      showDialog: true,
+      falseValue: false,
+      selectMulti: true,
+      formData: {},
+      vxeOption: {},
+      showSaleOrgDialog: false,
+      fieldKey: "taZdMc",
+    };
+  },
+  methods: {
+    initTableM1() {
+      let that = this;
+
+      let zdTypeMap = {
+        Boolean: this.$t1("布尔"),
+        Integer: this.$t1("整数"),
+        Long: this.$t1("长整数"),
+        Decimal: this.$t1("精度小数"),
+        Money: this.$t1("金额"),
+        Text: this.$t1("文本"),
+        TextArea: this.$t1("长文本"),
+        DateTime: this.$t1("日期时间"),
+        Reference: this.$t1("关联表(文本)"),
+        ReferenceLong: this.$t1("关联表(长整型)"),
+      };
+
+      let tableOption = {
+        vue: that,
+        tableRef: "table-m1",
+        tableName: "bd_table_model_field_dialog-m1",
+        path: USER_PREFIX + "/szTaMb/getSzTaZdMbsByTaBm",
+        param: () => {
+          return {
+            taBm: this.taBm,
+            enabled: true,
+            searchDb: true,
+            ...this.formData,
+            ...this.param,
+          };
+        },
+        callback: (rows) => {
+          this.restoreChecked(rows);
+        },
+        columns: [
+          { type: "checkbox", width: 48, resizable: false, fixed: "left" },
+          {
+            title: this.$t1("实体字段名称"),
+            field: "zdEn",
+            width: 150,
+          },
+          {
+            title: this.$t1("数据库表字段名"),
+            field: "taZdMc",
+            width: 150,
+          },
+          {
+            title: this.$t1("字段描述"),
+            field: "zdCh",
+            width: 150,
+          },
+          {
+            title: this.$t1("字段类型"),
+            field: "zdType",
+            width: 150,
+            slots: {
+              default: ({ row, rowIndex, $table }) => {
+                return zdTypeMap[row.zdType];
+              },
+            },
+          },
+          {
+            title: this.$t1("关联字段"),
+            field: "referenceZd",
+            width: 150,
+          },
+          {
+            width: 47,
+            fixed: "right",
+            title: "",
+            sortable: false,
+          },
+        ],
+        config: {
+          checkboxConfig: {
+            checkStrictly: true,
+            showHeader: this.selectMulti,
+            trigger: "row",
+          },
+          proxyConfig: {
+            props: {
+              result: "objx", // 配置响应结果列表字段
+              total: "objx.length", // 配置响应结果总页数字段
+            },
+          },
+        },
+      };
+      this.$vxeTableUtil.initVxeTable(tableOption).then((opts) => {
+        that.vxeOption = opts;
+      });
+    },
+    /**
+     * 列表每次查询完，把已选中的字段重新勾上。
+     *
+     * selectDialogMixins.initSetting 只把 rows 播种进 checkRows（右侧已选列表），
+     * 表格自身的勾选状态没人恢复 —— 不补这一步，弹框打开时左边一个勾都没有，
+     * 用户再勾一个新字段就会把原有的显示字段整组顶掉。
+     */
+    restoreChecked(rows) {
+      let checkRows = this.checkRows;
+      if (!checkRows || !checkRows.length || !rows || !rows.length) {
+        return;
+      }
+      let fieldKey = this.fieldKey;
+      let keys = checkRows.map((item) => item[fieldKey]);
+      let targetRows = rows.filter((row) => keys.includes(row[fieldKey]));
+      if (!targetRows.length) {
+        return;
+      }
+      // 回填进来的可能只是 { taZdMc } 这样的占位行，用列表里的真实行替换掉，
+      // 保证「确定」抛给调用方的是带 zdEn / zdCh 的完整数据
+      this.checkRows = checkRows.map((item) => {
+        let real = targetRows.find((row) => row[fieldKey] === item[fieldKey]);
+        return real || item;
+      });
+      let $grid = this.$refs[this.defaultTableRefName];
+      if ($grid && $grid.setCheckboxRow) {
+        $grid.setCheckboxRow(targetRows, true);
+      }
+    },
+  },
+};
+export default modules;

package/src/views/support/form-dialog-demo/demoPickerDialog.vue

@@ -0,0 +1,72 @@
+<template>
+  <el-dialog
+    title="选择供应商（自定义 Vue 弹框）"
+    :visible.sync="showDialog"
+    width="560px"
+    :close-on-click-modal="false"
+    :append-to-body="true"
+    custom-class="dialog-style"
+    v-el-drag-dialog
+    @close="handleClose"
+  >
+    <el-table
+      :data="rows"
+      border
+      highlight-current-row
+      @current-change="handleCurrentChange"
+      @row-dblclick="handleConfirm"
+    >
+      <el-table-column prop="id" label="编号" width="100" />
+      <el-table-column prop="name" label="名称" />
+      <el-table-column prop="contact" label="联系人" width="120" />
+    </el-table>
+    <span slot="footer" class="dialog-footer">
+      <el-button type="primary" plain class="button-sty" @click="showDialog = false"
+        ><i class="el-icon-close el-icon"></i
+        >{{ $t2("取 消", "system.button.cancel2") }}</el-button
+      >
+      <el-button
+        type="primary"
+        class="button-sty"
+        :disabled="!currentRow"
+        @click="handleConfirm"
+        ><i class="el-icon-check el-icon"></i
+        >{{ $t2("确 定", "system.button.confirm2") }}</el-button
+      >
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  name: "demoPickerDialog",
+  props: ["visiable"],
+  data() {
+    return {
+      showDialog: true,
+      currentRow: null,
+      rows: [
+        { id: "S001", name: "供应商甲", contact: "张三" },
+        { id: "S002", name: "供应商乙", contact: "李四" },
+        { id: "S003", name: "供应商丙", contact: "王五" },
+      ],
+    };
+  },
+  methods: {
+    handleCurrentChange(row) {
+      this.currentRow = row;
+    },
+    handleConfirm() {
+      if (!this.currentRow) return;
+      // 与 formDialog searchComponent 的约定：confirm 事件带选中行数组
+      this.$emit("confirm", [this.currentRow]);
+      this.showDialog = false;
+    },
+    handleClose() {
+      this.$emit("update:visiable", false);
+    },
+  },
+};
+</script>
+
+<style></style>