fast-crud-ui3 1.5.16-tsc-beta → 1.5.16

package/packages/components/content-dialog/src/fast-cell-content.vue

@@ -1,115 +0,0 @@
-<template>
-  <div>
-    <!-- TODO 借鉴此机制实现脱敏 -->
-    <el-link class="fc-ellipsis" :underline="underline" :type="showAsLink ? 'primary' : 'default'"
-             @click="handleClick" v-if="needEllipsis || showAsLink">{{ value }}
-    </el-link>
-    <span v-else>{{ value }}</span>
-  </div>
-</template>
-
-<script>
-import {version as elVersion} from 'element-plus'
-import FastJsonViewer from "../../json-viewer/src/fast-json-viewer.vue"
-import * as util from "../../../util/util.js"
-import {openDialog} from "../../../util/dialog.js"
-import FastTableOption from "../../../model/fastTableOption.js"
-
-export default {
-  name: "FastCellContent",
-  components: {FastJsonViewer},
-  props: {
-    value: {
-      type: null // 任意类型
-    },
-    fatRow: Object,
-    linkTo: [String, Boolean],
-    showLength: {
-      type: Number,
-      default: () => Number.MAX_VALUE // 不限制
-    }
-  },
-  computed: {
-    underline() {
-      return util.versionGte(elVersion, '2.9.9') ? 'never' : false // 2.9.9后支持never, 之前是false
-    },
-    // 是否展示为链接
-    showAsLink() {
-      return this.linkTo === true || (util.isString(this.linkTo) && !util.isEmpty(this.linkTo))
-    },
-    // 链接地址
-    linkUrl() {
-      if (!this.showAsLink) {
-        return null;
-      }
-      return this.linkTo === true ? this.value : this.linkTo
-    },
-    needEllipsis() {
-      return util.isEmpty(this.value) ? false : util.toStr(this.value).length > this.showLength
-    },
-    row() {
-      return this.fatRow.row
-    }
-  },
-  methods: {
-    handleClick() {
-      if (this.showAsLink) {
-        try {
-          this.jumpToLink()
-        } catch (err) { // 若链接跳转失败, 又需要预览, 则降级弹窗预览
-          console.error(err)
-          if (this.needEllipsis) {
-            this.openViewer()
-          }
-        }
-        return
-      }
-      this.openViewer()
-    },
-    // 跳转到目标地址(支持路由名、路由地址、http绝对地址)
-    jumpToLink() {
-      const {linkUrl} = this
-      if (util.isEmpty(linkUrl)) {
-        return
-      }
-      // 转义linkUrl中可能存在的插值表达式
-      const url = util.strFormat(linkUrl, this.row)
-      if (util.isUrl(url)) {
-        window.open(url, '_blank')
-        return
-      }
-      // 提取linkUrl中可能存在的query参数, 作为路由跳转的参数
-      const {path: pathOrName, query} = util.extractUrlAndQueryParams(url)
-      if (url.startsWith('/')) {
-        FastTableOption.$router.push({path: pathOrName, query: query})
-        return
-      }
-      FastTableOption.$router.push({name: pathOrName, query: query})
-    },
-    // 超长预览
-    openViewer() {
-      openDialog({
-        component: FastJsonViewer,
-        props: {
-          value: (util.isObject(this.value) || util.isJsonStr(this.value)) ? util.toJson(this.value) : this.value
-        },
-        dialogProps: {
-          title: '值预览',
-          width: '500px'
-        }
-      })
-    }
-  }
-}
-</script>
-
-<style scoped lang="scss">
-.fc-ellipsis, .fc-ellipsis * {
-  white-space: nowrap;
-  overflow: hidden;
-  overflow: clip;
-  text-overflow: ellipsis;
-  display: inline-block;
-  width: 100%;
-}
-</style>

package/packages/components/json-viewer/index.js

@@ -1,7 +0,0 @@
-import FastJsonViewer from './src/fast-json-viewer.vue'
-
-FastJsonViewer.install = (app) => {
-    app.component(FastJsonViewer.name, FastJsonViewer)
-}
-
-export default FastJsonViewer

package/packages/components/json-viewer/src/fast-json-viewer.vue

@@ -1,54 +0,0 @@
-<template>
-  <div>
-    <JsonViewer :value="value"
-                :copyable="copyable"
-                :boxed="boxed"
-                :expandDepth="expandDepth"
-                :theme="theme"
-                v-if="isJson"></JsonViewer>
-    <span style="word-wrap: break-word;" v-else>{{ value }}</span>
-  </div>
-</template>
-
-<script>
-import {defineComponent} from "vue";
-import {JsonViewer} from "vue3-json-viewer"
-import "vue3-json-viewer/dist/vue3-json-viewer.css"
-import {isObject} from "../../../util/util.js";
-
-export default defineComponent({
-  name: "fast-json-viewer",
-  components: {
-    // JSDoc强制断言为any, 避免其私有类型CopyableOptions导致npm run build:lib 提示TS9006错误
-    JsonViewer: /** @type {any} **/ (JsonViewer)
-  },
-  props: {
-    value: null,
-    copyable: {
-      type: Boolean,
-      default: () => true
-    },
-    boxed: {
-      type: Boolean,
-      default: () => true
-    },
-    expandDepth: {
-      type: Number,
-      default: () => Number.MAX_VALUE
-    },
-    theme: {
-      type: String,
-      default: () => 'light' // light/dark
-    }
-  },
-  computed: {
-    isJson() {
-      return isObject(this.value)
-    }
-  }
-})
-</script>
-
-<style scoped lang="scss">
-
-</style>

package/packages/components/mapping.js

@@ -1,95 +0,0 @@
-import EditComponentConfig from '../model/editComponentConfig.js'
-import FilterComponentConfig from '../model/filterComponentConfig.js'
-import {isFunction, replaceKey} from "../util/util.js";
-import FastTableColumnConfig from './table-column/config';
-import FastTableColumnDatePickerConfig from './table-column-date-picker/config';
-import FastTableColumnFileConfig from './table-column-file/config';
-import FastTableColumnImgConfig from './table-column-img/config';
-import FastTableColumnInputConfig from './table-column-input/config';
-import FastTableColumnNumberConfig from './table-column-number/config';
-import FastTableColumnObjectConfig from './table-column-object/config';
-import FastTableColumnSelectConfig from './table-column-select/config';
-import FastTableColumnSwitchConfig from './table-column-switch/config';
-import FastTableColumnTextareaConfig from './table-column-textarea/config';
-import FastTableColumnTimePickerConfig from './table-column-time-picker/config';
-
-const MAPPING = {
-    'FastTableColumn': FastTableColumnConfig,
-    'FastTableColumnDatePicker': FastTableColumnDatePickerConfig,
-    'FastTableColumnFile': FastTableColumnFileConfig,
-    'FastTableColumnImg': FastTableColumnImgConfig,
-    'FastTableColumnInput': FastTableColumnInputConfig,
-    'FastTableColumnNumber': FastTableColumnNumberConfig,
-    'FastTableColumnObject': FastTableColumnObjectConfig,
-    'FastTableColumnSelect': FastTableColumnSelectConfig,
-    'FastTableColumnSwitch': FastTableColumnSwitchConfig,
-    'FastTableColumnTextarea': FastTableColumnTextareaConfig,
-    'FastTableColumnTimePicker': FastTableColumnTimePickerConfig
-}
-
-/**
- * 获取配置的装配函数
- * @param tableColumnComponentName 列组件
- * @param type 类型(query/edit)
- * @return {*|null}
- */
-export const getConfigFn = function (tableColumnComponentName, type) {
-    if (!MAPPING.hasOwnProperty(tableColumnComponentName) || !MAPPING[tableColumnComponentName].hasOwnProperty(type)) {
-        // console.error(`未定义针对${tableColumnComponentName}的快速搜索控件`)
-        return null;
-    }
-
-    return MAPPING[tableColumnComponentName][type]
-}
-
-/**
- * 构建最终的过滤组件的配置
- * @param customConfig 用户自定义配置。方法内不会改变此值
- * @param tableColumnComponentName table-column组件名
- * @param type 类型, 可选: quick, easy, dynamic, stored
- * @param tableOption FastTable配置
- */
-export const buildFinalQueryComponentConfig = function (customConfig, tableColumnComponentName, type, tableOption) {
-    // 排除props中后缀为_e的属性, 因为这些配置项仅用于编辑控件, 并将_q后缀的属性名移除此后缀
-    const customProps = replaceKey(customConfig.props, '_q')
-    const customFilterConfig = {
-        ...customConfig,
-        props: {...customProps}
-    }
-
-    const finalConfigFn = getConfigFn(tableColumnComponentName, 'query');
-    if (!isFunction(finalConfigFn)) {
-        throw new Error(`未定义针对${tableColumnComponentName}的查询控件配置`)
-    }
-    const finalConfig = finalConfigFn(customFilterConfig, type, tableOption);
-    return new FilterComponentConfig({
-        ...finalConfig,
-        type: type
-    })
-}
-
-/**
- * 构建最终的过滤组件的配置
- * @param customConfig 用户自定义配置。方法内不会改变此值
- * @param tableColumnComponentName table-column组件名
- * @param type 类型, 可选: inline, form
- * @param tableOption FastTable配置
- */
-export const buildFinalEditComponentConfig = function (customConfig, tableColumnComponentName, type, tableOption) {
-    const customProps = replaceKey(customConfig.props, '_e');
-    const customFilterConfig = {
-        ...customConfig,
-        props: {...customProps}
-    }
-
-    const finalConfigFn = getConfigFn(tableColumnComponentName, 'edit');
-    if (!isFunction(finalConfigFn)) {
-        throw new Error(`未定义针对${tableColumnComponentName}的编辑控件配置`)
-    }
-    const finalConfig = finalConfigFn(customFilterConfig, type, tableOption);
-    return new EditComponentConfig({
-        ...finalConfig,
-        type: type,
-        tableOption: tableOption
-    })
-}

package/packages/components/object-picker/index.js

@@ -1,7 +0,0 @@
-import FastObjectPicker from './src/fast-object-picker.vue'
-
-FastObjectPicker.install = (app) => {
-    app.component(FastObjectPicker.name, FastObjectPicker)
-}
-
-export default FastObjectPicker

package/packages/components/object-picker/src/fast-object-picker.vue

@@ -1,170 +0,0 @@
-<template>
-  <!-- 使用 el-select 以便更好的支持搜索以及多选(可借助el-select的远程搜索模式实现——避免下拉) -->
-  <el-select v-model="value"
-             :clearable="clearable"
-             :placeholder="placeholder"
-             :size="size"
-             :disabled="disabled"
-             :multiple="multiple"
-             remote :suffix-icon="null"
-             @clear="handleClear"
-             @blur="(event) => $emit('blur', event)"
-             @change="(val) => $emit('change', val)"
-             @click="handleClick"
-             @focus="handleFocus">
-    <el-option v-for="item in options" :key="item.value" :value="item.value" :label="item.label"/>
-  </el-select>
-</template>
-
-<script>
-import {pick} from "../../../util/pick"
-import {defaultIfEmpty, isArray, isEmpty, isObject} from "../../../util/util"
-import FastTableOption from "../../../model/fastTableOption.js"
-
-export default {
-  name: "FastObjectPicker",
-  emits: ['update:modelValue', 'blur', 'change', 'clear', 'click', 'focus'],
-  props: {
-    modelValue: {
-      required: true
-    },
-    tableOption: {
-      type: FastTableOption,
-      required: true
-    },
-    showField: String, // 回显到控件上的字段 @deprecated 1.6 使用valKey替代
-    valKey: String, // 替代showField, 指定"值"key
-    labelKey: String, // 当控件需要"值显"不一致时, 指定"显"key
-    pickObject: Object, // 单选时, pick选择后回填到的目标object上
-    pickMap: Object, // 单选时, pick选择后回填到目标object上时，指导字段对应关系: key为pick的数据的字段名, value为pickObject中的字段名
-    valueCovert: { // 针对showField取值的值转换, 对于多选时, 会讲showField的多个值用英文逗号分隔后返回，作为组件v-model值
-      type: Function,
-      default: (pickData, field) => {
-        if (isArray(pickData)) {
-          return pickData.map(row => row[field])
-        } else {
-          return pickData[field]
-        }
-      }
-    },
-    beforeOpen: {
-      type: Function,
-      default: () => Promise.resolve()
-    },
-    title: String,
-    multiple: {
-      type: Boolean,
-      default: () => false
-    },
-    placeholder: {
-      type: String,
-      default: () => "请点选..."
-    },
-    appendToBody: {
-      type: Boolean,
-      default: () => true
-    },
-    disabled: {
-      type: Boolean,
-      default: () => false
-    },
-    clearable: {
-      type: Boolean,
-      default: () => true
-    },
-    size: String,
-    // pick弹窗的宽度
-    dialogWidth: {
-      type: String,
-      default: () => '70%'
-    },
-    // 用以内置el-select回显
-    options: {
-      type: Array,
-      default: () => []
-    }
-  },
-  mounted() {
-    if (isEmpty(this.options) && !isEmpty(this.modelValue)) { // 有初始值, 先构造一个选项以便正常显示
-      // this.options = [{label: this.modelValue, value: this.modelValue}]
-      this.options.length = 0
-      this.options.push([{label: this.modelValue, value: this.modelValue}])
-    }
-  },
-  computed: {
-    value: {
-      get() {
-        return this.modelValue
-      },
-      set(val) {
-        this.$emit('update:modelValue', val)
-      }
-    }
-  },
-  methods: {
-    handleClear(event) {
-      this.$emit('clear', event)
-      // 清除pickMap的其它属性
-      if (!isEmpty(this.pickMap) && !isEmpty(this.pickObject)) {
-        Object.entries(this.pickMap).forEach(([pickFieldName, formFieldName]) => {
-          this.pickObject[formFieldName] = null
-        })
-      }
-    },
-    handleClick(event) {
-      // 检查点击事件的目标是否为清除按钮, 清除按钮的话不上抛点击事件
-      if (event.target.classList.contains('el-input__clear')) {
-        return
-      }
-      this.$emit('click', event)
-      this.openPick()
-    },
-    handleFocus(event) {
-      this.$emit('focus', event)
-      // this.openPick() // ESC退出后焦点又回到input，会导致ESC关不掉
-    },
-    openPick() {
-      const {beforeOpen, tableOption} = this
-      beforeOpen().then(() => {
-        pick({
-          option: tableOption,
-          multiple: this.multiple,
-          dialog: {
-            title: this.title,
-            width: this.dialogWidth,
-            appendToBody: this.appendToBody
-          }
-        }).then((fatData) => {
-          const data = isArray(fatData) ? fatData.map((item) => item.row) : fatData.row
-          const valKey = defaultIfEmpty(this.valKey, this.showField)
-          const labelKey = defaultIfEmpty(this.labelKey, valKey)
-          // 赋值options
-          const options = (isArray(data) ? data : [data]).map(item => {
-            return {value: item[valKey], label: item[labelKey]}
-          })
-          this.options.length = 0
-          this.options.push(...options)
-          // 赋值value
-          const newVal = this.valueCovert(data, valKey)
-          this.value = newVal
-          this.$emit('change', newVal)
-          if (this.multiple !== true && isObject(data)) {
-            // 赋值pickObject
-            Object.entries(this.pickMap).forEach(([pickFieldName, formFieldName]) => {
-              this.pickObject[formFieldName] = data[pickFieldName]
-            })
-          }
-        }).catch((err = '你取消了pic弹窗') => {
-          console.debug(err)
-        })
-      }).catch((err = '你取消了打开pick') => {
-        console.debug(err)
-      })
-    }
-  }
-}
-</script>
-
-<style scoped lang="scss">
-
-</style>

package/packages/components/select/index.js

@@ -1,7 +0,0 @@
-import FastSelect from './src/fast-select.vue'
-
-FastSelect.install = (app) => {
-    app.component(FastSelect.name, FastSelect)
-}
-
-export default FastSelect

package/packages/components/select/src/fast-select.vue

@@ -1,89 +0,0 @@
-<template>
-  <el-select v-model="value" v-bind="$attrs" :size="size" :multiple="multiple"
-             @change="(val) => $emit('change', val)"
-             @clear="() => $emit('clear')"
-             @focus="(event) => $emit('focus', event)"
-             @blur="(event) => $emit('blur', event)"
-             @visible-change="(visible) => $emit('visibleChange', visible)"
-             @remove-tag="(tagVal) => $emit('removeTag', tagVal)">
-    <el-option v-for="item in nativeOptions" :key="item.value" :label="item[labelKey]" :value="item[valKey]"
-               :disabled="disableVal.indexOf(item[valKey]) > -1"></el-option>
-  </el-select>
-</template>
-
-<script>
-import FastTableOption from '../../../model/fastTableOption.js'
-import Query from '../../../model/query.js'
-import * as util from '../../../util/util.js'
-
-export default {
-  name: "fast-select",
-  emits: ['update:modelValue', 'change', 'clear', 'focus', 'blur', 'visibleChange', 'removeTag'],
-  props: {
-    modelValue: {
-      required: true
-    },
-    options: {
-      type: [Array, FastTableOption],
-      default: () => []
-    },
-    labelKey: {
-      type: String,
-      default: () => "label"
-    },
-    valKey: {
-      type: String,
-      default: () => "value"
-    },
-    multiple: { // 多值时, value为数组
-      type: Boolean,
-      default: () => false
-    },
-    disableVal: {
-      type: Array,
-      default: () => []
-    },
-    size: {
-      type: String,
-      default: 'default'
-    }
-  },
-  data() {
-    return {
-      nativeOptions: util.isArray(this.options) ? this.options : []
-    }
-  },
-  async mounted() {
-    if (this.options instanceof FastTableOption) {
-      await this.buildSelectOptions()
-    }
-  },
-  computed: {
-    value: {
-      get() {
-        return this.modelValue
-      },
-      set(val) {
-        this.$emit('update:modelValue', val)
-      }
-    }
-  },
-  methods: {
-    buildSelectOptions() {
-      if (!(this.options instanceof FastTableOption)) {
-        return
-      }
-      const query = new Query().setDistinct().setCols([this.valKey, this.labelKey]);
-      this.options._buildSelectOptions(query, this.valKey, this.labelKey).then(options => {
-        this.nativeOptions = options
-      }).catch(err => {
-        console.error(err)
-      })
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>

package/packages/components/table/index.js

@@ -1,7 +0,0 @@
-import FastTable from './src/table.vue'
-
-FastTable.install = (app) => {
-    app.component(FastTable.name, FastTable)
-}
-
-export default FastTable

package/packages/components/table/src/RowConfirm.vue

@@ -1,87 +0,0 @@
-<template>
-  <fast-table class="fc-fast-table"
-              :data="rows"
-              :is-static="true"
-              :option="tableOption"
-              @selection-change="handleSelectionChange">
-    <template v-for="column in columnProps">
-      <component :is="column.componentName"
-                 v-bind="column.props"
-                 v-if="column.hidden === false"/>
-    </template>
-    <template #button>
-      <el-button type="danger" plain :disabled="checkedRows.length === 0" @click="handleRemove"
-                 v-if="action === 'delete' && rows.length > 1">从删除清单里移出</el-button>
-    </template>
-  </fast-table>
-</template>
-
-<script>
-import FastTableOption from "../../../model/fastTableOption.js"
-
-export default {
-  name: 'RowConfirm',
-  props: {
-    rows: {
-      type: Array,
-      default: () => []
-    },
-    columnConfigs: Object,
-    action: {
-      type: String,
-      default: () => 'view',
-      validator: (value) => ['view', 'delete'].indexOf(value) > -1
-    }
-  },
-  data() {
-    return {
-      tableOption: new FastTableOption({
-        queryable: false,
-        insertable: false,
-        updatable: false,
-        deletable: false,
-        exportable: false,
-        enableMulti: this.rows.length > 1
-      }),
-      checkedRows: []
-    }
-  },
-  computed: {
-    columnProps() {
-      return this.columnConfigs.map(({tableColumnComponentName, customConfig}) => {
-        const {hidden, showLength, col, label, props} = customConfig
-        return {
-          componentName: tableColumnComponentName,
-          hidden: hidden,
-          props: {
-            ...props,
-            filter: false,
-            prop: col,
-            label: label,
-            showOverflowToolTip: true,
-            showLength: showLength
-          }
-        }
-      })
-    }
-  },
-  methods: {
-    handleSelectionChange({fatRows}) {
-      this.checkedRows = fatRows
-    },
-    handleRemove() {
-      for (let i = this.rows.length - 1; i >= 0; i--) {
-        if (this.checkedRows.some(r => r === this.rows[i])) {
-          this.rows.splice(i, 1)
-        }
-      }
-    },
-    getRows() {
-      return this.rows
-    }
-  }
-}
-</script>
-
-<style scoped lang="scss">
-</style>