n20-common-lib 1.2.18 → 1.2.21

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "n20-common-lib",
-  "version": "1.2.18",
+  "version": "1.2.21",
   "private": false,
   "main": "src/index.js",
   "scripts": {
@@ -30,8 +30,10 @@
     "axios": "^0.21.4",
     "dayjs": "^1.10.6",
     "js-cookie": "^3.0.1",
+    "jsonwebtoken": "^8.5.1",
     "normalize.css": "^8.0.1",
     "numerify": "^1.2.9",
+    "qrcode": "^1.5.0",
     "resize-detector": "^0.3.0",
     "vuedraggable": "^2.24.3"
   },
@@ -55,7 +57,6 @@
     "mockjs": "^1.1.0",
     "node-sass": "6.0.0",
     "qiankun": "^2.5.1",
-    "qrcode": "^1.5.0",
     "sass-loader": "^10.2.0",
     "strip-json-comments": "^3.1.1",
     "vue": "^2.6.11",

package/src/assets/css/cl-form-item.scss

@@ -492,7 +492,7 @@ $--input-max: 304px;
     font-size: 16px;
   }
   &.has-value {
-    &:hover {
+    &:not(.is-disabled):hover {
       .el-input__prefix {
         display: none;
       }

package/src/assets/css/cl-pagination.scss

@@ -1,3 +1,66 @@
+.n20-pagination-1 {
+  display: inline-block;
+  padding-right: 5px;
+  > * {
+    vertical-align: middle;
+  }
+  .el-pagination {
+    display: inline-block;
+  }
+  .btn-prev,
+  .btn-next {
+    padding-left: 6px;
+    padding-right: 6px;
+    border: 1px solid $--border-color-base;
+    &:not([disabled]):hover {
+      border-color: $--color-primary;
+    }
+  }
+  .btn-next {
+    margin-left: 6px;
+  }
+}
+.n20-pagination-jumper-1 {
+  width: 36px;
+  margin-left: 6px;
+  margin-right: 6px;
+  &.is-without-controls {
+    .el-input__inner {
+      height: 26px;
+      line-height: 26px;
+      padding-left: 4px;
+      padding-right: 4px;
+    }
+  }
+}
+.n20-pagination-sizes-1 {
+  .el-radio-button__inner {
+    border-radius: $--border-radius-base !important;
+    border: 1px solid $--border-color-base;
+    box-shadow: none;
+  }
+  .el-radio-button__orig-radio:checked + .el-radio-button__inner {
+    border-color: $--color-primary;
+  }
+}
+.n20-pagination-usersizes-1 {
+  width: 52px;
+  vertical-align: middle;
+  &.is-without-controls {
+    .el-input__inner {
+      height: 26px;
+      line-height: 26px;
+      padding-left: 4px;
+      padding-right: 4px;
+    }
+  }
+  &.is-active {
+    .el-input__inner {
+      border-color: $--border-color-base;
+    }
+  }
+}
+
 .n20-pagination {
   display: inline-block;
   > * {

package/src/assets/css/cl-secondary-tab.scss

@@ -45,4 +45,9 @@
   .el-tabs__active-bar {
     display: none;
   }
+
+  .el-tabs__nav-prev,
+  .el-tabs__nav-next {
+    line-height: 28px;
+  }
 }

package/src/assets/css/cl-tertiary-tab.scss

@@ -1,6 +1,51 @@
+.n20-tertiary-tab-1 {
+  display: inline-block;
+  max-width: 100%;
+  & > .el-tabs__header {
+    border: none;
+    margin-bottom: 0;
+    .el-tabs__nav {
+      border: none;
+    }
+    .el-tabs__item {
+      height: auto;
+      line-height: 1;
+      padding: 6px 16px !important;
+      border: 1px solid $--border-color-light !important;
+      margin-left: -1px;
+
+      &:first-child {
+        margin-left: 0;
+        border-radius: 4px 0 0 4px;
+      }
+      &:last-child {
+        border-radius: 0 4px 4px 0;
+      }
+      &.is-active {
+        border: 1px solid $--color-primary !important;
+        z-index: 1;
+      }
+      &.is-disabled {
+        color: $--color-text-placeholder;
+        background-color: $--button-disabled-background-color;
+        border-color: $--button-default-border-color !important;
+        cursor: not-allowed;
+      }
+    }
+  }
+
+  .el-tabs__nav-prev,
+  .el-tabs__nav-next {
+    line-height: 28px;
+  }
+}
+
 .n20-tertiary-tab {
+  max-width: 100%;
+  white-space: nowrap;
+  overflow-x: auto;
   .el-radio-button--mini .el-radio-button__inner {
-      padding: 6px 16px;
+    padding: 6px 16px;
   }
   .el-radio-button__orig-radio:checked + .el-radio-button__inner {
     color: $--color-primary;

package/src/components/DragList/index.vue

@@ -12,11 +12,13 @@
       <slot :item="item" :index="index">
         <span>{{ item[labelKey] || item }}</span>
       </slot>
-      <i
+      <el-link
         v-if="!disabled"
-        class="n20-drag-remove n20-icon-shanchu"
+        class="n20-icon-shanchu"
+        :underline="false"
+        :disabled="inSC && item.checked"
         @click="remove(index)"
-      ></i>
+      />
     </div>
   </vue-draggable>
 </template>
@@ -45,6 +47,11 @@ export default {
       default: 'label'
     }
   },
+  computed: {
+    inSC() {
+      return !!this.$attrs['in-show-column']
+    }
+  },
   methods: {
     change() {
       this.$emit('change', this.list)

package/src/components/LoginTemporary/form.vue

@@ -177,6 +177,7 @@
 </template>
 
 <script>
+import decode from 'jsonwebtoken/decode'
 import axios from '../../utils/axios'
 import auth from '../../utils/auth'
 import qrCode from './qrcode.vue'
@@ -223,6 +224,7 @@ export default {
         accountPthon: '账户密码验证码登录'
       },
       theType: this.loginTypes[0],
+      userNo: undefined,
       form: {
         username: '',
         password: '',
@@ -243,7 +245,8 @@ export default {
         ]
       },
       fPwV: false,
-      codeNum: '验证码'
+      codeNum: '验证码',
+      getAzCount: 0
     }
   },
   methods: {
@@ -321,22 +324,41 @@ export default {
       })
     },
     // 获取加密参数
-    async authorizationCode(username, password, code) {
+    authorizationCode(username, password, code) {
+      this.getAzCount = this.getAzCount + 1
+
       let pwdArr = code ? [username, password, code] : [username, password]
       let pwd = pwdArr.join('@@')
 
-      let { data = {} } = await axios.get(
-        '/bems/prod_1.0/uas/api/authorization/authorizationCode',
-        {},
-        { loading: false }
-      )
-      try {
-        pwd = encode(pwd, data.authorizationValue)
-      } catch (error) {
-        this.loadingV = false
-        // this.$message.warning('密码加密错误')
-      }
-      this.pwd = pwd + '@@' + data.authorizationKey
+      return new Promise((resolve, reject) => {
+        if (this.getAzCount <= 3) {
+          axios
+            .get(
+              '/bems/prod_1.0/uas/api/authorization/authorizationCode',
+              {},
+              { loading: false }
+            )
+            .then(({ data = {} }) => {
+              try {
+                pwd = encode(pwd, data.authorizationValue)
+                this.pwd = pwd + '@@' + data.authorizationKey
+
+                this.getAzCount = 0
+                resolve()
+              } catch (error) {
+                console.error('密码加密错误:' + JSON.stringify(data))
+                this.authorizationCode(username, password, code) // 再次请求
+                  .then(resolve)
+                  .catch(reject)
+              }
+            })
+        } else {
+          // 当重新请求大于3次,抛出错误
+          this.$message.warning(`登录失败，请重新登录！`)
+          this.getAzCount = 0
+          reject()
+        }
+      })
     },
     // 账号/密码登录
     async passwordLogin() {
@@ -467,6 +489,14 @@ export default {
     // 登录成功后
     loginAfter(data) {
       auth.setToken(data.accessToken)
+      try {
+        let tokenObj = decode(data.accessToken)
+        let userInfo = JSON.parse(tokenObj.user_name)
+        this.userNo = userInfo.userNo
+      } catch (error) {
+        console.error('accessToken解析错误:' + data.accessToken)
+      }
+
       Promise.all([
         this.getUserInfo(),
         this.getMicroAppsInfo(),
@@ -483,7 +513,7 @@ export default {
     },
     // 获取用户基本信息
     async getUserInfo() {
-      let username = this.form.username
+      let username = this.userNo
       let { data } = await axios.get(
         // '/bems/prod_1.0/user/api/userController/userCltAdDep/' + username
         '/bems/prod_1.0/user/api/userController/userCltAdRole/' + username
@@ -517,7 +547,7 @@ export default {
         axios
           .post(
             '/bems/prod_1.0/user/api/userController/qryBusyInfoNo',
-            { uno: this.form.username },
+            { uno: this.userNo },
             { loading: false, noMsg: true }
           )
           .then(({ data: cltrelaMap = [] }) => {

package/src/components/Pagination/index.vue

@@ -1,38 +1,79 @@
 <template>
-  <div class="n20-pagination">
+  <div class="n20-pagination-1">
     <el-pagination
-      layout="prev,next,slot,jumper"
+      layout="prev,next,slot"
       :current-page.sync="pageObj[pageKey.no]"
       :page-size="pageObj[pageKey.size]"
       :total="pageObj[pageKey.total]"
       :size="size"
       @current-change="setnoOrsize"
+    />
+    <span class="m-r-ss"
+      ><span class="color-primary">{{ pageObj[pageKey.no] }}</span
+      >/{{ max }}</span
     >
-      <span class="n20-pagination-total"
-        ><span class="n20-pagination-no">{{ pageObj[pageKey.no] }}</span
-        >/{{ max }}</span
-      >
-      <span class="el-pagination__sizes">
-        <el-select
+    <span>到第</span>
+    <el-input-number
+      v-model="toNo"
+      class="n20-pagination-jumper-1 m-r-ss"
+      :min="1"
+      :max="max"
+      :step="1"
+      :step-strictly="true"
+      :controls="false"
+      :size="size"
+      @change="setnoOrsize"
+    />
+    <span class="m-r-s">页</span>
+    <el-popover v-model="settingV" placement="top" trigger="click">
+      <el-link
+        slot="reference"
+        icon="n20-icon-shezhi"
+        :underline="false"
+        style="font-size: 18px"
+      />
+      <div>
+        <span>每页显示</span>
+        <el-radio-group
           v-model="pageObj[pageKey.size]"
+          class="n20-pagination-sizes-1 m-l-s"
           size="mini"
-          popper-class="el-pagination__sizes-popper"
-          @change="setnoOrsize"
+          @change="
+            () => {
+              setnoOrsize()
+              settingV = false
+            }
+          "
         >
-          <el-option
+          <el-radio-button
             v-for="item in pageSizes"
             :key="item"
-            :value="item"
-            :label="item + '条/页'"
-          />
-          <el-option
-            :value="pageObj[pageKey.size]"
-            :label="pageObj[pageKey.size] + '条/页'"
-            style="display: none"
+            class="m-r-s"
+            :label="item"
           />
-        </el-select>
-      </span>
-    </el-pagination>
+        </el-radio-group>
+        <el-input-number
+          v-model="userSize"
+          class="n20-pagination-usersizes-1"
+          :class="{
+            'is-active': !pageSizes.includes(pageObj[pageKey.size])
+          }"
+          :min="1"
+          :max="sizeMax"
+          :step="1"
+          :step-strictly="true"
+          :controls="false"
+          size="mini"
+          placeholder="自定义"
+          @change="
+            () => {
+              setnoOrsize()
+              settingV = false
+            }
+          "
+        />
+      </div>
+    </el-popover>
   </div>
 </template>
 
@@ -62,11 +103,16 @@ export default {
     },
     pageSizes: {
       type: Array,
-      default: () => [20, 50, 100, 300, 500]
+      default: () => [20, 50, 100]
+    },
+    sizeMax: {
+      type: Number,
+      default: 1000
     }
   },
   data() {
     return {
+      settingV: false,
       noOrsize: ''
     }
   },
@@ -76,6 +122,31 @@ export default {
       let size = this.pageObj[this.pageKey.size]
 
       return Math.ceil(total / size)
+    },
+    toNo: {
+      get() {
+        return this.pageObj[this.pageKey.no]
+      },
+      set(val) {
+        if (val) {
+          this.pageObj[this.pageKey.no] = val
+        } else {
+          this.pageObj[this.pageKey.no] = 1
+        }
+      }
+    },
+    userSize: {
+      get() {
+        return this.pageObj[this.pageKey.size]
+      },
+      set(val) {
+        if (val) {
+          this.pageObj[this.pageKey.size] = val
+        } else {
+          this.pageObj[this.pageKey.size] = this.pageSizes[0]
+        }
+        this.pageObj[this.pageKey.no] = 1
+      }
     }
   },
   watch: {
@@ -85,11 +156,9 @@ export default {
   },
   methods: {
     setnoOrsize() {
-      this.$nextTick(() => {
-        let no = this.pageObj[this.pageKey.no]
-        let size = this.pageObj[this.pageKey.size]
-        this.noOrsize = no + ',' + size
-      })
+      let no = this.pageObj[this.pageKey.no]
+      let size = this.pageObj[this.pageKey.size]
+      this.noOrsize = no + ',' + size
     }
   }
 }

package/src/components/ShowColumn/index.vue

@@ -46,7 +46,11 @@
             >
           </div>
           <div class="flex-1 overflow-y">
-            <drag-list :list="dragList" :label-key="labelKey" />
+            <drag-list
+              :list="dragList"
+              :label-key="labelKey"
+              :in-show-column="true"
+            />
           </div>
         </div>
       </div>

package/src/components/Table/index.vue

@@ -20,7 +20,7 @@
       <el-table-column
         v-else
         :key="'cl-table-' + i"
-        :formatter="item.formatter | colfF"
+        :formatter="item.formatter | colfF(item.formatterMap)"
         :filters="item.filters | colftF(filtersMap)"
         v-bind="item"
       />
@@ -70,6 +70,7 @@
 
 <script>
 import numerify from 'numerify'
+import dayjs from 'dayjs'
 import Pagination from '../Pagination/index.vue'
 
 const columnRender = {
@@ -86,6 +87,63 @@ const columnRender = {
   }
 }
 
+function colfF(colf, map) {
+  if (typeof colf !== 'string') return colf
+  let sc = colf.split(/{.+?}/g) || []
+  let mc = colf.match(/{.+?}/g) || []
+  let mck = []
+  mc.forEach((t) => {
+    t = t.replace(/^{|\s+|}$/g, '').split('|')
+    mck.push(t)
+  })
+
+  return (row) => tplFn(row, sc, mck, map)
+}
+function tplFn(row, sc, mck, map = {}) {
+  let str = ''
+  sc.forEach((s, i) => {
+    str += s
+    let kA = mck[i]
+    if (kA && kA.length) {
+      let key = kA[0]
+      if (kA.length === 1) {
+        str += row[key]
+      } else {
+        let type = kA[1]
+        switch (type) {
+          case 'money':
+            str += numerify(row[key], '0,0.00')
+            break
+          case 'rate':
+            str += numerify(row[key], '0.000000')
+            break
+          case 'map':
+            str += map[row[key]]
+            break
+          case 'date':
+            str += dayjs(row[key]).format('YYYY-MM-DD')
+            break
+          case 'datetime':
+            str += dayjs(row[key]).format('YYYY-MM-DD HH:mm:ss')
+            break
+          case 'time':
+            str += dayjs(row[key]).format('HH:mm:ss')
+            break
+          default:
+            str += row[key]
+            break
+        }
+      }
+    }
+  })
+  return str
+}
+
+function colftF(colft, fMap) {
+  if (typeof colft !== 'string') return colft
+  return fMap[colft]
+}
+
 export default {
   name: 'Table',
   components: {
@@ -93,36 +151,8 @@ export default {
     columnRender
   },
   filters: {
-    colfF(colf) {
-      if (typeof colf !== 'string') return colf
-
-      if (/\|money/.test(colf)) {
-        let mc = colf.match(/{(\S+)\|money}/)
-        let key = mc && mc[1]
-
-        return (row) => numerify(row[key], '0,0.00')
-      } else if (/\|rate/.test(colf)) {
-        let mc = colf.match(/{(\S+)\|rate}/)
-        let key = mc && mc[1]
-
-        return (row) => numerify(row[key], '0.000000')
-      } else {
-        let mc = colf.match(/{[^}]+}/g) || []
-        let mcv = mc.map((m) => m.replace(/{|}/g, ''))
-
-        return (row) => {
-          let str = colf
-          mc.forEach((tp, i) => {
-            str = str.replace(tp, row[mcv[i]])
-          })
-          return str
-        }
-      }
-    },
-    colftF(colft, fMap) {
-      if (typeof colft !== 'string') return colft
-      return fMap[colft]
-    }
+    colfF,
+    colftF
   },
   props: {
     column: {

package/src/components/TertiaryTab/index.vue

@@ -1,17 +1,26 @@
 
 <template>
-  <el-radio-group :value="init" class="n20-tertiary-tab" :size="size">
-    <el-radio-button
+  <el-tabs
+    :value="init"
+    class="n20-tertiary-tab-1"
+    type="card"
+    :before-leave="beforeFn"
+    @tab-click="clickFn"
+  >
+    <el-tab-pane
       v-for="item of data"
       :key="item.name"
-      :label="item.name"
+      :tab-info="item"
+      :name="item.name"
+      :icon="item.icon"
       :disabled="item.disabled"
-      @click.native.prevent="(ev) => clickFn(item, ev)"
     >
-      <span v-if="item.icon" :class="item.icon"></span>
-      {{ item.name }}
-    </el-radio-button>
-  </el-radio-group>
+      <template slot="label">
+        <span v-if="item.icon" :class="item.icon"></span>
+        {{ item.name }}
+      </template>
+    </el-tab-pane>
+  </el-tabs>
 </template>
 
 <script>
@@ -31,22 +40,23 @@ export default {
       default: 'mini'
     }
   },
-  data() {
-    if (!this.$listeners['update:init'] && !this.$listeners['click']) {
-      console.warn('请设置 @click 或 init.sync')
+  computed: {
+    stop() {
+      return !this.$listeners['update:init']
     }
-    return {}
   },
   methods: {
-    clickFn(item, ev) {
-      ev.currentTarget && ev.currentTarget.blur()
-
+    clickFn(C) {
+      let item = C.$attrs['tab-info']
       if (this.$listeners['update:init']) {
         !item.disabled && this.$emit('update:init', item.name)
       }
       if (this.$listeners['click']) {
         this.$emit('click', item)
       }
+    },
+    beforeFn(name) {
+      return name === this.init ? true : !this.stop
     }
   }
 }

package/src/components/WornPagination/index.vue

@@ -60,7 +60,7 @@ export default {
       if (v.no !== this.page) {
         this.$emit('update:page', v.no)
       }
-      if (v.size !== this.size) {
+      if (v.size !== this.pageSize) {
         this.$emit('update:pageSize', v.size)
         // 为修复bug而写的bug
         this.$nextTick(() => {