n20-common-lib 1.3.28 → 1.3.31

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "n20-common-lib",
-  "version": "1.3.28",
+  "version": "1.3.31",
   "private": false,
   "main": "src/index.js",
   "scripts": {

package/src/assets/css/el-button.scss

@@ -1,10 +1,7 @@
 .el-button--primary,
 .el-button--default,
 .el-button--default.is-plain,
-.el-button--warning.is-plain,
-.el-button--mini,
-.el-button--mini.is-plain,
-.el-button--danger.is-plain {
+.el-button--warning.is-plain {
   min-width: 72px;
 }
 

package/src/assets/css/el-table.scss

@@ -86,12 +86,3 @@
 .el-table .descending .sort-caret.descending {
   color: $--color-primary;
 }
-
-.el-table {
-  .cell {
-    .el-dropdown-link.n20-icon-moren {
-      color: $--color-primary;
-    }
-  }
-
-}

package/src/components/ChildRange/index.vue

@@ -1,36 +1,32 @@
 <template>
-  <div class="n20-subticket-interval">
-    <div class="input-child-range" :class="{ 'is-disabled': disabled }">
-      <div class="flex">
-        <div class="from">
-          <el-input
-            ref="input_left"
-            v-model="value1"
-            :disabled="disabled"
-            placeholder="子票区间起"
-            @blur="handleBlurleft"
-            @focus="handleFocusLeft"
-            @input="handleInputleft"
-            @change="handleInputChangeLeft"
-          />
-        </div>
-        <div class="center">
-          <span> - </span>
-        </div>
-        <div class="to">
-          <el-input
-            ref="input_right"
-            v-model="value2"
-            :disabled="disabled"
-            placeholder="子票区间止"
-            @blur="handleBlurRight"
-            @focus="handleFocusRight"
-            @input="handleInputRight"
-            @change="handleInputChangeRight"
-          />
-        </div>
-      </div>
-    </div>
+  <div
+    class="n20-subticket-interval flex-box"
+    :class="{ 'is-disabled': disabled, 'is-focus': focus }"
+    :disabled="disabled"
+  >
+    <el-input
+      ref="input_left"
+      v-model="value1"
+      class="from flex-item"
+      :disabled="disabled"
+      placeholder="子票区间起"
+      @blur="handleBlurleft"
+      @focus="handleFocusLeft"
+      @input="handleInputleft"
+      @change="handleInputChangeLeft"
+    />
+    <div class="center">-</div>
+    <el-input
+      ref="input_right"
+      v-model="value2"
+      class="to flex-item"
+      :disabled="disabled"
+      placeholder="子票区间止"
+      @blur="handleBlurRight"
+      @focus="handleFocusRight"
+      @input="handleInputRight"
+      @change="handleInputChangeRight"
+    />
   </div>
 </template>
 
@@ -39,14 +35,16 @@ export default {
   name: 'ChildRange',
   props: {
     // 初始化范围
-    value: { required: true },
-
+    value: {
+      required: true,
+      type: Array,
+      default: () => []
+    },
     // 是否禁用
     disabled: {
       type: Boolean,
       default: false
     },
-
     // 精度参数
     precision: {
       type: Number,
@@ -59,7 +57,8 @@ export default {
   data() {
     return {
       value1: null,
-      value2: null
+      value2: null,
+      focus: false
     }
   },
   watch: {
@@ -84,18 +83,22 @@ export default {
     },
 
     handleBlurleft(event) {
+      this.focus = false
       this.$emit('blurleft', event)
     },
 
     handleFocusLeft(event) {
+      this.focus = true
       this.$emit('focusleft', event)
     },
 
     handleBlurRight(event) {
+      this.focus = false
       this.$emit('blurright', event)
     },
 
     handleFocusRight(event) {
+      this.focus = true
       this.$emit('focusright', event)
     },
 
@@ -163,4 +166,4 @@ export default {
     }
   }
 }
-</script>
+</script>

package/src/components/ChildRange/style.scss

@@ -1,34 +1,34 @@
 .n20-subticket-interval {
-  .input-child-range {
-    background-color: #fff;
-    border: 1px solid #dcdfe6;
-    border-radius: 4px;
-    // 取消element原有的input框样式
-    ::v-deep .el-input--small .el-input__inner {
-      border: 0px;
-      margin: 0;
-      padding: 0 5px;
-      background-color: transparent;
-    }
-    ::v-deep .el-input__inner:focus {
-      box-shadow: none;
-    }
+  background-color: $--color-white;
+  border: 1px solid $--border-color-base;
+  border-radius: $--border-radius-base;
+  // 取消element原有的input框样式
+  .el-input {
+    margin: -1px;
   }
-  .flex {
-    display: flex;
-    flex-direction: row;
-    width: 100%;
-    justify-content: center;
-    align-items: center;
-    .center {
-      color: #cccccc;
-      margin: 0 1px;
-    }
+  .el-input__inner,
+  .el-input__inner:hover {
+    border-color: transparent !important;
+    background-color: transparent !important;
+    box-shadow: none;
   }
-  .is-disabled {
-    background-color: #eef0f6;
-    border-color: #e4e7ed;
-    color: #c0c4cc;
+  &:not([disabled]):hover {
+    border-color: $--color-primary;
+  }
+
+  &:focus,
+  &.is-focus {
+    border-color: $--color-primary;
+    box-shadow: 0 0 2px $--color-primary;
+  }
+  .center {
+    margin: -1px 2px;
+    color: $--color-text-placeholder;
+  }
+  &.is-disabled {
+    background-color: $--background-color-base;
+    border-color: $--border-color-light;
+    color: $--color-info-light;
     cursor: not-allowed;
   }
 }

package/src/components/FileExportAsync/index.vue

@@ -55,8 +55,10 @@ export default {
       pgsVal: 0,
       status: undefined, //init progress success error
       timer: undefined,
-      elapsedTimeout: 0,
-      waitPopV: false
+
+      waitPopV: false,
+      waitTimer: undefined,
+      waitClass: ''
     }
   },
   computed: {
@@ -70,13 +72,17 @@ export default {
   },
   methods: {
     export() {
+      clearTimeout(this.timer)
+      clearTimeout(this.waitTimer)
+
       this.pgsVal = 0
       this.status = 'init'
-      clearTimeout(this.timer)
-      this.elapsedTimeout = 0
+      this.pgsV = true
+
+      this.waitClass = 'ex-waitime-' + Date.now()
       this.waitPopV = false
+      this.waitPop()
 
-      this.pgsV = true
       this.exportReq()
     },
     // 导出请求
@@ -92,6 +98,7 @@ export default {
       this.$emit('export-pgs', (pgs, error) => {
         if (error) {
           this.status = 'error'
+          this.closeWaitPop()
           console.error('导出失败')
           return
         }
@@ -101,24 +108,22 @@ export default {
           this.status = 'progress'
 
           clearTimeout(this.timer)
-          this.timer = setTimeout(() => {
-            this.elapsedTimeout = this.elapsedTimeout + this.stepTime
-            this.exportPgs()
-          }, this.stepTime)
+          this.timer = setTimeout(this.exportPgs, this.stepTime)
         } else {
           this.pgsVal = parseInt(pgs)
           this.status = 'success'
 
           this.exportRes()
         }
-        this.waitPop()
       })
     },
     // 导出响应
     exportRes() {
       this.$emit('export-res', (data, error) => {
+        clearTimeout(this.waitTimer)
         if (error) {
           this.status = 'error'
+          this.closeWaitPop()
           console.error('导出失败')
           return
         }
@@ -126,12 +131,11 @@ export default {
         this.status = 'success'
         this.pgsVal = 100
 
+        this.closeWaitPop()
         downloadBlob(data, this.fileName)
-        this.pgsV = false
-        let confirmBtn = document.querySelector(
-          '.ex-waitime-msg .el-button--primary'
-        )
-        confirmBtn && confirmBtn.click()
+        setTimeout(() => {
+          this.pgsV = false
+        }, 500)
       })
     },
     // 导出取消
@@ -156,22 +160,31 @@ export default {
     },
     // 时间太长提示
     waitPop() {
-      if (!this.waitPopV && this.elapsedTimeout > this.waitTime) {
-        this.waitPopV = true
-
-        this.$msgboxPor({
-          title: '提示',
-          message: '您的数据导出时间可能会比较长，是否继续导出？',
-          type: 'warning',
-          customClass: 'question ex-waitime-msg',
-          confirmButtonText: '继续导出',
-          cancelButtonText: '取消'
-        }).catch(() => {
-          clearTimeout(this.timer)
-          this.pgsV = false
-          this.$emit('export-cancel')
-        })
-      }
+      clearTimeout(this.waitTimer)
+      this.waitTimer = setTimeout(() => {
+        if (!this.waitPopV) {
+          this.waitPopV = true
+          this.$msgboxPor({
+            title: '提示',
+            message: '您的数据导出时间可能会比较长，是否继续导出？',
+            type: 'warning',
+            customClass: `question ${this.waitClass}`,
+            confirmButtonText: '继续导出',
+            cancelButtonText: '取消'
+          }).catch(() => {
+            clearTimeout(this.timer)
+            this.pgsV = false
+            this.$emit('export-cancel')
+          })
+        }
+      }, this.waitTime)
+    },
+    closeWaitPop() {
+      clearTimeout(this.waitTimer)
+      let confirmBtn = document.querySelector(
+        `.${this.waitClass} .el-button--primary`
+      )
+      confirmBtn && confirmBtn.click()
     }
   }
 }

package/src/components/FileUploadTable/index.vue

@@ -167,7 +167,11 @@
                 :disabled="!row[keys.type]"
                 :accept="row[keys.type] | acceptFilter(typeOptions, fileAccept)"
                 :size="row[keys.type] | sizeFilter(typeOptions, fileSize)"
-                :http-request="uploadHttpRequest"
+                :http-request="
+                  uploadHttpRequest
+                    ? (options) => uploadHttpRequest(options, row)
+                    : undefined
+                "
                 :before-upload="(file) => beforeUploadFn(file, row)"
                 :on-progress="(event) => onProgressFn(event, row)"
                 :on-success="

package/src/components/Filters/form-item-input.vue

@@ -0,0 +1,133 @@
+<template>
+  <el-input
+    v-if="item.type === 'text' || item.type === undefined"
+    v-model="form[item.value]"
+    :clearable="item | clearableF"
+    style="width: 100%"
+    v-bind="item.props"
+    v-on="item.on"
+  />
+  <el-select
+    v-else-if="item.type === 'select'"
+    v-model="form[item.value]"
+    :clearable="item | clearableF"
+    :multiple="item.multiple"
+    style="width: 100%"
+    v-bind="item.props"
+    v-on="item.on"
+  >
+    <template v-if="item.props && item.props.labelKey && item.props.valueKey">
+      <el-option
+        v-for="(c, i) in item.options"
+        :key="i"
+        :label="c[item.props.labelKey]"
+        :value="c[item.props.valueKey]"
+        :disabled="c.disabled"
+      />
+    </template>
+    <template v-else>
+      <el-option
+        v-for="c in item.options"
+        :key="c.value + '_' + c.label"
+        :label="c.label"
+        :value="c.value"
+        :disabled="c.disabled"
+      />
+    </template>
+  </el-select>
+  <inputNumber
+    v-else-if="item.type === 'number'"
+    v-model="form[item.value]"
+    style="width: 100%"
+    v-bind="item.props"
+    v-on="item.on"
+  />
+  <inputNumberRange
+    v-else-if="item.type === 'numberrange'"
+    :start-value.sync="form[item.startValue]"
+    :end-value.sync="form[item.endValue]"
+    style="width: 100%"
+    v-bind="item.props"
+    v-on="item.on"
+  />
+  <datePickerPor
+    v-else-if="item.type === 'date'"
+    v-model="form[item.value]"
+    type="date"
+    :clearable="item | clearableF"
+    style="width: 100%"
+    v-bind="item.props"
+    v-on="item.on"
+  />
+  <datePickerPor
+    v-else-if="item.type === 'daterange'"
+    type="daterange"
+    :start-date.sync="form[item.startDate]"
+    :end-date.sync="form[item.endDate]"
+    :clearable="item | clearableF"
+    style="width: 100%"
+    v-bind="item.props"
+    v-on="item.on"
+  />
+  <el-checkbox-group
+    v-else-if="item.type === 'checkbox'"
+    v-model="form[item.value]"
+    v-bind="item.props"
+    v-on="item.on"
+  >
+    <el-checkbox
+      v-for="c in item.options"
+      :key="c.value"
+      :label="c.value"
+      :disabled="c.disabled"
+      >{{ c.label }}</el-checkbox
+    >
+  </el-checkbox-group>
+  <el-radio-group
+    v-else-if="item.type === 'radio'"
+    v-model="form[item.value]"
+    v-bind="item.props"
+    v-on="item.on"
+  >
+    <el-radio
+      v-for="c in item.options"
+      :key="c.value"
+      :label="c.value"
+      :disabled="c.disabled"
+      >{{ c.label }}</el-radio
+    >
+  </el-radio-group>
+</template>
+
+<script>
+import inputNumber from '../InputNumber/index.vue'
+import inputNumberRange from '../InputNumber/numberRange.vue'
+import datePickerPor from '../DatePicker/por.vue'
+export default {
+  components: {
+    inputNumber,
+    inputNumberRange,
+    datePickerPor
+  },
+  filters: {
+    clearableF(item) {
+      if (item.props && item.props.clearable === false) {
+        return false
+      } else {
+        return true
+      }
+    }
+  },
+  props: {
+    form: {
+      type: Object,
+      default: undefined
+    },
+    item: {
+      type: Object,
+      default: undefined
+    }
+  }
+}
+</script>
+