imatrix-ui 2.9.0-dw → 2.9.0-dw-tmp2

package/packages/super-grid/src/search-form-dialog.vue

@@ -1,79 +0,0 @@
-<template>
-  <el-dialog
-    :show-close="true"
-    :append-to-body="true"
-    title="查询条件"
-    visible
-    @close="$emit('close')"
-  >
-    <search-form
-      ref="sf"
-      :columns="columns"
-      :code="code"
-      :url="url"
-      :pagination="pagination"
-      :query="query"
-      :search-param="searchParam"
-      :init-search-props="initSearchProps"
-      @search="doSearch"
-      @reset="resetSearch"
-    />
-  </el-dialog>
-</template>
-<script>
-import SearchForm from './search-form'
-export default {
-  name: 'SearchFormDialog',
-  components: {
-    SearchForm
-  },
-  props: {
-    columns: {
-      type: Array,
-      default: null
-    },
-    code: {
-      type: String,
-      default: null
-    },
-    url: {
-      type: String,
-      default: null
-    },
-    pagination: {
-      type: Object,
-      default: null
-    },
-    query: {
-      type: Object,
-      default: null
-    },
-    searchParam: {
-      type: Object,
-      default: null
-    },
-    initSearchProps: {
-      type: Array,
-      default: null
-    }
-
-  },
-  data() {
-    return {}
-  },
-  computed: {
-
-  },
-  created() {
-
-  },
-  methods: {
-    doSearch(searchForm) {
-      this.$emit('search', searchForm)
-    },
-    resetSearch() {
-      this.$emit('reset')
-    }
-  }
-}
-</script>

package/packages/super-grid/src/search-form-item.vue

@@ -1,386 +0,0 @@
-<template>
-  <el-form-item :prop="column.prop" :label-width="'112px'">
-    <template v-slot:label>
-      <span v-if="column.searchLabel && column.searchLabel !== ''" :title="column.searchLabel.replace(/\\n/g, '</br>')" v-html="column.searchLabel.replace(/\\n/g, '</br>')" />
-      <span v-else :title="column.label.replace(/\\n/g, '</br>')" v-html="column.label.replace(/\\n/g, '</br>')" />
-    </template>
-    <span v-if="customComponent(column) === true">
-      <component
-        :is="column.componentName"
-        :ref="column.componentName"
-        class="customComponent"
-        :select-options="column.valueSet"
-        :prop="column.prop"
-        :value="getFormItemValue(column.prop)"
-        :row="searchForm"
-        :entity="searchForm"
-        @input="setValueToModelProp(column.prop,$event,column.componentName)"
-      />
-    </span>
-    <!-- 日期区间-两个输入框方式 -->
-    <span v-else-if="column.componentType ==='dateSection'">
-      <el-date-picker
-        :value="getFormItemValue(column.prop,0)"
-        :style="column.searchControlWidth"
-        type="date"
-        :placeholder="$t('imatrixUIMessage.startDate')"
-        @input="setValueToModelProp(column.prop,$event,null,0)"
-      />
-      <el-date-picker
-        :value="getFormItemValue(column.prop,1)"
-        :style="column.searchControlWidth"
-        type="date"
-        :placeholder="$t('imatrixUIMessage.endDate')"
-        @input="setValueToModelProp(column.prop,$event,null,1)"
-      />
-    </span>
-    <!--后面再优化年份及年份区间控件--->
-    <year-range-picker
-      v-else-if="column.componentType === 'yearRange' "
-      :value="getFormItemValue(column.prop)"
-      type="yearRange"
-      @change="setYearRangeValue(column.prop,$event)"
-    />
-    <el-g-date-picker
-      v-else-if="column.componentType==='dateTimePicker'"
-      :value="getFormItemValue(column.prop)"
-      :default-time="getDefaultTime(column)"
-      type="datetimerange"
-      :range-separator="$t('imatrixUIPublicModel.to')"
-      unlink-panels
-      :style="column.searchControlWidth"
-      :start-placeholder="$t('imatrixUIMessage.startDate')"
-      :end-placeholder="$t('imatrixUIMessage.endDate')"
-      value-format="yyyy-MM-dd HH:mm:ss"
-      @input="setValueToModelProp(column.prop,$event)"
-    />
-
-    <el-date-picker
-      v-else-if="column.dataType === 'DATE' || column.componentType==='date' "
-      :value="getFormItemValue(column.prop)"
-      type="daterange"
-      :style="column.searchControlWidth"
-      :range-separator="$t('imatrixUIPublicModel.to')"
-      unlink-panels
-      :start-placeholder="$t('imatrixUIMessage.startDate')"
-      :end-placeholder="$t('imatrixUIMessage.endDate')"
-      value-format="yyyy-MM-dd"
-      @input="setValueToModelProp(column.prop,$event)"
-    />
-    <el-date-picker
-      v-else-if="column.dataType === 'TIME' && column.componentType==='timepicker'"
-      :value="getFormItemValue(column.prop)"
-      type="datetimerange"
-      :range-separator="$t('imatrixUIPublicModel.to')"
-      unlink-panels
-      :style="column.searchControlWidth"
-      :start-placeholder="$t('imatrixUIMessage.startDate')"
-      :end-placeholder="$t('imatrixUIMessage.endDate')"
-      value-format="HH:mm:ss"
-      @input="setValueToModelProp(column.prop,$event)"
-    />
-
-    <el-time-picker
-      v-else-if="column.componentType==='timepicker' && column.dataType !== 'TIME' && column.dataType !== 'DATE' "
-      type="fixed-time"
-      :placeholder="$t('imatrixUIMessage.selectTime')"
-      style="width: 100%;"
-      value-format="HH:mm:ss"
-      :value="getFormItemValue(column.prop)"
-      @input="setValueToModelProp(column.prop,$event)"
-    />
-
-    <organization-input
-      v-else-if="componentTypeTypeIsTree(column.componentType)"
-      :value="getFormItemValue(column.prop)"
-      :fields="getTreeFields(column.orgTreeSet)"
-      :models="searchForm"
-      :multiple="getTreeIsMultiTree(column.componentType)"
-      :tree-type="getTreeType(column.componentType)"
-      @setValue="organizationInputEvent"
-      @clear="clearOrganizationInputEvent"
-    />
-
-    <el-select
-      v-else-if="((column.componentType && column.componentType==='select') || column.dataType === 'BOOLEAN') && !isDynamicDataSourceSource(column)"
-      clearable
-      :style="column.searchControlWidth"
-      :placeholder="$t('imatrixUIMessage.pleaseSelect')"
-      :value="getFormItemValue(column.prop)"
-      @input="setValueToModelProp(column.prop,$event)"
-    >
-      <el-option
-        v-for="item in column.valueSet"
-        :key="item.value"
-        :label="item.label"
-        :value="item.value"
-      />
-    </el-select>
-    <el-select
-      v-else-if="column.componentType && column.componentType==='multiselect' && !isDynamicDataSourceSource(column)"
-      clearable
-      multiple
-      :style="column.searchControlWidth"
-      collapse-tags
-      :placeholder="$t('imatrixUIMessage.pleaseSelect')"
-      :value="getFormItemValue(column.prop)"
-      @input="setValueToModelProp(column.prop,$event)"
-    >
-      <el-option
-        v-for="item in column.valueSet"
-        :key="item.value"
-        :label="item.label"
-        :value="item.value"
-      />
-    </el-select>
-    <dynamic-source-select
-      v-else-if="column.componentType && (column.componentType==='multiselect' || column.componentType==='select') && isDynamicDataSourceSource(column)"
-      :value="getFormItemValue(column.prop)"
-      :base-props="{
-        multiple: column.componentType==='multiselect'?true:false
-      }"
-      :entity="searchForm"
-      :options="getDynamicDataSourceOptions(column)"
-      :table-name="tableName"
-      :is-join-table="isJoinTable"
-      :list-code="code"
-      @input="setValueToModelProp(column.prop,$event)"
-    />
-    <!--
-            <el-input-number
-              v-else-if="column.componentType && column.componentType==='inputNumber'"
-              :value="getFormItemValue(column.prop)"
-              @input="setValueToModelProp(column.prop,$event)"
-            /> -->
-
-    <search-form-number
-      v-else-if="column.componentType && column.componentType==='inputNumber'"
-      @setValue="setNumberValue"
-    />
-
-    <el-switch
-      v-else-if="column.componentType && column.componentType==='switch'"
-      active-color="#13ce66"
-      inactive-color="#ff4949"
-      :style="column.searchControlWidth"
-      :value="getFormItemValue(column.prop)"
-      @input="setValueToModelProp(column.prop,$event)"
-    />
-    <el-slider
-      v-else-if="column.componentType && column.componentType==='slider'"
-      :value="getFormItemValue(column.prop)"
-      :style="column.searchControlWidth"
-      @input="setValueToModelProp(column.prop,$event)"
-    />
-
-    <el-rate
-      v-else-if="column.componentType && column.componentType==='rate'"
-      :value="getFormItemValue(column.prop)"
-      :style="column.searchControlWidth"
-      @input="setValueToModelProp(column.prop,$event)"
-    />
-    <el-input v-else :value="getFormItemValue(column.prop)" :style="column.searchControlWidth" @keyup.enter.native="submitForm('searchForm')" @input="setValueToModelProp(column.prop,$event)" />
-  </el-form-item>
-</template>
-
-<script>
-import searchMethods from './search-methods'
-import searchFormNumber from './search-form-number'
-import store from './store'
-import { getDynamicDataSourceOptions, isDynamicDataSourceSource } from './utils'
-import Vue from 'vue'
-export default {
-  name: 'SearchFormItem',
-  components: {
-    searchFormNumber
-  },
-  props: {
-    column: {
-      type: Object,
-      default: null
-    },
-    code: {
-      type: String,
-      default: null
-    },
-    isSql: {
-      type: Boolean,
-      default: false
-    },
-    tableName: {
-      type: String,
-      default: null
-    },
-    isJoinTable: {
-      type: Boolean,
-      default: false
-    },
-    // 查询表单信息
-    searchForm: {
-      type: Object,
-      default: null
-    }
-  },
-  data() {
-    const customComponentNames = new Set()
-    return {
-      customComponentNames: customComponentNames,
-      dateOne: null,
-      dataTwo: null
-    }
-  },
-  methods: {
-    ...searchMethods,
-    getDynamicDataSourceOptions(column) {
-      return getDynamicDataSourceOptions(column, this.isSql)
-    },
-    // 值设置是否是动态数据源类型的数据源
-    isDynamicDataSourceSource(column) {
-      return isDynamicDataSourceSource(column)
-    },
-    setValueToModelProp(prop, value, componentName, index) {
-      if (prop && prop.indexOf('.') > 0) {
-        const parentOjbect = this.getParentObject(prop)
-        // 嵌套属性中的最后一个属性是属于这个中间父对象的，所有要通过中间父对象来赋值
-        if (index != null && index !== undefined) {
-          // parentOjbect[prop.substring(prop.lastIndexOf('.') + 1)][index] = value
-          this.$set(parentOjbect[prop.substring(prop.lastIndexOf('.') + 1)], index, value)
-        } else {
-          parentOjbect[prop.substring(prop.lastIndexOf('.') + 1)] = value
-        }
-      } else {
-        if (index != null && index !== undefined) {
-          this.$set(this.searchForm[prop], index, value)
-        } else {
-          this.searchForm[prop] = value
-        }
-      }
-    },
-    componentTypeTypeIsTree(componentType) {
-      if (componentType) {
-        if (componentType.indexOf('DeptManTree') > 0) {
-          // 说明是部门人员树
-          return true
-        }
-        if (componentType.indexOf('DeptTree') > 0) {
-          // 说明是部门树
-          return true
-        }
-        if (componentType.indexOf('WgManTree') > 0) {
-          // 说明是工作组人员树
-          return true
-        }
-        if (componentType.indexOf('WgManTree') > 0) {
-          // 说明是工作组树
-          return true
-        }
-      }
-      return false
-    },
-    getTreeFields(orgTreeSetJson) {
-      if (orgTreeSetJson && orgTreeSetJson !== '') {
-        const orgTreeSet = JSON.parse(orgTreeSetJson)
-        if (orgTreeSet.length) {
-          return orgTreeSet
-        } else {
-          if (orgTreeSet.orgTreeSetArr) {
-            return orgTreeSet.orgTreeSetArr
-          }
-        }
-      }
-    },
-    getTreeIsMultiTree(componentType) {
-      if (componentType && componentType.indexOf('single') >= 0 && componentType.indexOf('Tree') > 0) {
-        return false
-      } else {
-        return true
-      }
-    },
-    getTreeType(componentType) {
-      if (componentType) {
-        if (componentType.indexOf('DeptManTree') > 0) {
-          // 说明是部门人员树
-          return 'DeptUserTree'
-        }
-        if (componentType.indexOf('DeptTree') > 0) {
-          // 说明是部门树
-          return 'DeptTree'
-        }
-        if (componentType.indexOf('WgTree') > 0) {
-          // 说明是工作组人员树
-          return 'WgTree'
-        }
-        if (componentType.indexOf('WgManTree') > 0) {
-          // 说明是工作组树
-          return 'WgUserTree'
-        }
-      }
-    },
-    // 组织结构树文本框值改变事件
-    organizationInputEvent(prop, value) {
-      if (prop) {
-        // 必须手动调用一下input事件，否则不会更新组件的值
-        this.$set(this.searchForm, prop, value)
-      }
-    },
-    // 组织结构树文本框值清空事件
-    clearOrganizationInputEvent(prop) {
-      if (prop) {
-        // 必须手动调用一下input事件，否则不会更新组件的值
-        this.$set(this.searchForm, prop, null)
-      }
-    },
-    customComponent(column) {
-      const gridParams = store.get(this.code)
-      if (column.componentName && column.componentName !== '') {
-        this.customComponentNames.add(column.componentName)
-        return true
-      }
-      if ((!column.componentName || column.componentName === '') &&
-            gridParams.options &&
-            gridParams.options.search &&
-            gridParams.options.search.customSearchElements) {
-        // 定义了自定义查询组件
-        const propSearchEle = gridParams.options.search.customSearchElements[column.prop]
-        // console.log('customComponent-customSearchElements-propSearchEle-', column.prop)
-        if (propSearchEle) {
-          column.componentName = 'custom-' + column.prop
-          const component = propSearchEle.call(this, column)
-          // console.log('customComponent-customSearchElements-')
-          if (component) {
-            this.customComponentNames.add(column.componentName)
-            Vue.component(column.componentName, component)
-            return true
-          }
-        }
-      }
-      return false
-    },
-    setNumberValue(value, r, n) {
-      let itemValue = this.getFormItemValue(this.column.prop)
-      itemValue = value
-      this.setValueToModelProp(this.column.prop, itemValue)
-    },
-    setYearRangeValue(prop, value) {
-      this.$set(this.searchForm[prop], 0, value[0])
-      this.$set(this.searchForm[prop], 1, value[1])
-    },
-    getDefaultTime(column) {
-      if (column['valueSetOptions']) {
-        const valueSetOptions = JSON.parse(column['valueSetOptions'])
-        if (valueSetOptions.defaultTime) {
-          return [valueSetOptions.defaultTime, valueSetOptions.defaultTime]
-        } else {
-          return ['00:00:00']
-        }
-      } else {
-        return ['00:00:00']
-      }
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-
-</style>

package/packages/super-grid/src/search-form-number.vue

@@ -1,38 +0,0 @@
-<template>
-  <div>
-    <el-input-number
-      v-model="number1"
-      @change="setValue()"
-    />
-    <span>---</span>
-    <el-input-number
-      v-model="number2"
-      @change="setValue()"
-    />
-  </div>
-</template>
-<script>
-export default {
-  props: {
-    r: {
-      type: Number,
-      default: null
-    },
-    n: {
-      type: Number,
-      default: null
-    }
-  },
-  data() {
-    return {
-      number1: null,
-      number2: null
-    }
-  },
-  methods: {
-    setValue() {
-      this.$emit('setValue', [this.number1, this.number2], this.r, this.n)
-    }
-  }
-}
-</script>

package/packages/super-grid/src/search-form-open.vue

@@ -1,162 +0,0 @@
-<template>
-  <div>
-    <div class="grid-search-row">
-      <el-row v-for="r of rowNum" v-show="myOpen || r === 1" :key="r">
-        <el-col v-for="n of fieldNum" :key="n" :xs="spanNum" :sm="spanNum" :md="spanNum" :lg="spanNum" :xl="spanNum">
-          <template v-if="fieldNum*(r-1)+(n-1) < searchableColumns.length">
-            <!--初始进入台账页面时 或 展开时显示按钮--->
-            <search-form-item
-              v-show="(!myOpen && r===1 && n < fieldNum) || (myOpen)"
-              :search-form="searchForm"
-              :column="searchableColumns[fieldNum*(r-1)+(n-1)]"
-              :code="code"
-              :is-sql="isSql"
-              :table-name="tableName"
-              :is-join-table="isJoinTable"
-            />
-          </template>
-          <!--初始进入台账页面时 或 展开时显示按钮--->
-          <search-button
-            v-if="(!myOpen && r===1 && n === fieldNum) || (myOpen && !isButtonNewRow && r === rowNum && n === fieldNum)"
-            ref="searchBtnOpen"
-            :is-open="myOpen"
-            @submit-form="$emit('submit-form')"
-            @reset-form="$emit('reset-form')"
-            @save-condition="$emit('save-condition')"
-            @open-fold="openFold"
-          />
-        </el-col>
-      </el-row>
-    </div>
-    <!--按钮单独一行放置时--->
-    <el-row v-if="isShowNewBtnRow">
-      <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
-        <search-button
-          ref="searchBtnOpen"
-          :is-open="myOpen"
-          @submit-form="$emit('submit-form')"
-          @reset-form="$emit('reset-form')"
-          @save-condition="$emit('save-condition')"
-          @open-fold="openFold"
-        />
-      </el-col>
-    </el-row>
-  </div>
-</template>
-<script>
-import searchMethods from './search-methods'
-import SearchFormItem from './search-form-item.vue'
-import SearchButton from './search-button.vue'
-export default {
-  name: 'SearchFormOpen',
-  components: {
-    SearchFormItem,
-    SearchButton
-  },
-  props: {
-    // 第一行的字段集合
-    searchableColumns: {
-      type: Array,
-      default: null
-    },
-    // 查询表单信息
-    searchForm: {
-      type: Object,
-      default: null
-    },
-    code: {
-      type: String,
-      default: null
-    },
-    isSql: {
-      type: Boolean,
-      default: false
-    },
-    tableName: {
-      type: String,
-      default: null
-    },
-    isJoinTable: {
-      type: Boolean,
-      default: false
-    },
-    spanNum: {
-      type: Number,
-      default: 8
-    },
-    // 每行几个字段
-    fieldNum: {
-      type: Number,
-      default: null
-    },
-    // 一共多少行
-    rowNum: {
-      type: Number,
-      default: null
-    },
-    // 查询条件是否展开
-    isOpen: {
-      type: Boolean,
-      default: false
-    }
-  },
-  data() {
-    let isButtonNewRow = false
-    let isShowNewBtnRow = false
-    if (this.searchableColumns.length % this.fieldNum === 0 || this.rowNum > 6) {
-      // 表示查询字段正好占满行，或行数大于6时，需要另起一行放查询按钮
-      isButtonNewRow = true
-      isShowNewBtnRow = true
-    }
-    if (isButtonNewRow && !myOpen) {
-      // 需要另起一行，但是当前是收起状态，暂不显示最后一行按钮
-      isShowNewBtnRow = false
-    }
-    const myOpen = this.isOpen
-    return {
-      isButtonNewRow,
-      isShowNewBtnRow,
-      myOpen
-    }
-  },
-  watch: {
-    myOpen() {
-      if (this.isButtonNewRow) {
-        if (!this.myOpen) {
-          // 需要另起一行，但是当前是收起状态，暂不显示最后一行按钮
-          this.isShowNewBtnRow = false
-        } else {
-          // 需要另起一行，当前是展开状态，显示最后一行按钮
-          this.isShowNewBtnRow = true
-        }
-      }
-    }
-  },
-  methods: {
-    ...searchMethods,
-    openFold(isOpen) {
-      this.myOpen = isOpen
-      this.$emit('open-fold', isOpen)
-    },
-    // 查询完毕
-    searchComplete() {
-      if (this.$refs.searchBtnOpen) {
-        if (Array.isArray(this.$refs.searchBtnOpen)) {
-          if (this.$refs.searchBtnOpen.length > 0) {
-            this.$refs.searchBtnOpen[0].searchComplete()
-          }
-        } else {
-          this.$refs.searchBtnOpen.searchComplete()
-        }
-      }
-    }
-  }
-}
-</script>
-
-<style  scoped>
-.grid-search-row{
-    overflow: auto;
-    max-height: 320px;
-  }
-</style>