kz-ui-base 1.0.13 → 1.0.16

package/common/src/components/base/dialog/Dialog.js

@@ -44,10 +44,117 @@ function makeDialog(option) {
       // return this.setting.isShow;
       //}
     },
+    created() {
+      // this.$nextTick(() => {
+      //   console.log(option.setting.length)
+      //   console.log(option.setting.height)
+      //   if (option.setting.height) {
+      //     this.$refs.dialogtop.$el.firstChild.style.height =
+      //       option.setting.height;
+      //   }
+      //   // if (option.setting.fixedTitle) {
+      //   //   this.$refs.dialogtop.$el.children[0].children[0].style.position =
+      //   //     "fixed";
+      //   //   //   this.$refs.dialogtop.$el.children[0].children[0].style.top = "2px";
+      //   //   this.$refs.dialogtop.$el.children[0].children[0].style.width =
+      //   //     "inherit";
+      //   //   this.$refs.dialogtop.$el.children[0].children[0].style["z-index"] =
+      //   //     "999";
+      //   //   this.$refs.dialogtop.$el.children[0].children[0].style[
+      //   //     "background-color"
+      //   //   ] = "#FFF";
+      //   // }
+      //
+      //   // console.log(this.$refs.dialogtop.$el.children[0].children[0].style.position='fixed');
+      // });
+    },
+    methods: {
+      //��ǰ��ʵ���ֶ�ֵ����¼�
+      onChangeEvent(args) {
+        this.$emit("change", args);
+        //args:  { property: this.column.property, value: value, entity: this.entity, column: this.column }
+        //console.log(args);
+      },
+      beforeClose(done) {
+        if (option.beforeClose) {
+          option.beforeClose(done);
+        } else {
+          done();
+        }
+      },
+      close() {
+        this.isShow = false;
+        this.setting.isShow = false;
+        this.$forceUpdate();
+        if (option.close) {
+          option.close();
+        }
+      },
+      onCustomOpMenuClick() {},
+      onCancelClick() {
+        this.isShow = false;
+        this.setting.isShow = false;
+        this.close();
+      },
+      onSaveClick(result) {
+        this.isShow = false;
+        this.setting.isShow = false;
+        this.$forceUpdate();
+        option.onSaveClick && option.onSaveClick(result);
+        option.confirm && option.confirm(result);
+      },
+    },
+    components: {
+      dialogContent: option.component,
+    },
+  });
+  return vue;
+}
+function makeDrawer(option) {
+  var dom = document.createElement("div");
+  document.getElementsByTagName("body")[0].appendChild(dom);
+  let tpl =
+    '\
+        <el-drawer \
+            ref="drawertop"\
+            v-if="isShow"\
+            :custom-class="customClass" \
+            :title="setting.title || title" \
+            :visible="setting.isShow" \
+            :size="setting.width || \'60%\'" \
+            resizeable \
+            :before-close="beforeClose" \
+             append-to-body \
+            @close="close">\
+                <dialogContent :setting.sync="setting" @change="onChangeEvent" @onCustomOpMenuClick="onCustomOpMenuClick" @onSaveClick="onSaveClick" @onCancelClick="onCancelClick" @close="onCancelClick" @confirm="onSaveClick" v-model="dialogData"></dialogContent>\
+        </el-drawer>';
+
+  var vue = new Vue({
+    el: dom,
+    data: function () {
+      return {
+        title: option.title,
+        setting: option.setting,
+        dialogData: option.data || option.setting.data,
+        isShow: true,
+        fixedTitle: true,
+      };
+    },
+    template: tpl,
+    computed: {
+      customClass() {
+        return `el-dialog--width-${option.size || "auto"} customDrawer`;
+      },
+
+      //isShow() {
+      // console.log('isShow:' + this.setting.isShow);
+      // return this.setting.isShow;
+      //}
+    },
     created() {
       this.$nextTick(() => {
         if (option.setting.height) {
-          this.$refs.dialogtop.$el.firstChild.style.height =
+          this.$refs.drawertop.$el.firstChild.style.height =
             option.setting.height;
         }
         // if (option.setting.fixedTitle) {
@@ -113,6 +220,10 @@ export default {
   open(options) {
     options.isShow = true;
     options.setting.isShow = true;
-    return makeDialog(options);
+    if(options.setting?.showType == "drawer"){
+      return makeDrawer(options)
+    }else{
+      return makeDialog(options);
+    }
   },
 };

package/common/src/components/base/dialog/dialogType.js

@@ -1,9 +1,11 @@
 import Vue from "vue";
 import dialog from "@components/base/dialog/Dialog";
 import router from "@/router/index.js";
+import store from "@/store/index.js";
+import { constantRoutes } from "@/router";
 Vue.prototype.dialog = dialog;
 const open = (options) => {
-  if (options.setting&&options.setting.jumpUrl) {
+  if (options.setting?.jumpUrl) {
     router.push({
       name: options.setting.jumpUrl
         .toLowerCase()
@@ -13,29 +15,49 @@ const open = (options) => {
     return;
   }
   if (typeof options.component === "string") {
-    let component = options&&options.component;
+    let component = options?.component;
     options.component = (resolve) => {
       require([`@/${component}`], resolve);
     };
   }
-  if (options&&options.setting&&options.setting.showType == "menuTab") {
+  if (options?.setting?.showType == "menuTab") {
+    let num = store.state.tagsView.num;
+    for (let i = 0; i < constantRoutes[0].children.length; i++) {
+      if (options.setting.title == constantRoutes[0].children[i].meta.title) {
+        num = constantRoutes[0].children[i].meta.num;
+        break
+      }
+      if (i == constantRoutes[0].children.length - 1) {
+        store.dispatch("tagsView/addTabNum");
+        num = store.state.tagsView.num;
+      }
+    }
+
     let url = new Date().getTime();
-    if (options.setting&&options.setting.entityId) {
+    if (options.setting?.entityId) {
       url = options.setting.entityId;
     }
-    router.addRoute("tabmenu", {
+   
+    constantRoutes[0].children.unshift({
       path: `/tabmenu/${url}`,
       component: (resolve) =>
-        require([`@/components/base/tabMenuRoute`], resolve),
+        require([`@/components/base/Menus/tabMenuRoute` + num], resolve),
       name: url,
       meta: {
         title: options.setting.title,
+        redirectOnClose: options.setting.redirectOnClose,
+        num: num,
       },
     });
+    router.addRoute(constantRoutes[0]);
+    localStorage.setItem(
+      "optionTabCodeData",
+      JSON.stringify(options.setting.redirectOnClose)
+    );
     router.push({
       name: url,
       params: { options },
-    });
+    },()=>{}, ()=>{});
     return;
   }
   try {
@@ -49,7 +71,7 @@ const open = (options) => {
       ) {
         Vue.prototype.openDialog(options.component)({
           ...options,
-          ...options&&options.setting&&options.setting.data,
+          ...options?.setting?.data,
         });
       } else {
         Vue.prototype.dialog.open(options);
@@ -60,17 +82,17 @@ const open = (options) => {
       const ComponentClass = Vue.extend(options.component);
       const instance = new ComponentClass();
       instance.$mount();
+    
       if (String(instance.dialogType) === "2") {
         Vue.prototype.openDialog(options.component)({
           ...options,
-          ...options&&options.setting&&options.setting.data,
+          ...options?.setting?.data,
         });
       } else {
         Vue.prototype.dialog.open(options);
       }
     }
   } catch (e) {
-    console.error(options.component, "弹窗error");
     Vue.prototype.dialog.open(options);
   }
 };

package/common/src/components/base/dialog/editDialog.vue

@@ -0,0 +1,192 @@
+<template>
+  <!-- 添加或修改参数配置对话框 -->
+  <el-dialog
+    :title="setting.title"
+    :visible.sync="setting.isShow"
+    :width="width"
+    :close-on-click-modal="false"
+    append-to-body
+    v-dialogDrag
+    v-dialogDragHeight
+  >
+    <slot name="entityForm">
+      <el-form
+        ref="entity"
+        :model="entity"
+        :rules="rules"
+        :label-width="labelWidth"
+      >
+        <el-row>
+          <FormColumns ref="FormColumns"
+            :columns.sync="columns"
+            :entity.sync="entity"
+            @change="onChangeEvent"
+          ></formColumns>
+        </el-row>
+      </el-form>
+    </slot>
+    <slot name="footer">
+      <div class="dialog-footer">
+        <el-button
+          type="primary"
+          :loading="setting.submitLoading"
+          @click="submitForm"
+          >确 定</el-button
+        >
+        <el-button @click="cancel">取 消</el-button>
+        <el-button
+          v-for="opMenu in customOpMenus"
+          :key="opMenu.name"
+          @click="handleCustomOpMenuClick(opMenu)"
+          >{{ opMenu.text }}</el-button
+        >
+      </div>
+    </slot>
+  </el-dialog>
+</template>
+
+<script>
+import { addEntity, updateEntity } from "../../../api/common/common";
+
+import FormColumns from "@components/customForm/formColumns";
+
+export default {
+  name: "EditDialog",
+  components: {
+    FormColumns,
+  },
+  props: {
+    //微服务模块名称
+    moduleName: {
+      type: String,
+      default: function () {
+        return undefined;
+      },
+    },
+    //实体名称-服务名称
+    serviceName: {
+      type: String,
+      default: function () {
+        return undefined;
+      },
+    },
+    setting: {
+      type: Object,
+      default: function () {
+        return {
+          pkField: "id",
+          // 提交状态
+          submitLoading: false,
+          // 弹出层标题
+          title: "",
+          // 是否显示弹出层
+          isShow: false,
+          // 保存时是否自动关闭
+          isCloseOnSave: true,
+        };
+      },
+    },
+    // 列信息
+    columns: {
+      type: Array,
+      default: function () {
+        return [
+          //{ key: 0, text: `用户编码`, property: "userNo", visible: true },
+          //{ key: 1, text: `用户账号`, property: "userAccount", visible: true },
+        ];
+      },
+    },
+    // 表单参数
+    entity: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+    // 表单校验
+    rules: {
+      type: Object,
+      default: function () {
+        return {};
+      },
+    },
+    //编辑界面自定义按钮菜单 - 若无自定义按钮，不需要重写
+    customOpMenus: {
+      type: Array,
+      default: function () {
+        return [
+          //{ name: "custom1", visable: true, icon: "ion-plus-round", text: "自定义1" }
+        ];
+      },
+    },
+  },
+  data() {
+    return {
+      //表格宽度
+      width: this.setting.width || "60%",
+      //input框宽度
+      labelWidth: this.setting.labelWidth || "100px",
+    };
+  },
+  watch: {},
+  created() {},
+  mounted() {},
+  activated() {
+    console.log("editDialog");
+  },
+  methods: {
+    //当前绑定实体字段值变更事件
+    onChangeEvent(args) {
+      this.$emit("change", args);
+      //args:  { property: this.column.property, value: value, entity: this.entity, column: this.column }
+      //console.log(args);
+    },
+    show() {
+      this.setting.isShow = true;
+    },
+    /** 组件内更新属性值 */
+    updateEntity(args) {},
+    // 取消按钮
+    cancel() {
+      this.setting.isShow = false;
+      //this.reset()
+      this.$emit("onCancelClick", { data: this.entity, setting: this.setting });
+    },
+    // 表单重置
+    reset() {
+      for (var column of this.columns) {
+        this.entity[column.property] = column.default;
+      }
+      this.resetForm("entity");
+    },
+    /** 提交按钮 */
+    submitForm: function () {
+      var self = this;
+      this.setting.submitLoading = true;
+      this.$refs["entity"].validate((valid) => {
+        if (valid) {
+          this.$emit("onSaveClick", {
+            data: this.entity,
+            setting: this.setting,
+          });
+        }
+      });
+      this.setting.submitLoading = false;
+    },
+    /** 自定义操作菜单按钮点击处理 */
+    handleCustomOpMenuClick(opMenu) {
+      this.$emit("onCustomOpMenuClick", {
+        opMenu: opMenu,
+        data: this.entity,
+        setting: this.setting,
+      });
+    },
+  },
+};
+</script>
+
+<style scoped>
+.wrapper-container-supplement {
+  min-height: 415px;
+}
+</style>

package/common/src/components/base/dialog/lookupDialog.vue

@@ -0,0 +1,224 @@
+<template>
+  <!-- 添加或修改参数配置对话框 -->
+  <div>
+    <SearchTable
+      :moduleName="setting.moduleName"
+      :serviceName="setting.serviceName"
+      :url="setting.url"
+      :parameter="setting.parameter"
+      :listColumns.sync="setting.listColumns"
+      :listQueryParams.sync="setting.listQueryParams"
+      :setting.sync="setting.listSetting"
+      :searchRules.sync="setting.searchRules"
+      :isMultiple="setting.isMultiple"
+      :treeSetting="setting.treeSetting"
+      :isAutoGenerationColumns="true"
+      :listCustomOpMenus="setting.listCustomOpMenus"
+      @change="onChangeEvent"
+      @onListCustomOpMenuClick="onListCustomOpMenuClick"
+    />
+    <slot name="footer" v-if="setting.footerButton">
+      <div class="dialog-footer">
+        <el-button
+          type="primary"
+          :loading="tableSetting.submitLoading"
+          @click="submitForm"
+          >确 定</el-button
+        >
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </slot>
+  </div>
+</template>
+
+<script>
+import SearchTable from "../../customForm/searchTable.vue";
+export default {
+  name: "lookupDialog",
+
+  components: {
+    SearchTable,
+  },
+  props: {
+    setting: {
+      type: Object,
+      default: function () {
+        return undefined;
+      },
+    },
+  },
+  data() {
+    return {
+      // 当前选中行实体
+      currentEntity: undefined,
+      // 当前选中行实体集合
+      currentEntities: undefined,
+      tableSetting: {
+        //类型，支持以下类型：
+        type: undefined,
+        //微服务模块名称
+        moduleName: undefined,
+        //实体名称-服务名称
+        serviceName: undefined,
+        pkField: "id",
+        // 提交状态
+        submitLoading: false,
+        // 弹出层标题
+        title: "请选择",
+        // 保存时是否自动关闭
+        isCloseOnSave: true,
+        // 启用多选模式
+        isMultiple: false,
+        //自定义操作菜单设定 - 若无自定义按钮，不需要重写
+        customOpMenus: [
+          //{
+          //  visable: true,
+          //  text: "按钮1",
+          //  icon: "el-icon-plus",
+          //  permission: "",
+          //  name: "custom1",
+          //  isShowText: false,
+          //  cssType: "success",
+          //},
+        ],
+        // 列表分页参数
+        listQueryParams: {
+          pageNum: 1,
+          pageSize: 5,
+          totalPages: 1,
+          total: 0,
+          orderBy: "id",
+        },
+        listSetting: {
+          //获取列表数据的api方法名
+          getListAction: "list",
+          //主键字段
+          pkField: this.pkField,
+          // 遮罩层
+          loading: false,
+          //是否显示合计行
+          isShowSumRow: true,
+          //是否启用行内编辑模式
+          isOpenInlineEditMode: false,
+          //是否显示分页栏
+          isShowPager: true,
+          //是否显示操作栏
+          isShowOpColumn: false,
+        },
+        // 列表列信息
+        listColumns: [
+          //{ key: 0, text: `用户编码`, property: "userNo", type: "string", visible: true },
+          //{ key: 1, text: `用户账号`, property: "userAccount", visible: true },
+        ],
+
+        //列表自定义操作菜单设定 - 若无自定义按钮，不需要重写
+        listCustomOpMenus: [
+          // {
+          //   visable: true,
+          //   text: "按钮1",
+          //   icon: "el-icon-edit",
+          //   permission: "",
+          //   name: "custom1",
+          //   isShowText: false,
+          // },
+        ],
+        // 列表查询条件
+        searchRules: [
+          //{ key: 0, text: `用户编码`, property: "userNo", value: "", visible: true },
+          //{ key: 1, text: `用户账号`, property: "userAccount", value: "", visible: true },
+        ],
+        //弹框是否显示确定 取消
+        footerButton: this.setting.footerButton != false,
+      },
+    };
+  },
+
+  created() {
+    this.init();
+    for (var key in this.tableSetting) {
+      var ignore = false;
+      for (var keySetting in this.setting) {
+        if (key == keySetting) {
+          ignore = true;
+          break;
+        }
+      }
+      if (ignore) continue;
+
+      this.setting[key] = this.tableSetting[key];
+    }
+    this.$emit("update:setting", this.setting);
+  },
+  mounted() {},
+  activated() {},
+  methods: {
+    onChangeEvent(value) {
+      if (this.setting.isMultiple) this.currentEntities = value;
+      else this.currentEntity = value;
+    },
+    // 取消按钮
+    cancel() {
+      //this.reset()
+      this.$emit("onCancelClick", {
+        data: this.setting.isMultiple
+          ? this.currentEntities
+          : this.currentEntity,
+        setting: this.setting,
+      });
+    },
+    init() {
+      if (this.setting.type) {
+        switch (this.setting.type) {
+          case "User":
+            this.setting.moduleName = "system";
+            this.setting.serviceName = "user";
+            this.setting.displayField = "nickName";
+            this.setting.valueField = "userId";
+
+            break;
+          case "Dept":
+            this.setting.moduleName = "system";
+            this.setting.serviceName = "dept";
+            this.setting.displayField = "deptName";
+            this.setting.valueField = "deptId";
+            this.setting.dataField = "data";
+            break;
+          case "Post":
+            this.setting.moduleName = "system";
+            this.setting.serviceName = "post";
+            this.setting.displayField = "postName";
+            this.setting.valueField = "postId";
+            break;
+          case "Role":
+            this.setting.moduleName = "system";
+            this.setting.serviceName = "role";
+            this.setting.displayField = "roleName";
+            this.setting.valueField = "roleId";
+            break;
+        }
+      }
+    },
+    /** 列表表格自定义按钮点击处理 */
+    onListCustomOpMenuClick(args) {
+      //console.log("ListBasePage:onListCustomOpMenuClick:" + args.opMenu.name);
+    },
+    /** 提交按钮 */
+    submitForm: function () {
+      var self = this;
+
+      this.$emit("onSaveClick", {
+        data: this.setting.isMultiple
+          ? this.currentEntities
+          : this.currentEntity,
+        setting: this.setting,
+      });
+    },
+  },
+};
+</script>
+
+<style scoped>
+.wrapper-container-supplement {
+  min-height: 415px;
+}
+</style>

package/common/src/components/base/dialog/printDialog.vue

@@ -132,7 +132,7 @@ export default {
   name: "PrintDialog",
 
   components: {
-    SearchTable: () => import("@/components/customForm/searchTable"),
+    SearchTable: () => import("../../customForm/searchTable"),
   },
   props: {
     //微服务模块名称

package/common/src/components/base/dialog/tableDialog.vue

@@ -56,12 +56,16 @@
 <script>
 import {
   listEntity,
-} from "@/api/common/common";
+} from "../../../api/common/common";
+import EditTable from "../../customForm/editTable.vue";
+
+import EditDialog from "./editDialog.vue";
 export default {
   name: "tableDialog",
   extends: EditDialog,
 
   components: {
+    EditTable,
   },
   props: {
     springFrametable: {

package/common/src/components/base/dialog/uploadDialog.vue

@@ -34,8 +34,21 @@
 </template>
 
 <script>
+import {
+  listUser,
+  getUser,
+  delUser,
+  addUser,
+  updateUser,
+  resetUserPwd,
+  changeUserStatus,
+  changeUserRole
+} from "@/api/system/user"
 import {getToken} from "@utils/auth"
+import {treeSelect} from "@/api/system/post"
+import Treeselect from "@riophae/vue-treeselect"
 import "@riophae/vue-treeselect/dist/vue-treeselect.css"
+import {optionSelect} from "@/api/system/role"
 
 export default {
         name: "UploadDialog",