cloud-web-corejs 1.0.54-dev.678 → 1.0.54-dev.679

package/src/components/xform/form-designer/form-widget/field-widget/area-select-widget.vue

@@ -0,0 +1,158 @@
+<template>
+  <form-item-wrapper
+    :designer="designer"
+    :field="field"
+    :rules="rules"
+    :design-state="designState"
+    :parent-widget="parentWidget"
+    :parent-list="parentList"
+    :index-of-parent-list="indexOfParentList"
+    :sub-form-row-index="subFormRowIndex"
+    :sub-form-col-index="subFormColIndex"
+    :sub-form-row-id="subFormRowId"
+  >
+    <baseArea
+      v-show="!isReadMode"
+      class="full-width-input"
+      :style="widgetStyle"
+      v-model="fieldModel"
+      :label-value.sync="areaLabel"
+      :max-level="maxLevel"
+      :locale="field.options.locale"
+      :disabled="field.options.disabled"
+      :readonly="field.options.readonly"
+      :clearable="field.options.clearable"
+      :placeholder="getI18nLabel(field.options.placeholder || '请选择地区')"
+      :size="field.options.size || 'small'"
+      @change="handleAreaChange"
+    />
+    <template v-if="isReadMode">
+      <span class="readonly-mode-field">{{ readModeText }}</span>
+    </template>
+  </form-item-wrapper>
+</template>
+
+<script>
+import FormItemWrapper from "./form-item-wrapper";
+import emitter from "../../../../../components/xform/utils/emitter";
+import i18n from "../../../../../components/xform/utils/i18n";
+import fieldMixin from "../../../../../components/xform/form-designer/form-widget/field-widget/fieldMixin";
+import baseArea from "@base/components/baseArea/index.vue";
+
+export default {
+  name: "area-select-widget",
+  componentName: "FieldWidget",
+  mixins: [emitter, fieldMixin, i18n],
+  components: {
+    FormItemWrapper,
+    baseArea,
+  },
+  props: {
+    field: Object,
+    parentWidget: Object,
+    parentList: Array,
+    indexOfParentList: Number,
+    designer: Object,
+    designState: {
+      type: Boolean,
+      default: false,
+    },
+    subFormRowIndex: {
+      type: Number,
+      default: -1,
+    },
+    subFormColIndex: {
+      type: Number,
+      default: -1,
+    },
+    subFormRowId: {
+      type: String,
+      default: "",
+    },
+  },
+  inject: ["refList", "globalOptionData", "globalModel"],
+  data() {
+    return {
+      oldFieldValue: null,
+      fieldModel: null,
+      areaLabel: null,
+      rules: [],
+    };
+  },
+  computed: {
+    currentData() {
+      let tableParam = this.tableParam;
+      return tableParam && tableParam.row ? tableParam.row : this.formModel;
+    },
+    areaNameField() {
+      return this.field.options.areaName || null;
+    },
+    maxLevel() {
+      const areaDataType = this.field.options.areaDataType * 1 || 3;
+      if (areaDataType === 1) return 2;
+      if (areaDataType === 2) return 3;
+      return 4;
+    },
+    readModeText() {
+      return this.areaLabel || this.currentAreaNameValue || "--";
+    },
+    widgetStyle() {
+      const widgetWidth = this.field.options.widgetWidth;
+      if (widgetWidth != null && widgetWidth !== "") {
+        return { width: widgetWidth };
+      }
+      return { width: "100%" };
+    },
+    currentAreaNameValue() {
+      if (!this.areaNameField) {
+        return null;
+      }
+      return this.currentData[this.areaNameField] ?? null;
+    },
+  },
+  watch: {
+    currentAreaNameValue: {
+      immediate: true,
+      handler(val) {
+        this.areaLabel = val;
+      },
+    },
+  },
+  created() {
+    this.initFieldModel();
+    this.registerToRefList();
+    this.initEventHandler();
+    this.buildFieldRules();
+    this.handleOnCreated();
+  },
+  mounted() {
+    this.handleOnMounted();
+  },
+  beforeDestroy() {
+    this.unregisterFromRefList();
+  },
+  methods: {
+    syncAreaName(label) {
+      if (this.areaNameField) {
+        this.$set(this.currentData, this.areaNameField, label);
+      }
+    },
+    handleAreaChange(row) {
+      const label = row ? row.fullName || row.name || null : null;
+      this.areaLabel = label;
+      this.syncAreaName(label);
+      this.handleChangeEvent(this.fieldModel);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+@import "~@/styles/global.scss";
+
+.full-width-input {
+  width: 100% !important;
+  display: block !important;
+  box-sizing: border-box;
+}
+</style>

package/src/components/xform/form-designer/setting-panel/property-editor/field-area-select/areaDataType-editor.vue

@@ -0,0 +1,24 @@
+<template>
+  <el-form-item :label="i18nt('designer.setting.areaDataType')">
+    <el-select v-model="optionModel.areaDataType" style="width: 100%">
+      <el-option :label="i18nt('designer.setting.areaDataType1')" :value="1" />
+      <el-option :label="i18nt('designer.setting.areaDataType2')" :value="2" />
+      <el-option :label="i18nt('designer.setting.areaDataType3')" :value="3" />
+    </el-select>
+  </el-form-item>
+</template>
+
+<script>
+import i18n from "@base/components/xform/utils/i18n";
+import propertyMixin from "@base/components/xform/form-designer/setting-panel/property-editor/propertyMixin";
+
+export default {
+  name: "areaDataType-editor",
+  mixins: [i18n, propertyMixin],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object,
+  },
+};
+</script>

package/src/components/xform/form-designer/setting-panel/property-editor/field-area-select/areaName-editor.vue

@@ -0,0 +1,20 @@
+<template>
+  <el-form-item :label="i18nt('designer.setting.areaName')">
+    <el-input v-model="optionModel.areaName" :placeholder="i18nt('designer.setting.areaNameHint')" />
+  </el-form-item>
+</template>
+
+<script>
+import i18n from "@base/components/xform/utils/i18n";
+import propertyMixin from "@base/components/xform/form-designer/setting-panel/property-editor/propertyMixin";
+
+export default {
+  name: "areaName-editor",
+  mixins: [i18n, propertyMixin],
+  props: {
+    designer: Object,
+    selectedWidget: Object,
+    optionModel: Object,
+  },
+};
+</script>

package/src/components/xform/form-designer/setting-panel/propertyRegister.js

@@ -82,6 +82,8 @@ const COMMON_PROPERTIES = {
   echarBarOption: "echart-bar-editor", //柱状图
   echarCategoryOption: "echart-category-editor", //折线图
   vabSearchName: "vabSearchName-editor",
+  areaName: "areaName-editor",
+  areaDataType: "areaDataType-editor",
   copyButton: "copyButton-editor",
   tempStorageFlag: "tempStorage-editor",
   formatType: "formatType-editor",

package/src/components/xform/form-designer/widget-panel/widgetsConfig.js

@@ -1393,6 +1393,58 @@ export const basicFields = [
       showRules: [],
     },
   },
+  {
+    type: "area-select",
+    icon: "select-field",
+    commonFlag: !0,
+    formItemFlag: !0,
+    columnFlag: true,
+    tableField: null,
+    options: {
+      name: "",
+      keyNameEnabled: !1,
+      keyName: "",
+      label: "",
+      labelColor: "",
+      submitFlag: true,
+      formField: "",
+      labelAlign: "",
+      defaultValue: null,
+      placeholder: "",
+      columnWidth: "200px",
+      widgetWidth: null,
+      size: "",
+      labelWidth: null,
+      labelHidden: !1,
+      readonly: !1,
+      disabled: !1,
+      hidden: !1,
+      clearable: !0,
+      required: !1,
+      requiredHint: "",
+      validation: "",
+      validationHint: "",
+      customClass: "",
+      labelIconClass: null,
+      labelIconPosition: "rear",
+      labelTooltip: null,
+      areaName: "",
+      areaDataType: 3,
+      locale: null,
+      onCreated: "",
+      onMounted: "",
+      onChange: "",
+      onFocus: "",
+      onBlur: "",
+      onValidate: "",
+      accessType: "1",
+      ...defaultWfConfig,
+      showRuleFlag: 1,
+      showRuleEnabled: 1,
+      showRules: [],
+      ...defaultTextFlagConfig,
+    },
+  },
   {
     type: "time",
     icon: "time-field",

package/src/components/xform/form-render/container-item/data-table-mixin.js

@@ -2606,6 +2606,10 @@ modules = {
           let vabSearchName = widget.options.vabSearchName;
           if (vabSearchName) newData[vabSearchName] = null;
         }
+        if (widget.type === "area-select") {
+          let areaName = widget.options.areaName;
+          if (areaName) newData[areaName] = null;
+        }
       }
     },
     createNewTableData(isEdit, defaultValueEnabled = true) {

package/src/components/xform/form-render/indexMixin.js

@@ -1564,6 +1564,18 @@ modules = {
             baseRefUtil.deepClone(val)
           );
         }
+      } else if ("area-select" === e.type) {
+        let c = currentFormData[fieldKeyName];
+        this.$set(this.formDataModel, fieldKeyName, baseRefUtil.deepClone(c));
+        let areaName = e.options.areaName;
+        if (areaName) {
+          let val = currentFormData[areaName] ?? null;
+          this.$set(
+            this.formDataModel,
+            areaName,
+            baseRefUtil.deepClone(val)
+          );
+        }
       } else if ("table2-item" === e.type) {
         this.$set(this.formDataModel, fieldKeyName, []);
       } else if (e.formItemFlag) {
@@ -2125,6 +2137,10 @@ modules = {
                 let vabSearchName = widget.options.vabSearchName;
                 if (vabSearchName) fieldMap[vabSearchName] = vabSearchName;
               }
+              if (this.isAreaSelectFlagWidget(widget)) {
+                let areaName = widget.options.areaName;
+                if (areaName) fieldMap[areaName] = areaName;
+              }
             }
           } else {
             if (widget.category === "container") {
@@ -2161,6 +2177,9 @@ modules = {
         type === "multiSearch"
       );
     },
+    isAreaSelectFlagWidget(widget) {
+      return widget?.type === "area-select";
+    },
     getFormTemplateTableDTOs() {
       let formTemplateTableDTOs = [];
       let formCode = this.reportTemplate.formCode;
@@ -2288,6 +2307,21 @@ modules = {
                 });
               }
             }
+          } else if (widget.tableField && this.isAreaSelectFlagWidget(widget)) {
+            if (submitFlag) {
+              fields.push({
+                fieldDesc: widget.options.label + "ID",
+                fieldName: widgetName,
+              });
+              let areaName = widget.options.areaName;
+              if (areaName) {
+                fields.push({
+                  fieldDesc: widget.options.label,
+                  fieldName: areaName,
+                  name: areaName,
+                });
+              }
+            }
           } else if (widget.tableField) {
             if (submitFlag) {
               fields.push({

package/src/components/xform/lang/en-US.js

@@ -55,6 +55,7 @@ export default {
           "file-upload": "File",
           "rich-editor": "Rich Editor",
           cascader: "Cascader",
+          "area-select": "Area Select",
           slot: "Slot",
           custom: "Custom Component"
         },
@@ -190,6 +191,12 @@ export default {
           textContent: "Text",
           htmlContent: "HTML",
           clearable: "Clearable",
+          areaDataType: "Area Level",
+          areaDataType1: "Province/City",
+          areaDataType2: "Province/City/District",
+          areaDataType3: "Province/City/District/Town",
+          areaName: "Area Name Field",
+          areaNameHint: "Form field name for area full name",
           editable: "Editable",
           format: "Format",
           valueFormat: "Value Format",

package/src/components/xform/lang/zh-CN.js

@@ -77,6 +77,7 @@ export default {
       "copy_button": "复制按钮",
       "rich-editor": "富文本",
       cascader: "级联选择",
+      "area-select": "地区选择",
       slot: "插槽",
       echart: '图表',
       'echart-pie': '饼图',
@@ -353,6 +354,12 @@ export default {
       preWrap: '自动换行',
       htmlContent: "HTML",
       clearable: "可清除",
+      areaDataType: "地区层级",
+      areaDataType1: "省/市",
+      areaDataType2: "省/市/区",
+      areaDataType3: "省/市/区/乡镇",
+      areaName: "地区名称字段",
+      areaNameHint: "用于保存地区全称的表单字段名",
       editable: "可输入",
       format: "显示格式",
       valueFormat: "绑定值格式",

package/src/index.js

@@ -134,6 +134,10 @@ import baseInputBatch from "@base/components/baseInputBatch/index.vue";
 
 Vue.component(baseInputBatch.name, baseInputBatch);
 
+import baseArea from "@base/components/baseArea/index.vue";
+
+Vue.component(baseArea.name, baseArea);
+
 Vue.component("baseInputExport", () =>
   import("@base/components/baseInputExport/index.vue")
 );

package/src/layout/components/Sidebar/default.vue

@@ -1547,7 +1547,7 @@ export default {
 //   height: auto !important;
 // }
 .el-menu--vertical{
-   > .el-menu--popup{overflow: hidden;
+   > .el-menu--popup{overflow: auto;//不用atuo 超出不出滚动条
       .el-submenu__title, .el-menu-item{
         height: auto !important;
         line-height: 1.4 !important;

package/src/views/bd/setting/formVersion/compareBasicSection.vue

@@ -76,8 +76,8 @@ export default {
   @include compare-cont-shell;
   @include compare-cont-title;
   @include compare-version-label;
+  margin:16px;
 }
-
 .table-border_1 {
   width: 100%;
   border-collapse: collapse;
@@ -86,8 +86,7 @@ export default {
   th,
   td {
     padding: 10px 12px;
-    border: 1px solid #ebeef5;
-    font-size: 13px;
+    border: 1px solid rgba(0,0,0,0.15);
     line-height: 20px;
     vertical-align: middle;
     word-break: break-all;
@@ -95,15 +94,15 @@ export default {
 
   th {
     width: 160px;
-    background: #f5f7fa;
-    color: #606266;
+    background: rgba(0,0,0,0.04);
+    color: rgba(0,0,0,.65);
     font-weight: 500;
     text-align: left;
   }
 
   td {
     width: calc((100% - 160px) / 2);
-    color: #303133;
+    color: rgba(0,0,0,.85);
 
     .version-blue,
     .version-green {
@@ -119,7 +118,7 @@ export default {
   tr.id-difference {
     td {
       background: #fef0f0;
-      color: #f56c6c;
+      color: $red;
     }
   }
 }

package/src/views/bd/setting/formVersion/compareCodeSection.vue

@@ -10,23 +10,25 @@
         </div>
         <div v-if="enableDiff" class="compare-diff-legend">
           <span class="compare-diff-nav">
-            <span
-              class="diff-nav-btn"
-              :class="{ 'is-disabled': !diffNavList.length }"
+            <el-button plain
+              :type="!diffNavList.length ? 'info' : 'primary'"
+              class="button-sty"
+              :disabled="!diffNavList.length"
               @click="diffNavList.length && gotoPrevDiff()"
             >
               <i class="el-icon-top"></i>{{ $t1("上一处差异") }}
-            </span>
-            <span
-              class="diff-nav-btn"
-              :class="{ 'is-disabled': !diffNavList.length }"
+            </el-button>
+            <el-button  plain
+              :type="!diffNavList.length ? 'info' : 'primary'"
+              class="button-sty"
+              :disabled="!diffNavList.length"
               @click="diffNavList.length && gotoNextDiff()"
             >
               <i class="el-icon-bottom"></i>{{ $t1("下一处差异") }}
-            </span>
-            <span class="diff-nav-btn" @click="gotoTop">
+            </el-button>
+            <el-button type="primary" plain @click="gotoTop" class="button-sty">
               <i class="el-icon-caret-top"></i>{{ $t1("返回顶部") }}
-            </span>
+            </el-button>
             <span v-if="diffNavList.length" class="diff-nav-count">
               {{ currentDiffIndex < 0 ? "-" : currentDiffIndex + 1 }} /
               {{ diffNavList.length }}
@@ -358,7 +360,8 @@ export default {
   @include compare-cont-full-link;
   @include compare-version-label;
   @include compare-flex-row;
-
+  padding:0 16px 16px;
+  overflow: hidden;
   .compare-code-flex {
     margin-top: 0;
 
@@ -378,17 +381,15 @@ export default {
     position: relative;
     min-height: 28px;
     padding-right: 24px;
+    margin-bottom:16px;
   }
 
   .compare-header-main {
-    display: flex;
-    align-items: center;
-    flex-wrap: wrap;
-    gap: 0 16px;
+    position:relative;
   }
 
   .title {
-    margin-bottom: 0 !important;
+
   }
 
   .compare-diff-legend {
@@ -397,7 +398,9 @@ export default {
     flex-wrap: wrap;
     font-size: 12px;
     gap: 0 12px;
-
+    position: absolute;
+    top: 8px;
+    left: 127px;
     .legend-item {
       display: inline-block;
       padding: 2px 8px;
@@ -501,6 +504,7 @@ export default {
     flex-direction: column;
     margin: 0;
     overflow: hidden;
+    background:#FFF;border-radius:12px;
 
     .compare-code-header {
       flex-shrink: 0;

package/src/views/bd/setting/formVersion/compareContMixin.scss

@@ -1,32 +1,26 @@
+@import "~@/styles/variables.scss";
 @mixin compare-cont-shell {
   position: relative;
-  margin-bottom: 8px;
-  padding: 8px;
-  background: #fff;
-  border-radius: 2px;
-
   ~ .compare-cont {
     margin-bottom: 0;
+
   }
 }
 
 @mixin compare-cont-title {
   > .title {
-    padding: 0 4px;
-    margin-bottom: 8px;
-    font-size: 14px;
-    color: #303133;
+    margin: -16px -16px 16px;
   }
 }
 
 @mixin compare-cont-full-link {
   .is-full {
     position: absolute;
-    top: 8px;
-    right: 8px;
-    padding: 2px 3px;
+    top: 12px;
+    right: 12px;
+    padding: 4px 6px;
     font-size: 16px;
-    color: #4595e6;
+    color: $baseColor;
     background: #f2f6fc;
     border-radius: 4px;
 
@@ -40,21 +34,21 @@
   .version-blue,
   .version-green {
     display: inline-block;
-    height: 22px;
-    margin-bottom: 8px;
-    padding: 0 4px;
-    font-size: 12px;
-    line-height: 22px;
+    height: 26px;
+    padding: 0 8px;
+    line-height: 26px;
     color: #fff;
     vertical-align: middle;
+    width: 88px;
+    text-align: center;
   }
 
   .version-blue {
-    background: #2c7eeb;
+    background: $baseColor;
   }
 
   .version-green {
-    background: #6dc442;
+    background: $green;
   }
 }
 

package/src/views/bd/setting/formVersion/compareDialog.vue

@@ -7,7 +7,7 @@
       :close-on-click-modal="falseValue"
       :visible.sync="showDialog"
       :modal="falseValue"
-      custom-class="dialog-style list-dialog dialog-checkbox pd_0 form-version-compare-dialog"
+      custom-class="dialog-style list-dialog dialog-checkbox nopd0 form-version-compare-dialog"
       width="1200px"
       @close="dialogClose"
       v-el-drag-dialog
@@ -16,7 +16,7 @@
     >
       <div
         class="cont compare-dialog-cont"
-        style="height: calc(100vh - 58px); overflow: auto"
+        style="height: calc(100vh - 48px); overflow: auto"
       >
         <compareContent
           v-if="compareReady"

package/src/views/bd/setting/formVersion/ftHistoryDialog.vue

@@ -7,7 +7,7 @@
       :close-on-click-modal="falseValue"
       :visible.sync="showDialog"
       :modal="falseValue"
-      custom-class="dialog-style list-dialog dialog-checkbox pd_0"
+      custom-class="dialog-style list-dialog dialog-checkbox nopd0"
       width="1200px"
       @close="dialogClose"
       v-el-drag-dialog
@@ -17,7 +17,7 @@
       <div
         class="cont"
         id="containt"
-        style="height: calc(100vh - 58px); overflow: hidden"
+        style="height: calc(100vh - 48px); overflow: hidden"
       >
         <el-tabs ref="xTabs" v-model="activeName" class="tab-box">
           <el-tab-pane :label="$t1('详情')" name="first">
@@ -392,7 +392,7 @@ export default {
 </script>
 <style scoped lang="scss">
 .grid-height {
-  height: calc(100vh - 110px) !important;
+  height: calc(100vh - 106px) !important;
 }
 ::v-deep .detail-wrap .d-cont {
   height: calc(100vh - 148px) !important;

package/src/views/bd/setting/formVersion/reverButton.vue

@@ -1,5 +1,5 @@
 <template>
-  <span class="button-sty" style="cursor: unset">
+  <span style="cursor: unset">
     <el-button
       type="primary"
       plain

package/src/views/bd/setting/formVersion/tableDetailDiff.js

@@ -34,14 +34,15 @@ export function getDetailRowKey(row, index = 0) {
 }
 
 export function sortDetailRowsByZdEn(rows = []) {
-  return [...rows].sort((a, b) => {
+  /* return [...rows].sort((a, b) => {
     const aVal = String(a?.zdEn ?? "");
     const bVal = String(b?.zdEn ?? "");
     return aVal.localeCompare(bVal, "zh-CN", {
       numeric: true,
       sensitivity: "base",
     });
-  });
+  }); */
+  return [...rows];
 }
 
 export function buildRowDiffMaps(preCellDiff = {}, curCellDiff = {}) {