eoss-mobiles 0.2.69 → 0.2.71

package/packages/picker/src/main.vue

@@ -13,9 +13,9 @@
       :placeholder="
         pickerValue
           ? pickerValue
-          : disabled || readonly
+          : (disabled || readonly) && placeholder == undefined
           ? '暂无数据'
-          : placeholder
+          : placeholder != undefined
           ? placeholder
           : `请选择${label}`
       "
@@ -52,9 +52,9 @@
           </div>
           <div v-else style="color:#c8c9cc">
             {{
-              disabled || readonly
+              (disabled || readonly) && placeholder == undefined
                 ? ' 暂无数据'
-                : !placeholder
+                : placeholder == undefined
                 ? '请选择' + label
                 : placeholder
             }}
@@ -75,6 +75,13 @@
         @cancel="showPicker = false"
         @confirm="onConfirm($event, true)"
       >
+        <template slot="columns-top" v-if="isSearch">
+          <em-search
+            v-model="keyWord"
+            @search="handleSearch"
+            placeholder="请输入搜索关键词"
+          />
+        </template>
         <template v-for="(index, name) in $slots" :slot="name">
           <slot :name="name" />
         </template>
@@ -92,7 +99,14 @@
         @cancel="onConfirm"
         @confirm="onConfirm($event, true)"
       >
-        <template slot="columns-top">
+        <template slot="columns-top" v-if="isSearch">
+          <em-search
+            v-model="keyWord"
+            @search="handleSearch"
+            placeholder="请输入搜索关键词"
+          />
+        </template>
+        <template slot="columns-bottom">
           <div class="em-picker__columns">
             <em-list
               v-model="listLoading"
@@ -133,6 +147,7 @@ export default {
     return {
       showPicker: false,
       newLoading: false,
+      keyWord: '',
       newLabelKey: '',
       newValueKey: '',
       listLoading: false,
@@ -150,6 +165,10 @@ export default {
       type: [String, Array, Object],
       default: ''
     },
+    isSearch: {
+      type: Boolean,
+      default: false
+    },
     hideLabel: {
       type: Boolean,
       default: false
@@ -197,6 +216,10 @@ export default {
       type: String,
       default: 'value'
     },
+    searchKey: {
+      type: String,
+      default: 'keyWord'
+    },
     labelKey: {
       type: String,
       default: 'name'
@@ -270,6 +293,10 @@ export default {
     }
   },
   watch: {
+    events: {
+      type: Object,
+      default: () => {}
+    },
     labelKey: {
       handler(val) {
         this.newLabelKey = val;
@@ -330,6 +357,21 @@ export default {
     }
   },
   methods: {
+    handleSearch() {
+      this.$emit('search', this.keyWord);
+
+      if (this.columns.length > 0) {
+        this.newColumns = this.columns.filter(
+          x => x[this.labelKey].indexOf(this.keyWord) != -1
+        );
+        if (!this.keyWord) {
+          this.newColumns = this.columns;
+        }
+      }
+
+      if ((this.columns && this.columns.length == 0) || !this.columns)
+        this.getSysCode();
+    },
     handleClick(val) {
       if (this.linkTag) {
         this.$emit('tagClick', val);
@@ -361,6 +403,7 @@ export default {
       this.pickerValue.splice(val, 1);
       this.checkList = this.checkList.filter(x => x != res.value);
       this.$emit('input', this.pickerValue);
+
       this.$emit('tagDelete', this.pickerValue);
     },
     toggle(index) {
@@ -464,7 +507,7 @@ export default {
       return value;
     },
     getSysCode() {
-      const { url, method, sysAppCode, param } = this;
+      let { url, method, sysAppCode, param, keyWord } = this;
       let params = {
         url: this.baseUrl
           ? this.baseUrl + (url || findSysCode)
@@ -476,6 +519,9 @@ export default {
           ...param
         }
       };
+      if (this.isSearch) {
+        params.params[this.searchKey] = keyWord;
+      }
       this.newLoading = true;
       request(params)
         .then(res => {

package/packages/selector/src/main.vue

@@ -3,13 +3,14 @@
     <selector-field
       v-if="!this.$scopedSlots.input && !this.$slots.input && !showTree"
       v-bind="$attrs"
+      :input-value="inputValue"
       :data="selectList"
       @change="handleChangeSel"
       @click="handleSelector"
     />
     <slot v-else name="input" :click="handleSelector" />
     <em-selector-tree
-      v-if="(showSelectorTree || showTree) && (typeof value !== 'string')"
+      v-if="(showSelectorTree || showTree) && typeof value !== 'string'"
       v-bind="$attrs"
       v-on="$listeners"
       :showTree="showTree"
@@ -19,26 +20,42 @@
       @dispose="handleDispose"
       @close="handleDispose()"
     >
-    <template v-if="$scopedSlots['tree-icon']" slot="tree-icon" slot-scope="{value}">
-      <slot  v-if="$scopedSlots['tree-icon']" name="tree-icon" :value="value"></slot>
-    </template>
+      <template
+        v-if="$scopedSlots['tree-icon']"
+        slot="tree-icon"
+        slot-scope="{ value }"
+      >
+        <slot
+          v-if="$scopedSlots['tree-icon']"
+          name="tree-icon"
+          :value="value"
+        ></slot>
+      </template>
     </em-selector-tree>
     <div v-if="typeof value === 'string'">
       <em-selector-tree
-      v-show="showSelectorTree || showTree"
-      v-bind="$attrs"
-      v-on="$listeners"
-      :showTree="showTree"
-      :showMore="$listeners['left-icon'] == undefined"
-      :isTreeIcon=" $scopedSlots['tree-icon'] != undefined"
-      :selectList.sync="selectList"
-      @dispose="handleDispose"
-      @close="handleDispose()"
-    >
-    <template v-if="$scopedSlots['tree-icon']" slot="tree-icon" slot-scope="{value}">
-      <slot  v-if="$scopedSlots['tree-icon']" name="tree-icon" :value="value"></slot>
-    </template>
-    </em-selector-tree>
+        v-show="showSelectorTree || showTree"
+        v-bind="$attrs"
+        v-on="$listeners"
+        :showTree="showTree"
+        :showMore="$listeners['left-icon'] == undefined"
+        :isTreeIcon="$scopedSlots['tree-icon'] != undefined"
+        :selectList.sync="selectList"
+        @dispose="handleDispose"
+        @close="handleDispose()"
+      >
+        <template
+          v-if="$scopedSlots['tree-icon']"
+          slot="tree-icon"
+          slot-scope="{ value }"
+        >
+          <slot
+            v-if="$scopedSlots['tree-icon']"
+            name="tree-icon"
+            :value="value"
+          ></slot>
+        </template>
+      </em-selector-tree>
     </div>
   </div>
 </template>
@@ -51,25 +68,33 @@ export default {
   name: 'EmSelector',
   inheritAttrs: false,
   props: {
-    value: { type: [Array,String], default: () => [] },
+    value: { type: [Array, String], default: () => [] },
     showTree: {
       type: Boolean,
       default: false
-    },
+    }
   },
   data() {
     return {
       showSelectorTree: false,
+      inputValue: ''
       // newSelectList:[]
     };
   },
-  watch:{
-    value:{
-      handler(val){
+  watch: {
+    value: {
+      handler(val) {
         this.selectList = val;
+        if (this.selectList.length > 0) {
+          this.inputValue = this.selectList[0][
+            this.$attrs.labelKey || this.$attrs['label-key'] || 'showname'
+          ];
+        } else {
+          this.inputValue = '';
+        }
       },
-      deep:true,
-      immediate:true
+      deep: true,
+      immediate: true
     }
   },
   computed: {
@@ -99,9 +124,18 @@ export default {
      * @param {Object} val 选中的人员/单位
      */
     handleDispose(val) {
+      this.inputValue = '';
       if (val) {
         const { list } = val;
         this.selectList = list;
+        if (val.list.length > 0) {
+          this.inputValue =
+            list[0][
+              this.$attrs.labelKey || this.$attrs['label-key'] || 'showname'
+            ];
+        } else {
+          this.inputValue = '';
+        }
       }
       this.showSelectorTree = false;
     },
@@ -113,6 +147,18 @@ export default {
      * @param {Array} val 变化后的选中数据
      */
     handleChangeSel(val) {
+      if (val) {
+        const { list } = val;
+        this.selectList = list;
+        if (val.list.length > 0) {
+          this.inputValue =
+            list[0][
+              this.$attrs.labelKey || this.$attrs['label-key'] || 'showname'
+            ];
+        } else {
+          this.inputValue = '';
+        }
+      }
       this.$emit('input', val.list);
     }
   }

package/packages/selector/src/selector-field.vue

@@ -3,6 +3,7 @@
     <em-input
       :class="{ 'hide-label': hideLabel }"
       v-bind="$attrs"
+      v-model="inputValue"
       readonly
       clickable
       @click="clickTree()"
@@ -58,12 +59,7 @@
 
           <div v-else style="color:#c8c9cc">
             {{
-              disabled
-                ? $attrs.placeholder
-                  ? $attrs.placeholder
-                  : ' 暂无数据'
-                : !$attrs.placeholder
-                ? '请选择' + $attrs.label
+              disabled && !$attrs.placeholder ?'暂无数据' : !$attrs.placeholder ? '请选择' + $attrs.label
                 : $attrs.placeholder
             }}
           </div>
@@ -79,7 +75,7 @@ export default {
     return {
       newSelectList: [],
       newNextUserList: [],
-      selectValue: ''
+      selectValue: '',
     };
   },
   props: {
@@ -91,6 +87,10 @@ export default {
       type: Boolean,
       default: false
     },
+    inputValue:{
+      type:String,
+      default:''
+    },
     readonly: { type: Boolean, default: false },
     selectDisabled: {
       type: Boolean,
@@ -182,7 +182,6 @@ export default {
       }, []);
     },
     handleChange(val, info) {
-      console.log('点击了');
       const _this = this;
       if (_this.multiple) {
         if (info.checked) {

package/packages/selector/src/selector-tree.vue

@@ -44,6 +44,14 @@
         :departmentLabelKey="departmentLabelKey"
         :departmentValueKey="departmentValueKey"
         :nodeKey="nodeKey"
+        :showCount="showCount"
+        :countKey="countKey"
+        :showNameIcon="showNameIcon"
+        :nameColor="nameColor"
+        :nameBgColor="nameBgColor"
+        :countPosition="countPosition"
+        :nameSize="nameSize"
+        :unit="unit"
         v-on="$listeners"
         @popen="open"
         :isAllCheck="isAllCheck"
@@ -100,6 +108,42 @@ export default {
       type: Boolean,
       default: false
     },
+    nameSize:{
+      type:[String,Number],
+      default:38
+    },
+     nameBgColor:{
+      tpe:String,
+      default:''
+    },
+     countPosition:{
+      type:String,
+      default:'right'
+    },
+     showNameIcon:{
+      type: Boolean,
+      default: false
+    },
+    nameColor:{
+      type:String,
+      default:'#fff'
+    },
+    showNameIcon: {
+      type: Boolean,
+      default: false
+    },
+    countKey: {
+      type: String,
+      default: 'count'
+    },
+    showCount: {
+      type: Boolean,
+      default: false
+    },
+    unit: {
+      type: String,
+      default: '人'
+    },
     showSearch: {
       type: Boolean,
       default: true
@@ -684,7 +728,8 @@ export default {
       ].param.selecttype;
       if (this.newParam.selecttype === 'persongroup') {
         this.newParam.pid = 'root';
-        this.newParam.myUserid = this.newParam.myUserid || $.getStorage('userId');
+        this.newParam.myUserid =
+          this.newParam.myUserid || $.getStorage('userId');
       } else {
         this.newParam.pid = this.param.pid || 'root';
       }
@@ -812,7 +857,7 @@ export default {
         }
       }
       let newData = res.obj;
-      if (!newData.children && !isStart) {
+      if ((!newData.children || newData.children.length == 0) && !isStart) {
         if (this.nodeList && this.nodeList.length > 0) {
           this.$toast.loading({
             message: '加载中...',
@@ -867,7 +912,7 @@ export default {
             this.$toast.clear();
           }
         } else {
-          if (!res.obj.children) {
+          if (!res.obj.children || res.obj.children.length == 0) {
             this.getData(res.obj);
           }
         }

package/packages/selector/src/tree.vue

@@ -7,13 +7,14 @@
       :class="{ active: item.open }"
     >
       <div v-if="item[nodeKey] && isShowNode(item[valueKey])">
-        <div v-tap="{ methods: handleClickIcon, obj: item }"  class="title">
+        <div v-tap="{ methods: handleClickIcon, obj: item }" class="title">
           <div class="text">
             <div
               class="label"
               v-if="
                 (item.parentshowid === '' || item.parentshowid === 'root') &&
-                  !isTreeIcon
+                  !isTreeIcon &&
+                  !showNameIcon
               "
             >
               <!-- item[labelKey] && item[labelKey].length > 12
@@ -21,36 +22,74 @@
                 : item[labelKey] -->
             </div>
             <div
-              v-if="isTreeIcon"
+              v-if="showNameIcon"
+              class="label-name-icon"
+              :style="{
+                width: nameSize + 'px',
+                height: nameSize + 'px',
+                color: item.color || nameColor,
+                backgroundColor: item.bgColor || nameBgColor
+              }"
+            >
+              {{ item[labelKey].substring(0, 1) }}
+            </div>
+            <div
+              v-else-if="isTreeIcon"
               v-tap.stop="{ methods: handleClickIcon, obj: item }"
             >
               <slot name="tree-icon" :value="item"></slot>
             </div>
-           <span v-tap.stop="{ methods: opened, obj: item }">{{ item[labelKey] }}</span> 
+            <span
+              v-tap.stop="{ methods: opened, obj: item }"
+              class="label-name-text"
+              :style="{
+                display: countPosition === 'right' ? 'flex' : 'unset',
+                flex: countPosition === 'right' ? '1' : 'unset'
+              }"
+              >{{ item[labelKey] }}</span
+            >
+            <span
+              class="selector-left-count"
+              v-if="showCount && countPosition === 'left' && item[countKey]"
+              >{{ item[countKey] + unit }}</span
+            >
+          </div>
+          <div class="selector-right">
+            <span
+              class="selector-right-count"
+              v-if="showCount && countPosition === 'right' && item[countKey]"
+              >{{ item[countKey] + unit }}</span
+            >
+            <van-icon
+              name="arrow"
+              v-tap.stop="{ methods: handleClickIcon, obj: item }"
+              class="right"
+              :style="{ transform: item.open ? 'rotate(90deg)' : '' }"
+              v-if="showMore"
+            />
+            <i
+              class="iconfont icon-gou select-icon"
+              v-show="
+                (enterprise ||
+                  (department &&
+                    item[departmentLabelKey] == departmentValueKey)) &&
+                  !showTree
+              "
+              v-tap.stop="{ methods: checke, obj: item }"
+              v-if="item.checked"
+            ></i>
+            <i
+              class="iconfont icon-quan select-icon"
+              v-show="
+                (enterprise ||
+                  (department &&
+                    item[departmentLabelKey] == departmentValueKey)) &&
+                  !showTree
+              "
+              v-tap.stop="{ methods: checke, obj: item }"
+              v-else
+            ></i>
           </div>
-          <van-icon name="arrow"  v-tap.stop="{ methods: handleClickIcon, obj: item }" class="right" v-if="showMore" />
-          <i
-            class="iconfont icon-gou select-icon"
-            v-show="
-              (enterprise ||
-                (department &&
-                  item[departmentLabelKey] == departmentValueKey)) &&
-                !showTree
-            "
-            v-tap.stop="{ methods: checke, obj: item }"
-            v-if="item.checked"
-          ></i>
-          <i
-            class="iconfont icon-quan select-icon"
-            v-show="
-              (enterprise ||
-                (department &&
-                  item[departmentLabelKey] == departmentValueKey)) &&
-                !showTree
-            "
-            v-tap.stop="{ methods: checke, obj: item }"
-            v-else
-          ></i>
         </div>
         <template v-if="item.children && item.children.length > 0">
           <em-tree
@@ -65,6 +104,14 @@
             :label-key="labelKey"
             :value-key="valueKey"
             :showTree="showTree"
+            :showCount="showCount"
+            :countKey="countKey"
+            :showNameIcon="showNameIcon"
+            :nameBgColor="nameBgColor"
+            :countPosition="countPosition"
+            :nameColor="nameColor"
+            :nameSize="nameSize"
+            :unit="unit"
             :showMore="showMore"
             :enterprise="enterprise"
             :isTreeIcon="isTreeIcon"
@@ -96,7 +143,7 @@
               "
             ></div>
             <div
-              class="head"
+              class="em-show-tree-head"
               v-if="
                 ((item.attr && JSON.parse(item.attr).sex) ||
                   item.sex ||
@@ -162,6 +209,38 @@ export default {
   inheritAttrs: false,
   props: {
     model: Array,
+    nameSize: {
+      type: [String, Number],
+      default: 38
+    },
+    showNameIcon: {
+      type: Boolean,
+      default: false
+    },
+    nameBgColor: {
+      tpe: String,
+      default: ''
+    },
+    countPosition: {
+      type: String,
+      default: 'right'
+    },
+    nameColor: {
+      type: String,
+      default: '#fff'
+    },
+    countKey: {
+      type: String,
+      default: 'count'
+    },
+    showCount: {
+      type: Boolean,
+      default: false
+    },
+    unit: {
+      type: String,
+      default: '人'
+    },
     enterprise: {
       type: Boolean,
       default: false
@@ -207,13 +286,13 @@ export default {
       type: String,
       default: 'showshortname'
     },
-    isAllCheck:{
-      type:Boolean,
-      default:false
+    isAllCheck: {
+      type: Boolean,
+      default: false
     },
-    showMore:{
-      type:Boolean,
-      default:true
+    showMore: {
+      type: Boolean,
+      default: true
     },
     oldIsSearch: Boolean,
     isSearch: Boolean
@@ -244,17 +323,17 @@ export default {
     });
   },
   methods: {
-    handleClickIcon(res, isStart){
-      if(!this.$listeners['left-icon'] && !this.showMore) return
-       this.$emit('popen', res, res.isStart || isStart,true,'node');
+    handleClickIcon(res, isStart) {
+      if (!this.$listeners['left-icon'] && !this.showMore) return;
+      this.$emit('popen', res, res.isStart || isStart, true, 'node');
     },
     opened(res, isStart) {
-      this.$emit('popen', res, res.isStart || isStart,true,'title');
+      this.$emit('popen', res, res.isStart || isStart, true, 'title');
     },
     checke(res) {
-      let model = undefined
-      if(this.isAllCheck) model = this.model
-      this.$emit('checke', res,model);
+      let model = undefined;
+      if (this.isAllCheck) model = this.model;
+      this.$emit('checke', res, model);
     },
     isShowNode(id) {
       let isShow = true;