n20-common-lib 2.7.0-beta.2 → 2.7.0-beta.21

package/src/components/AdvancedFilter/index.vue

@@ -1,6 +1,6 @@
 <template>
   <div :class="prefixCls">
-    <el-form ref="advancedFilter" v-if="visible" :class="prefixCls + '-body'">
+    <el-form ref="advancedFilter" v-show="visible" :class="prefixCls + '-body'">
       <slot name="prefix"></slot>
       <el-form-item
         v-for="item in GroupData"
@@ -18,13 +18,14 @@
             :item="item"
             @blur="$emit('blur')"
             @clean="$emit('clean')"
+            @enter="$emit('enter')"
             @filter="$emit('filter', model)"
           />
         </div>
         <i
-          v-if="!item.isDefault"
+          v-if="!item.isNotClose"
           :key="getOnlyKey(item)"
-          :class="[prefixCls + '-item-close', 'n20-icon-yichu']"
+          :class="['filter_remove', 'n20-icon-yichu']"
           @click="handleClose(item)"
         ></i>
       </el-form-item>
@@ -33,11 +34,25 @@
         <el-button v-popover:advanced_popover onlyicon plain icon="el-icon-plus" />
         <el-popover ref="advanced_popover" placement="bottom-start" trigger="click">
           <el-input v-model="keyword" clearable class="input-w m-b-s" :placeholder="$lc('搜索筛选条件')" />
-          <filterItem :filter-list="filterListS" :check-array.sync="checkList" @checked="check" />
+          <div class="flex-box flex-lr">
+            <el-button type="text" @click="allCheck">全选</el-button>
+            <el-button type="text" @click="defaultCheck"> 恢复默认</el-button>
+          </div>
+          <filterItem
+            :filter-list="filterListS"
+            :maxLength="maxLength"
+            :check-array.sync="checkList"
+            @checked="check"
+          />
+          <div class="flex-box flex-c m-t-m">
+            <el-button size="mini" type="primary" @click="savaCheck">确认</el-button>
+            <el-button plain type="primary" @click="cancel">取消</el-button>
+          </div>
         </el-popover>
-        <el-link class="m-l-s f-s-s" :underline="false" icon="n20-icon-qingchu" @click="cleared">
-          {{ '清除条件' | $lc }}</el-link
+        <el-link class="m-l-s color-primary" :underline="false" icon="n20-icon-query" @click="$emit('search')">
+          {{ '查询' | $lc }}</el-link
         >
+        <el-link class="m-l-s" :underline="false" icon="n20-icon-qingchu" @click="cleared"> {{ '清空' | $lc }}</el-link>
       </el-form-item>
     </el-form>
   </div>
@@ -60,9 +75,27 @@ export default {
     // formItemInput,
     formItemRender,
     InputSearch,
+    // FormItem,
     filterItem
   },
+  provide() {
+    return {
+      prefixCls,
+      nFilter: this
+    }
+  },
   props: {
+    isNotClose: {
+      type: Boolean,
+      default: false
+    },
+    maxLength: {
+      type: Number
+    },
+    removeLoad: {
+      type: Boolean,
+      default: true
+    },
     visible: {
       type: Boolean,
       default: false
@@ -91,7 +124,7 @@ export default {
       remoteList: [],
       GroupData: [],
       checkList: [],
-      checkC: [],
+      defineCheckList: [],
       userNo: sessionStorage.getItem('userNo')
     }
   },
@@ -157,7 +190,13 @@ export default {
       let flag = ''
       switch (item.type) {
         case 'numberrange':
-          flag = this.model[item.startValue] && this.model[item.endValue] ? this.prefixCls + '-active' : ''
+          flag =
+            this.model[item.startValue] !== null &&
+            this.model[item.endValue] !== null &&
+            this.model[item.startValue] !== undefined &&
+            this.model[item.endValue] !== undefined
+              ? this.prefixCls + '-active'
+              : ''
           break
         case 'daterange':
         case 'datetimerange':
@@ -219,19 +258,53 @@ export default {
     cleared() {
       this.$emit('clear')
     },
-
-    check: _debounce(function (keys) {
-      // 保存当前选择的过滤条件
-      this.checkList = keys
+    setModelData(list) {
+      let arr = []
+      list.forEach((res) => {
+        if (res.value) {
+          arr.push(res.value)
+        } else if (res.startDate && res.endDate) {
+          arr.push(res.startDate)
+          arr.push(res.endDate)
+        } else if (res.startValue && res.endValue) {
+          arr.push(res.startValue)
+          arr.push(res.endValue)
+        }
+      })
+      for (const key in this.model) {
+        if (Object.hasOwnProperty.call(this.model, key)) {
+          if (!arr.includes(key)) {
+            delete this.model[key]
+          }
+        }
+      }
+    },
+    allCheck() {
+      if (this.maxLength) {
+        this.checkList = this.filterListS.slice(0, this.maxLength)?.map((res) => res[this.onlyKey])
+        console.log(this.checkList, this.filterListS)
+      } else {
+        this.checkList = this.filterListS?.map((res) => res[this.onlyKey])
+      }
+    },
+    defaultCheck() {
+      this.checkList = this.defineCheckList
+    },
+    cancel() {
+      this.checkList = this.defineCheckList
+      this.$refs.advanced_popover.showPopper = false
+    },
+    savaCheck() {
       let saveCheckArr = []
       // 如果keys数组不为空
-      if (keys.length > 0) {
+      if (this.checkList.length > 0) {
         this.filterList.forEach((item) => {
-          if (keys.includes(item.id)) {
+          if (this.checkList.includes(item[this.onlyKey])) {
             saveCheckArr.push(item)
           }
         })
       }
+      this.setModelData(saveCheckArr)
       this.saveFilter(saveCheckArr).then(({ code }) => {
         // 如果保存成功
         if (code === 200) {
@@ -239,9 +312,12 @@ export default {
           this.getFilterList()
         }
       })
+      this.$refs.advanced_popover.showPopper = false
       this.$emit('check')
-      // // 保存过滤条件
-    }, 1000),
+    },
+    check(keys) {
+      this.checkList = keys
+    },
     /**
      * 保存筛选条件
      * @param data
@@ -282,7 +358,7 @@ export default {
             this.GroupData = _data.map((item) => {
               for (let i = 0; i < this.filterList.length; i++) {
                 const originItem = this.filterList[i]
-                if (originItem.id === item.id) {
+                if (originItem[this.onlyKey] === item[this.onlyKey]) {
                   item.label = originItem.label
                   if (item.options && originItem.options) {
                     item.options = originItem.options
@@ -292,14 +368,28 @@ export default {
               return item
             })
           } else {
-            this.GroupData = this.filterList.filter((item) => {
-              if (item.isDefault) {
-                return item
-              }
-            })
+            if (this.removeLoad) {
+              this.GroupData = this.filterList.filter((item) => {
+                if (item.isDefault) {
+                  return item
+                }
+              })
+            } else {
+              this.GroupData = []
+            }
           }
           this.checkList = this.GroupData.map((res) => res.id)
-          this.checkC = cloneDeep(this.checkList)
+          this.defineCheckList = cloneDeep(this.checkList)
+          // 查找排序，在this.filterList中查找this.checkList中的每一项，并将其排在前面
+          this.filterList = this.filterList.sort((a, b) => {
+            if (this.checkList.includes(a[this.onlyKey]) && !this.checkList.includes(b[this.onlyKey])) {
+              return -1
+            }
+            if (!this.checkList.includes(a[this.onlyKey]) && this.checkList.includes(b[this.onlyKey])) {
+              return 1
+            }
+            return 0
+          })
         })
         .finally(() => {
           for (const key in getOptionsMap()) {

package/src/components/AdvancedFilter/main/Form/form-item.vue

@@ -0,0 +1,87 @@
+<template>
+  <div class="n20-form-item">
+    <label class="n20-form-item__label">{{ label }}</label>
+    <div class="n20-form-item__value">
+      <slot></slot>
+    </div>
+    <i class="filter_remove n20-icon-yichu"></i>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'FormItem',
+  inject: ['Form'],
+  props: {
+    label: {
+      type: String,
+      default: ''
+    },
+    item: {
+      type: Object
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.n20-form-item {
+  position: relative;
+  display: inline-block;
+  vertical-align: middle;
+  max-width: 426px;
+  height: 32px;
+  line-height: 32px;
+  margin-right: 8px;
+  margin-bottom: 8px;
+  padding-left: 8px;
+  border-radius: 4px;
+  border: 1px solid #dcdfe5;
+  background: #fff;
+  cursor: pointer;
+  &__label {
+    display: inline-block;
+    vertical-align: middle;
+    white-space: nowrap;
+    overflow: hidden;
+    max-width: 168px;
+    margin-right: 6px;
+    color: #182b50;
+  }
+  &__value {
+    display: inline-block;
+    vertical-align: middle;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    .el-input .el-input__inner {
+      border: none;
+      padding-left: 0;
+      background-color: transparent;
+    }
+
+    .el-input__inner:focus {
+      box-shadow: none;
+    }
+  }
+  .filter_remove {
+    display: none;
+    position: absolute;
+    height: 13px;
+    width: 13px;
+    background: #f1f1f1;
+    right: -5px;
+    top: -7px;
+    font-size: 14px;
+    z-index: 1;
+    border-radius: 50%;
+    cursor: pointer;
+  }
+
+  &:hover {
+    .filter_remove {
+      display: block;
+    }
+  }
+}
+</style>

package/src/components/AdvancedFilter/main/Form/form.vue

@@ -0,0 +1,59 @@
+<template>
+  <form class="n20-form">
+    <FormItem v-for="(item, i) in list" :key="i" :label="item.label" :item="item">
+      <slot v-if="item.slotName" :name="item.slotName"></slot>
+      <FormItemRender
+        v-else
+        :key="i"
+        :form="model"
+        :item="item"
+        @blur="$emit('blur')"
+        @clean="$emit('clean')"
+        @enter="$emit('enter')"
+        @filter="$emit('filter', model)"
+      ></FormItemRender>
+    </FormItem>
+  </form>
+</template>
+
+<script>
+import FormItem from './form-item.vue'
+import FormItemRender from '../../formItemRender.vue'
+export default {
+  name: 'Form',
+  components: {
+    FormItem,
+    FormItemRender
+  },
+  props: {
+    model: {
+      type: Object,
+      default: () => ({})
+    },
+    rules: {
+      type: Object,
+      default: () => ({})
+    },
+    list: {
+      type: Array,
+      default: () => []
+    }
+  },
+  provide() {
+    return {
+      Form: this
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.n20-form {
+  box-sizing: border-box;
+  position: relative;
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  padding: 8px 0;
+}
+</style>

package/src/components/AdvancedFilter/main/index.vue

@@ -0,0 +1,34 @@
+<template>
+  <div></div>
+</template>
+
+<script>
+export default {
+  props: {
+    isNotClose: {
+      type: Boolean,
+      default: false
+    },
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    filterList: {
+      type: Array,
+      default: () => []
+    },
+    onlyKey: {
+      type: String,
+      default: ''
+    },
+    model: {
+      type: Object,
+      default: () => ({})
+    },
+    filterId: {
+      type: String,
+      default: ''
+    }
+  }
+}
+</script>

package/src/components/AdvancedFilter/utils.js

@@ -1,7 +1,5 @@
-export const getOnlyKey = (key, data) => {
-  if (!key) return Date.now().toString(36) + Math.random().toString(36).substr(2, 5)
-  return data[key]
-}
+export const getOnlyKey = (key, data) =>
+  key ? data[key] : Date.now().toString(36) + Math.random().toString(36).slice(2, 7)
 let options = {}
 export const setOptionsMap = (key, value) => {
   options[key] = value

package/src/components/Anchor/AnchorItem.vue

@@ -1,5 +1,10 @@
 <template>
   <ExpandablePane :anchor-item-id="id" :default-expand.sync="show" :title="title">
+    <div slot="title">
+      <slot name="title"
+        ><span>{{ title }}</span></slot
+      >
+    </div>
     <slot></slot>
     <div slot="tips">
       <slot name="tips"> </slot>

package/src/components/Anchor/index.vue

@@ -1,10 +1,11 @@
 <template>
-  <div class="flex-box" style="height: 100%">
+  <div :class="{ 'flex-box': position !== 'top' }" style="height: 100%">
     <AnchorSidebar
       v-if="position !== 'right'"
       :nav-list="navList"
       :activit="value"
       :style="{ width: navWidth }"
+      :class="{ 'top-css': position === 'top' }"
       @click="activitFn"
     />
     <div ref="anchor-content" :class="['flex-item', parentClass]" style="height: 100%; overflow: auto">
@@ -214,3 +215,24 @@ export default {
   }
 }
 </script>
+<style>
+.top-css {
+  width: auto !important;
+  display: flex;
+  margin-bottom: 4px;
+}
+.top-css .n20-anchor2-nav {
+  padding: 5px;
+  border-left: none;
+}
+.top-css .n20-anchor2-nav-activit {
+  color: var(--color-primary);
+}
+.top-css .n20-anchor2-nav-activit:after {
+  content: '';
+  height: 2px;
+  background-color: #007aff;
+  display: block;
+  margin-top: 4px;
+}
+</style>

package/src/components/ApprovalButtons/index.vue

@@ -36,14 +36,33 @@
               :placeholder="'请选择加签类型' | $lc"
               style="width: 10em"
             >
-              <el-option
-                v-if="authList.includes('isAddForwardTask') || preAddTask"
-                :label="'向前加签' | $lc"
-                value="2"
-              />
-              <el-option v-if="authList.includes('isAddtask') || preAddTask" :label="'向后加签' | $lc" value="1" />
+              <el-option v-if="addTaskModel === '1'" :label="'向后加签' | $lc" value="1" />
+              <template v-else>
+                <el-option
+                  v-if="authList.includes('isAddForwardTask') || preAddTask"
+                  :label="'向前加签' | $lc"
+                  value="2"
+                />
+                <el-option
+                  v-if="addTaskModel === '1' || authList.includes('isAddtask') || preAddTask"
+                  :label="'向后加签' | $lc"
+                  value="1"
+                />
+              </template>
             </el-select>
             <el-select
+              v-if="addTaskModel === '1'"
+              v-model="addTaskType"
+              clearable
+              :placeholder="'请选择审批方式' | $lc"
+              style="width: 10em"
+            >
+              <el-option :label="'普通节点' | $lc" value="1" />
+              <el-option :label="'会签并行' | $lc" value="2" />
+              <el-option :label="'普通串行' | $lc" value="3" />
+            </el-select>
+            <el-select
+              v-else
               v-model="addTaskType"
               disabled
               clearable
@@ -83,7 +102,7 @@
             style="width: 18%"
           />
         </template>
-        <el-form-item class="flex-1" :label="'审批意见' | $lc" :error="errMsg" :required="required" style="width: 70%">
+        <el-form-item class="flex-1" :label="'审批意见' | $lc" :error="errMsg" :required="requiredC" style="width: 70%">
           <el-input
             ref="msg-input"
             v-model="messageC"
@@ -284,6 +303,7 @@ export default {
   data() {
     this.msgisSync = !!this.$listeners['update:message']
     return {
+      requiredC: false,
       prefixCls,
       messageIn: '',
       errMsg: undefined,
@@ -303,6 +323,7 @@ export default {
       approvalToV: false,
       showApprovalTo: false,
       opiAndUser: false,
+      addTaskModel: '0',
       otherAtt: {},
       fileDtos: [],
       fileName: '',
@@ -336,11 +357,19 @@ export default {
     this.taskId = this.$route.query.taskId || this.$route.params.taskId
     this.showBtn = this.$route.query.habtn !== 'true'
     this.getBtns()
+    this.getAddTaskMode()
     this.getShowApprovalTo()
     this.getHasQueryAppOpiAndUser()
     this.nextApproval && this.getTodoList()
+    this.getConfiguration()
   },
   methods: {
+    // 意见是否必填
+    getConfiguration() {
+      getJsonc('portal/server-config.jsonc', null, true).then(({ opinionRequired }) => {
+        this.requiredC = opinionRequired ?? this.required
+      })
+    },
     getTodoList() {
       return new Promise((resolve, reject) => {
         const dto = JSON.parse(sessionStorage.getItem(`approvalDto`))
@@ -353,6 +382,16 @@ export default {
         })
       })
     },
+    // 获取加签方式的模式
+    getAddTaskMode() {
+      axios
+        .get(`/bems/activiti/sample/getAddTaskMode`, null, { loading: false, noMsg: true })
+        .then(({ data, code }) => {
+          if (code === 200) {
+            this.addTaskModel = data
+          }
+        })
+    },
 
     // 换回到发起页
     goFrom() {
@@ -549,7 +588,7 @@ export default {
     },
     // 审批
     approvalFn() {
-      if (this.required && !this.messageC) {
+      if (this.requiredC && !this.messageC) {
         return this.errMsgFn(
           this.authList.includes('byAddTask') && this.addTaskList.length > 0 ? $lc('加签') : $lc('批准')
         )
@@ -568,7 +607,7 @@ export default {
       })
     },
     approvalNext() {
-      if (this.required && !this.messageC) {
+      if (this.requiredC && !this.messageC) {
         return this.errMsgFn(
           this.authList.includes('byAddTask') && this.addTaskList.length > 0 ? $lc('加签') : $lc('批准')
         )
@@ -605,7 +644,7 @@ export default {
       })
     },
     async goApproval(row) {
-      const { appUrl = {} } = await getJsonc('activiti/server-config.jsonc')
+      const { appUrl = {} } = await getJsonc('activiti/server-config.jsonc', null, true)
       if (appUrl[row.appNo]) {
         let path = toExaminePath(row, appUrl) || appUrl[row.appNo] + $lc('/') + row.typeCode
         linkPush(path, {

package/src/components/ApprovalButtons/showAppOpi.vue

@@ -47,9 +47,11 @@ export default {
   methods: {
     // 审批意见选择是否单选,1是 0 否
     getIsMultiple() {
-      axios.get(`/bems/activiti/actAppOpi/queryAppOpiAndUser`, null, { loading: false }).then(({ msg }) => {
-        this.multiple = msg === '0'
-      })
+      axios
+        .get(`/bems/activiti/actAppOpi/queryAppOpiAndUser`, null, { loading: false, noMsg: true })
+        .then(({ msg }) => {
+          this.multiple = msg === '0'
+        })
     },
     getData() {
       if (this.andUser) {

package/src/components/ApprovalCard/index.vue

@@ -40,7 +40,7 @@
                 {{ item.roleName }}
               </div>
               <div
-                v-if="!item.result == 0"
+                v-if="item.result !== 0"
                 v-title="item.assignee"
                 class="n20-worker text-ellipsis"
                 style="width: 180px"