@sy-common/organize-select-help 1.0.0-beta.24 → 1.0.0-beta.26

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sy-common/organize-select-help",
-  "version": "1.0.0-beta.24",
+  "version": "1.0.0-beta.26",
   "description": "",
   "main": "index.js",
   "author": "lambo",

package/src/index.vue

@@ -62,8 +62,16 @@
             </TabPane>
             <TabPane label="岗位选择" name="post" v-if="name.includes('post')">
               <div class="tab post">
-                <div class="left">
-                  <div v-for="item in positiontList" :class="[selectedPositionId === item.positionId ? 'active' : '']" :key="item.positionId" @click="getPosionId(item)">{{ item.positionName }}</div>
+                <div class="left" style="height: 450px; overflow: hidden; position: relative; z-index: 1;">
+                  <div class="scroll-container">
+                    <div class="position-item"
+                         v-for="item in positiontList"
+                         :class="[selectedPositionId === item.positionId ? 'active' : '']"
+                         :key="item.positionId"
+                         @click="getPosionId(item)">
+                      {{ item.positionName }} <!-- 无需修改模板，仅通过样式实现自动换行 -->
+                    </div>
+                  </div>
                 </div>
                 <div class="right">
                   <span>组织搜索：</span>
@@ -261,7 +269,7 @@ export default {
   mounted() {
     this.queryTagList()
     this.queryPositionList()
-    this.loadMore()
+    // this.loadMore()
   },
   methods:{
     handlePostTagSelect(quickPickKey) {
@@ -720,6 +728,21 @@ export default {
     },
     visibleChange(val){
       this.$emit('input',val);
+      // val 为 true 时表示帮助框打开，此时发起请求
+      if (val) {
+        this.initStaffList() // 新增初始化方法，统一处理打开后的请求逻辑
+      } else {
+        // 可选：关闭帮助框时重置人员列表相关状态，避免下次打开残留旧数据
+        this.staffEnding = false;
+        this.offset = 0;
+        this.staffAllList = [];
+      }
+    },
+    initStaffList() {
+      this.staffEnding = false;
+      this.offset = 0;
+      this.staffAllList = [];
+      this.loadMore(); // 打开帮助框后，再发起第一次请求
     },
     // 处理Tab切换，同步更新tabName
     handleTabChange(tabName) {
@@ -1293,6 +1316,71 @@ export default {
 }
 </script>
 <style lang="less" scoped>
+.tab.post .left {
+  width: 200px;
+  height: 450px !important;
+  overflow: hidden !important;
+  padding-right: 10px;
+  box-sizing: border-box;
+}
+
+.scroll-container {
+  height: 100% !important; /* 完全填充父容器高度 */
+  overflow-y: auto !important; /* 内容超出时显示滚动条，不足时隐藏（也可设为scroll强制显示） */
+  overflow-x: hidden !important;
+  padding: 8px 0;
+  /* 消除可能的内边距/外边距影响 */
+  margin: 0;
+  box-sizing: border-box;
+}
+
+/* 3. 强化滚动条样式，确保可见性（兼容webkit浏览器） */
+.scroll-container::-webkit-scrollbar {
+  width: 8px !important; /* 滚动条宽度，确保肉眼可见 */
+  height: 8px;
+  display: block !important; /* 强制显示滚动条容器，避免被隐藏 */
+}
+
+.scroll-container::-webkit-scrollbar-thumb {
+  background-color: #ccc !important; /* 滑块颜色，与背景区分明显 */
+  border-radius: 4px !important;
+  transition: background-color 0.2s;
+}
+
+.scroll-container::-webkit-scrollbar-thumb:hover {
+  background-color: #999 !important; /* hover时加深，增强交互感 */
+}
+
+.scroll-container::-webkit-scrollbar-track {
+  background-color: #f9f9f9 !important; /* 轨道颜色，与容器背景区分 */
+  border-radius: 4px !important;
+}
+
+/* 4. 保持position-item原有样式，确保布局正常 */
+.position-item {
+  border: 1px solid #ddd;
+  margin: 5px 0;
+  padding: 8px 10px;
+  border-radius: 2px;
+  cursor: pointer;
+  transition: background-color 0.2s;
+  /* 取消文字截断，允许自动换行 */
+  white-space: normal !important; /* 关键：取消强制不换行，恢复默认自动换行 */
+  overflow: visible !important; /* 关键：取消内容隐藏，展示全部文字 */
+  text-overflow: clip !important; /* 取消省略号，显示完整文字 */
+  line-height: 1.4; /* 优化行高，换行后文字更易读 */
+  min-height: 40px; /* 给个最小高度，避免内容过少时容器过扁 */
+  word-wrap: break-word; /* 兼容长英文/数字，强制换行（防止横向溢出） */
+}
+
+.position-item.active {
+  border-color: #1890ff;
+  background-color: #e6f7ff;
+}
+
+.position-item:hover:not(.active) {
+  background-color: #f5f5f5;
+}
 .custom-select-wrapper {
   position: relative;