cloud-web-corejs 1.0.54-dev.740 → 1.0.54-dev.743

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "cloud-web-corejs",
   "private": false,
-  "version": "1.0.54-dev.740",
+  "version": "1.0.54-dev.743",
   "scripts": {
     "dev": "vue-cli-service serve",
     "lint": "eslint --ext .js,.vue src",

package/src/components/baseArea/index.vue

@@ -111,6 +111,28 @@
             <i class="el-icon-arrow-right"></i>
           </el-button>
         </div>
+        <div class="base-area-footer">
+          <el-button
+            type="primary"
+            plain
+            class="button-sty"
+            @mousedown.prevent
+            @click="cancelSelection"
+          >
+            <i class="el-icon-close el-icon"></i>
+            {{ cancelText }}
+          </el-button>
+          <el-button
+            type="primary"
+            class="button-sty"
+            :disabled="!canConfirm"
+            @mousedown.prevent
+            @click="confirmSelection"
+          >
+            <i class="el-icon-check el-icon"></i>
+            {{ confirmText }}
+          </el-button>
+        </div>
       </div>
       <div slot="reference" class="base-area-trigger">
         <el-input
@@ -159,6 +181,11 @@ export default {
       type: Number,
       default: 4,
     },
+    /** 至少选到该层级才提交值（1-4）；分支无下级数据时视为末级 */
+    minLevel: {
+      type: Number,
+      default: 1,
+    },
     locale: {
       type: String,
       default: null,
@@ -187,6 +214,14 @@ export default {
       type: String,
       default: "暂无匹配地区",
     },
+    confirmText: {
+      type: String,
+      default: "确 定",
+    },
+    cancelText: {
+      type: String,
+      default: "取 消",
+    },
     size: {
       type: String,
       default: "small",
@@ -219,6 +254,7 @@ export default {
       committedBrowseSnapshot: null,
       committedBoundValue: null,
       lastSelectionPayload: null,
+      pendingLeaf: false,
     };
   },
   computed: {
@@ -268,6 +304,19 @@ export default {
     browseLevelCount() {
       return Math.max(this.maxLevel, this.selectedPath.length, 1);
     },
+    effectiveMinLevel() {
+      const min = this.minLevel == null ? 1 : this.minLevel;
+      return Math.max(1, Math.min(min, this.maxLevel));
+    },
+    canConfirm() {
+      if (!this.selectedPath.length) {
+        return false;
+      }
+      /* 达到最小选择层级，或该地区无下级数据（视为末级） */
+      return (
+        this.selectedPath.length >= this.effectiveMinLevel || this.pendingLeaf
+      );
+    },
     currentLevelLabel() {
       return LEVEL_LABELS[this.activeLevel - 1] || `第${this.activeLevel}级`;
     },
@@ -515,6 +564,7 @@ export default {
       return level === 1 || this.selectedPath.length >= level - 1;
     },
     handlePopoverShow() {
+      this.pendingLeaf = false;
       this.saveCommittedBrowseSnapshot();
       this.$emit("popover-open");
       this.$nextTick(() => {
@@ -1013,6 +1063,7 @@ export default {
       this.searchKeyword = "";
       this.searchList = [];
       this.searchDropdownVisible = false;
+      this.pendingLeaf = false;
       this.cancelPendingSync();
       this.emitChangeIfCommitted();
       this.restoreBrowseStateIfUncommitted();
@@ -1068,6 +1119,19 @@ export default {
       }
       this.switchLevel(this.activeLevel - 1);
     },
+    confirmSelection() {
+      if (!this.canConfirm) {
+        return;
+      }
+      const last = this.selectedPath[this.selectedPath.length - 1];
+      this.applySelection(last).then(() => {
+        this.popoverVisible = false;
+      });
+    },
+    cancelSelection() {
+      /* 关闭弹层，未确认的浏览状态由 hide 回调恢复 */
+      this.popoverVisible = false;
+    },
     nextLevel() {
       if (!this.canNextLevel) {
         return;
@@ -1080,8 +1144,20 @@ export default {
         this.searchKeyword = "";
         this.searchList = [];
         this.searchDropdownVisible = false;
-        this.applySelection(item).then(() => {
-          this.popoverVisible = false;
+        this.pendingLeaf = false;
+        if (this.selectedPath.length >= this.effectiveMinLevel) {
+          /* 已达到最小选择层级：等待确认 */
+          return;
+        }
+        /* 搜索结果未达到最小选择层级：有下级只定位下钻，无下级视为末级 */
+        const last = this.selectedPath[this.selectedPath.length - 1] || item;
+        this.fetchChildren(this.getAreaId(last)).then((children) => {
+          if (!children.length) {
+            this.pendingLeaf = true;
+            return;
+          }
+          this.activeLevel = this.selectedPath.length + 1;
+          this.levelItems = children;
         });
       });
     },
@@ -1093,19 +1169,19 @@ export default {
       const level = this.activeLevel;
       this.selectedPath = this.selectedPath.slice(0, level - 1);
       this.selectedPath.push(item);
-      this.applySelection(item).then(() => {
-        if (level >= this.maxLevel) {
-          this.popoverVisible = false;
+      this.pendingLeaf = false;
+      if (level >= this.maxLevel) {
+        /* 已到最大层级：等待确认 */
+        return;
+      }
+      this.fetchChildren(this.getAreaId(item)).then((children) => {
+        if (!children.length) {
+          /* 无下级数据：视为末级，等待确认 */
+          this.pendingLeaf = true;
           return;
         }
-        this.fetchChildren(this.getAreaId(item)).then((children) => {
-          if (!children.length) {
-            this.popoverVisible = false;
-            return;
-          }
-          this.activeLevel = level + 1;
-          this.levelItems = children;
-        });
+        this.activeLevel = level + 1;
+        this.levelItems = children;
       });
     },
     async clampPathToMaxLevel(path) {
@@ -1450,6 +1526,15 @@ export default {
     user-select: none;
   }
 }
+
+.base-area-footer {
+  display: flex;
+  align-items: center;
+  justify-content: flex-end;
+  margin-top: 8px;
+  padding-top: 8px;
+  border-top: 1px solid #ebeef5;
+}
 </style>
 
 <style lang="scss">