web-component-gallery 1.3.12 → 2.0.2

package/plugins/lib/basic/404.vue

@@ -1,24 +0,0 @@
-<template>
-  <Result status="404" title="404" sub-title="对不起，您访问的页面不存在">
-    <template #extra>
-      <Button type="primary" @click="toHomePage">返回首页</Button>
-    </template>
-  </Result>
-</template>
-
-<script>
-import { mapGetters } from 'vuex'
-import { Result, Button } from 'ant-design-vue'
-export default {
-  name: 'Exception404',
-  components: { Result, Button },
-  computed: {
-    ...mapGetters(['toHome']) 
-  },
-  methods: {
-    toHomePage() {
-      this.$router.replace(this.toHome ?? '/')
-    }
-  }
-}
-</script>

package/plugins/lib/browse/index.jsx

@@ -1,76 +0,0 @@
-import PropTypes from 'ant-design-vue/es/_util/vue-types'
-
-import './index.less'
-
-import { Base64 } from '../../utils/Base64'
-
-import { getPictureAttrs } from '../../utils/Utils'
-
-const pictureType = [ "gif", "jpeg", "png", "jpg", "bmp", "tif", "svg", "psd", "raw", "WMF", "webp", "apng" ]
-const audioType = [ "mp3", "wma", "flac", "aac", "mmf", "amr", "m4a", "m4r", "ogg", "mp2", "wav" ]
-const videoType = [ "avi", "flv", "mpg", "mpeg", "mpe", "m1v", "m2v", "mpv2", "mp2v", "dat", "ts", "tp", "tpr", "pva", "pss", "mp4", "m4v",
-        "m4p", "m4b", "3gp", "3gpp", "3g2", "3gp2", "ogg", "mov", "qt", "amr", "rm", "ram", "rmvb", "rpm" ]
-
-const BrowseProps = {
-  data: PropTypes.oneOfType([PropTypes.string, PropTypes.array, PropTypes.object]).def([]),
-  /** 支持http地址可配置 */
-  httpsUrl: PropTypes.object.def({}),
-  /** 限制高度 */
-  astrictH: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-}
-
-const renderContent = (h, item, https, astrictH) => {
-
-    const type = item.url.slice(item.url.lastIndexOf('.') + 1).toLowerCase()
-
-    const CustomTag = 
-        pictureType.includes(type) && 'img' ||
-        audioType.includes(type) && 'audio' ||
-        videoType.includes(type) && 'video' || 'iframe'
-
-    const attrs = {
-      controls: true,
-      src: https.FILEURL + item.url
-    } 
-
-    CustomTag === 'iframe' 
-    && ( attrs.src = https.KKFILEURL + encodeURIComponent( Base64.encode( https.OVERVIEWFILEURL + item.url ) ) )
-
-    if(astrictH) {
-      const style = getPictureAttrs(attrs.src, astrictH)
-      attrs.style = `width: ${style.width}px; height: ${style.height}px;`
-    }
-    
-    return (
-      <CustomTag {...{ attrs }} />
-    )
-}
-
-const Browse = {
-  name: 'Browse',
-  props: BrowseProps,
-  render(h, content) {
-    let { data, $https, httpsUrl, astrictH } = this
-    const https = { ...$https, ...httpsUrl }
-    if(typeof(data) === 'string') {
-        try {
-            data = JSON.parse(data)
-        } catch(error) { data = [] }
-    }
-    return (
-      <div class="Browse">
-        {
-            data instanceof Array ?
-            data.map( dataItem => renderContent(h, dataItem, https, astrictH) ) :
-            renderContent(h, data, https, astrictH)
-        }
-      </div>
-    )
-  }
-}
-
-Browse.install = function (Vue) {
-  Vue.component('Browse', Browse)
-}
-
-export default Browse

package/plugins/lib/browse/index.less

@@ -1,4 +0,0 @@
-iframe {
-    width: 100%;
-    height: 100%;
-}

package/plugins/lib/button/Button.js

@@ -1,89 +0,0 @@
-import Message from 'ant-design-vue/es/message' 
-import { Button, Upload, Popconfirm } from 'ant-design-vue'
-
-/* 弹出框默认配置 */
-const PopconfirmProps = {
-  title: "确定执行此操作吗？",
-  okText: "确定",
-  cancelText: "取消",
-  placement: "topRight"
-} 
-
-export default {
-  name: "Button",
-  props: {
-    buttonProps: {
-        type: [ Array, Object ],
-        default: () => ({})
-    }
-  },
-  methods: {
-    UploadBtn( props ) {
-      const { ButtonRender, UploadChange, $https, $store } = this
-      /* 上传按钮默认配置 */
-      const UploadProps = {
-        name: "file",
-        showUploadList: false,
-        action: $https.WEBSWG + $https.BASEURL + props.url,
-        headers: {
-          token: $store.getters.token
-        }
-      }
-      return (
-        <Upload 
-          props={{ ...UploadProps, ...props.config }} 
-          {...{ on: { change: UploadChange,...props.event } }}
-        >
-          { ButtonRender( props ) }
-        </Upload>
-      )
-    },
-    UploadChange({ file }) { 
-      if(!file.hasOwnProperty('response')) return
-      const { code, data, msg } = file.response
-      code == 200 ? 
-      Message.success('导入成功！'):
-      Message.error(msg)
-      this.$emit('ButtonUploadOver', data) 
-    },
-    PopconfirmBtn( props ) {
-      const { ButtonRender } = this
-      return (
-        <Popconfirm props={{ ...PopconfirmProps, ...props.config }} {...{ on: props.event }} >
-            { ButtonRender( props ) }
-        </Popconfirm>
-      ) 
-    }, 
-    ButtonRender( props ) {
-      //  const buttonEvent = props.type
-      return (
-        <Button
-            props={ props }
-            {...{ on: props.event }}
-        >
-            { props.text }
-        </Button>
-      )
-    }, 
-    SwitchButton( props ) {
-        const { PopconfirmBtn, UploadBtn, ButtonRender } = this
-        if( props.mode == 'popconfirm' ) return PopconfirmBtn( props )
-        else if( props.mode == 'upload' ) return UploadBtn( props )
-        return ButtonRender( props )
-    }
-  },
-  render() {
-    const { buttonProps, SwitchButton } = this
-    // console.log( buttonProps.constructor === Array )
-
-    return (
-      <div class='ButtonDiversity'> 
-        { buttonProps.constructor === Array ? (
-            buttonProps.map( props => {
-                return SwitchButton( props )
-            }) 
-        ) : ( SwitchButton( buttonProps ) ) }
-      </div>
-    )
-  }
-}

package/plugins/lib/button/index.js

@@ -1,7 +0,0 @@
-import Button from './Button.js'
- 
-Button.install = function (Vue) { 
-  Vue.component(Button.name, Button)
-} 
-
-export default Button

package/plugins/lib/dateTime/index.js

@@ -1,7 +0,0 @@
-import DateTime from './index.vue'
- 
-DateTime.install = function (Vue) { 
-  Vue.component(DateTime.name, DateTime)
-}
-
-export default DateTime 

package/plugins/lib/descriptions/index.jsx

@@ -1,108 +0,0 @@
-import PropTypes from 'ant-design-vue/es/_util/vue-types'
-import Descriptions from 'ant-design-vue/es/descriptions'
-
-import Browse from '../browse/index.jsx'
-import { transferData } from '../../utils/Filter.js'
-
-const {
-  Item: DescriptionsItem
-} = Descriptions
-
-import './index.less'
-
-const descDefaultAttrs = {
-  size: 'middle',
-  bordered: true
-} 
-
-const DescriptionsProps = {
-  title: PropTypes.string,
-  column: PropTypes.oneOfType([PropTypes.number, PropTypes.object]).def(3),
-  descDetails: PropTypes.object,
-  descSettings: PropTypes.array,
-  descAttrs: PropTypes.object,
-}
-
-const renderContent = (h, item, details) => {
-  const CustomTag = item.type === 'file' && Browse || 'span'
-  const data = 
-        item.hasOwnProperty( 'multiProps' ) ?
-        item.multiProps.map( propsItem => transferData(details[propsItem], 'Array') ).flat() :
-        transferData(details[item.props], 'Array')
-  const props = {
-    data,
-    astrictH: 104
-  }
-  return (
-    <CustomTag {...{ props }}>
-      { (item.customRender && item.customRender(details[item.props], details) || details[item.props]) ?? '暂无'}
-    </CustomTag>
-  )
-}
-
-const DescriptionsList = {
-  name: 'Descriptions',
-  props: DescriptionsProps,
-  render(h, content) {
-    const { title, column, descAttrs, descDetails, descSettings, $slots, $scopedSlots } = this
-    return (
-      <div class="Descriptions" ref="Descriptions">
-        <Descriptions
-          title={title}
-          column={column}
-          {...{ attrs: { ...descDefaultAttrs, ...descAttrs } }}
-        >
-          {
-            descSettings.map( (descItem, key) => {
-              return (
-                <DescriptionsItem
-                  key={key}
-                  span={descItem.span ?? 1}
-                >
-                  <span slot="label">
-                    {$slots[`${descItem.props}Lable`] ?? descItem.label}
-                  </span>
-                  {
-                    $scopedSlots[`${descItem.props}`] ?
-                    $scopedSlots[`${descItem.props}`](descDetails) :
-                    renderContent(h, descItem, descDetails)
-                  }  
-                </DescriptionsItem>
-              )
-            } )
-          }
-        </Descriptions>
-      </div>
-    )
-
-  },
-  mounted() {
-    window.addEventListener('resize', this.setDescContentWidth())
-  },
-  methods: {
-    setDescContentWidth() {
-      const elementG = this.$refs.Descriptions.querySelectorAll('.ant-descriptions-item-content')
-      const width = document.querySelector('.ant-descriptions-row').offsetWidth 
-      const labelWidth = document.querySelector('.ant-descriptions-item-label').offsetWidth
-      const { column, descSettings } = this
-      for (let i = 0; i < elementG.length; i++) {
-        const contentWidth = (
-              descSettings[i].span ?
-              width * (descSettings[i].span / column) :
-              width / column ) - labelWidth + 'px'
-        const element = elementG[i]
-        element.style = `
-          width: ${contentWidth};
-          min-width: ${contentWidth};
-          max-width: ${contentWidth};
-        `
-      }
-    }
-  }
-}
-
-DescriptionsList.install = function (Vue) {
-  Vue.component('DescriptionsList', DescriptionsList)
-}
-
-export default DescriptionsList

package/plugins/lib/descriptions/index.less

@@ -1,15 +0,0 @@
-.Descriptions {
-    .ant-descriptions-bordered {
-        .ant-descriptions-item-label {
-            width: 160px;
-            min-width: 160px;
-            max-width: 160px;
-            text-align: left;
-            word-wrap: break-word;
-        }
-    
-        .ant-descriptions-item-content {
-            word-wrap: break-word;
-        }
-    }
-}

package/plugins/lib/form/components/ARadio.vue

@@ -1,74 +0,0 @@
-
-<template>
-    <RadioGroup v-bind="attrs" v-on="$listeners" class="TAntdRadio" v-model="selectChecked">
-        <component 
-            :is="radioType" 
-            v-for="child in $attrs.options" 
-            :key="child[valueKey]" 
-            :value="child[valueKey]"
-        >
-            {{ child[labelKey] }} 
-        </component>  
-    </RadioGroup>
-</template> 
-
-<script>
-
-import { Radio } from 'ant-design-vue'
-
-export default {
-  name: 'TAntdRadio',
-  components: {
-    Radio,
-    RadioGroup: Radio.Group,
-    RadioButton: Radio.Button
-  },
-  props: {
-    value: [String, Number, Boolean],
-    // radio类型为普通或按钮
-    radioType: {
-        type: String,
-        default: 'Radio'
-    },
-    // 传入的option数组中，要作为最终选择项的键值key
-    valueKey: {
-      type: String,
-      default: 'value'
-    },
-    // 传入的option数组中，要作为显示项的键值名称
-    labelKey: {
-      type: String,
-      default: 'label'
-    }
-  },
-  computed: {
-    selectChecked: {
-      get() {
-        return this.value
-      },
-      set(val) {
-        this.$emit('input', val)
-      }
-    },
-    attrs() {
-      const attrs = {
-        ...this.$attrs
-      }
-      delete attrs.options
-      return attrs
-    } 
-  },
-  data() {
-    return {
-    }
-  },
-  mounted() {
-  },
-  methods: {
-  }
-}
-</script>
-
-<style lang="less" scoped>
-</style>
-

package/plugins/lib/form/components/ARangePicker.vue

@@ -1,129 +0,0 @@
-<template>
-  <div class="ADatePicker">
-    <DatePicker
-      v-model="date[0]"
-      v-bind="startPickerAttrs"
-      @openChange="handleStartOpenChange"
-    />
-    ~
-    <DatePicker
-      v-model="date[1]"
-      :open="endOpen"
-      v-bind="endPickerAttrs"
-      @openChange="handleEndOpenChange"
-    />
-  </div>
-</template>
-<script>
-
-const defaultConfig = {
-   showTime: true,
-   format: 'YYYY-MM-DD HH:mm:ss',
-   valueFormat: 'YYYY-MM-DD HH:mm:ss'
-}
-
-import moment from 'moment'
-import { DatePicker } from 'ant-design-vue'
-
-export default {
-  components: { DatePicker },
-  model: {
-    prop: 'value',
-    event: 'update:rangePicker'
-  },
-  data() {
-    return {
-      date: [],
-      endOpen: false
-    }
-  },
-  props: {
-    value: {
-        type: Array,
-        default: () => ([])
-    },
-    /* 开始日期配置项 */
-    startConfig: {
-        type: Object,
-        default: () => ({})
-    },
-    /* 结束日期配置项 */
-    endConfig: {
-        type: Object,
-        default: () => ({})
-    }
-  },
-  watch: {
-    value(newVal, oldVal) {
-      if (newVal.toString() === oldVal.toString()) return
-      this.date = newVal
-    },
-    'date.length': {
-      handler(newLen) {
-        this.$emit('update:rangePicker', newLen == 2 ? this.date : [])
-      },
-      deep: true
-    }
-  },
-  computed: {
-    /* 开始日期 */
-    startPickerAttrs() {
-        return { 
-            ...defaultConfig, 
-            placeholder: '开始日期',
-            disabledDate: this.disabledStartDate,
-            ...this.startConfig
-        }
-    },
-    /* 结束日期 */
-    endPickerAttrs() {
-        return { 
-            ...defaultConfig,
-            placeholder: '结束日期',
-            disabledDate: this.disabledEndDate,
-            ...this.endConfig
-        }
-    }
-  },
-  methods: {
-    disabledStartDate(startValue) {
-      const endValue = this.date[1]
-      if (!startValue || !endValue) {
-        return false
-      }
-      const startDate = moment(startValue, this.startPickerAttrs.valueFormat)
-      const endDate = moment(endValue, this.endPickerAttrs.valueFormat)
-      return startDate.valueOf() > endDate.valueOf()
-    },
-    disabledEndDate(endValue) {
-      const startValue = this.date[0]
-      if (!endValue || !startValue) {
-        return false
-      }
-      const startDate = moment(startValue, this.startPickerAttrs.valueFormat)
-      const endDate = moment(endValue, this.endPickerAttrs.valueFormat)
-      return startDate.valueOf() >= endDate.valueOf()
-    },
-    handleStartOpenChange(open) {
-      if (!open) {
-        this.endOpen = true
-      }
-    },
-    handleEndOpenChange(open) {
-      this.endOpen = open
-    }
-  }
-}
-</script>
-<style lang="less" scoped>
-.ADatePicker {
-  width: 100%;
-  display: flex;
-  align-items: center;
-  gap: 0 6px;
-
-  .ant-calendar-picker {
-    flex: 1;
-  }
-}
-</style>