n20-common-lib 2.6.0 → 2.6.1

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

@@ -1,227 +0,0 @@
-<template>
-  <el-input
-    v-if="item.type === 'text' || item.type === undefined"
-    v-model="form[item.value]"
-    v-rule-key
-    :ruleErrorHide="item.ruleErrorHide"
-    :rules="item.rules"
-    rule-form="ruleValidate"
-    :clearable="(item.props && item.props.clearable) ?? true"
-    @clear="handleClear"
-    :style="{
-      width: item.width || '224px'
-    }"
-    :value-data="context.measureText(form[item.value]).width * 1.4 + 45 + 'px'"
-    v-bind="item.props"
-    :placeholder="item.props && item.props.placeholder ? item.props.placeholder : $lc('请输入')"
-    @blur="handleBlur"
-  />
-  <el-input
-    v-rule-key
-    :rules="item.rules"
-    rule-form="ruleValidate"
-    v-else-if="item.type === 'search'"
-    v-model="form[item.value]"
-    :clearable="(item.props && item.props.clearable) ?? true"
-    @clear="handleClear"
-    :style="{
-      width: item.width || '224px'
-    }"
-    readonly
-    v-bind="item.props"
-    @blur="handleBlur"
-  >
-    <i
-      slot="suffix"
-      class="el-input__icon el-icon-zoom-in"
-      @click="
-        () => {
-          item.on && item.on.focus && item.on.focus()
-        }
-      "
-    ></i>
-  </el-input>
-  <el-select
-    v-rule-key
-    :rules="item.rules"
-    rule-form="ruleValidate"
-    v-else-if="item.type === 'select'"
-    v-model="form[item.value]"
-    :clearable="(item.props && item.props.clearable) ?? true"
-    @clear="handleClear"
-    :multiple="item.multiple"
-    collapse-tags
-    :style="{
-      width: item.width || '224px'
-    }"
-    v-bind="item.props"
-    @change="handleChange"
-  >
-    <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-rule-key
-    :rules="item.rules"
-    rule-form="ruleValidate"
-    v-else-if="item.type === 'number'"
-    v-model="form[item.value]"
-    :style="{
-      width: item.width || '224px'
-    }"
-    v-bind="item.props"
-    @blur="handleChange"
-  />
-  <inputNumberRange
-    v-rule-key
-    :rules="item.rules"
-    rule-form="ruleValidate"
-    v-else-if="item.type === 'numberrange'"
-    :start-value.sync="form[item.startValue]"
-    :end-value.sync="form[item.endValue]"
-    :style="{
-      width: item.width || '224px'
-    }"
-    v-bind="item.props"
-    @blur="handleChange"
-  />
-  <datePickerPor
-    v-rule-key
-    :rules="item.rules"
-    rule-form="ruleValidate"
-    v-else-if="['date', 'datetime', 'year', 'month', 'week'].includes(item.type)"
-    v-model="form[item.value]"
-    :type="item.type"
-    :clearable="(item.props && item.props.clearable) ?? true"
-    :style="{ width: item.width || '224px' }"
-    v-bind="item.props"
-    @clear="handleClear"
-    @change="handleChange"
-  />
-  <datePickerPor
-    v-rule-key
-    :rules="item.rules"
-    rule-form="ruleValidate"
-    v-else-if="['daterange', 'datetimerange', ' monthrange'].includes(item.type)"
-    :type="item.type"
-    :start-date.sync="form[item.startDate]"
-    :end-date.sync="form[item.endDate]"
-    :clearable="(item.props && item.props.clearable) ?? true"
-    :style="{ width: item.width }"
-    v-bind="item.props"
-    @clear="handleClear"
-    @change="handleChange"
-  />
-  <el-checkbox-group
-    v-rule-key
-    :rules="item.rules"
-    rule-form="ruleValidate"
-    v-else-if="item.type === 'checkbox'"
-    v-model="form[item.value]"
-    v-bind="item.props"
-    @change="handleChange"
-  >
-    <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-rule-key
-    rule-form="ruleValidate"
-    :rules="item.rules"
-    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 axios from '../../utils/axios'
-import inputNumber from '../InputNumber/index.vue'
-import inputNumberRange from '../InputNumber/numberRange.vue'
-import datePickerPor from '../DatePicker/por.vue'
-import { $lc } from '../../utils/i18n/index.js'
-
-const canvas = document.createElement('canvas')
-const context = canvas.getContext('2d')
-export default {
-  components: {
-    inputNumber,
-    inputNumberRange,
-    datePickerPor
-  },
-
-  props: {
-    form: {
-      type: Object,
-      default: undefined
-    },
-    item: {
-      type: Object,
-      default: undefined
-    }
-  },
-  data() {
-    return {
-      context
-    }
-  },
-
-  created() {
-    if (this.item.reqOptions) {
-      this.getOptions()
-    }
-  },
-  methods: {
-    handleBlur(fn, value) {
-      this.$emit('blur')
-    },
-    handleChange() {
-      this.$emit('blur')
-    },
-    handleClear() {
-      this.$emit('triggerClear')
-    },
-    getOptions() {
-      let reqOptions = this.item.reqOptions
-      let url = reqOptions.url || ''
-      url = url.includes('?') ? `${url}r=${Math.random()}` : `${url}?r=${Math.random()}`
-      axios({
-        ...reqOptions,
-        url: url,
-        loading: false,
-        noMsg: true,
-        resList: undefined
-      }).then((res) => {
-        let resKeys = reqOptions.resList ? reqOptions.resList.split('.') : ['data', 'list']
-
-        let list = res
-        resKeys.forEach((key) => {
-          list = list[key]
-        })
-
-        this.$set(this.item, 'options', list)
-      })
-    }
-  }
-}
-</script>