web-component-gallery 1.3.12 → 2.0.2

package/plugins/lib/form/style/Model.less

@@ -1,53 +0,0 @@
-
-.FormModel {
-  display: flex;
-  flex-wrap: wrap;
-
-  &__LabelTips {
-    width: 100%;
-  }
-
-  .ant-select,
-  .ant-input-number,
-  .ant-calendar-picker { 
-    width: 100% !important;
-  }
-
-  .ant-form-item-children {
-    display: flex;
-    align-items: center;
-  }
-
-  .FormLine {
-    display: flex;
-
-    :deep(.ant-form-item-label) {
-      width: 85px;
-      text-align: right;
-    }
-
-    :deep(.ant-form-item-control-wrapper) {
-      width: calc(100% - 85px);
-    }
-  }
-
-  .FormLineVertical {
-    display: flex;
-    flex-direction: column;
-
-    :deep(.ant-form-item-label) {
-      text-align: left;
-      width: 100%;
-    }
-
-    :deep(.ant-form-item-control-wrapper) {
-      width: 100%;
-    }
-  }
-
-  .MultipleForm {
-    display: flex;
-    flex-wrap: wrap;
-    align-items: center;
-  }
-}

package/plugins/lib/form/utils/resetFields.js

@@ -1,16 +0,0 @@
-/** 根据属性类型重置数据初始化 */
-export function resetFields(formObj) {
-    const initialForm = {}
-    for (const key in formObj) {
-        if ( formObj[key] === null || typeof formObj[key] !== 'object') {
-            initialForm[key] = ''
-        }
-        else if( Array.isArray(formObj[key]) ) {
-            initialForm[key] = []
-        }
-        else { initialForm[key] = {} }
-    }
-    return initialForm
-}
-
-export default resetFields

package/plugins/lib/iframe/events.js

@@ -1,2 +0,0 @@
-import Vue from 'vue'
-export default new Vue()

package/plugins/lib/iframe/index.jsx

@@ -1,234 +0,0 @@
-import PropTypes from 'ant-design-vue/es/_util/vue-types'
-
-import Modal from '../modal/index.jsx'
-
-import { Spin, Icon } from 'ant-design-vue'
-
-// const IconFont = Icon.createFromIconfontCN({
-//   scriptUrl: '//at.alicdn.com/t/c/font_4641025_trbtf28ob8g.js'
-// })
-
-// Spin.setDefaultIndicator({
-//   indicator: {
-//     render() {
-//       return <IconFont type="icon-loading" />
-//     }
-//   }
-// })
-
-Spin.setDefaultIndicator({
-  indicator: {
-    render() {
-      return <Icon type="loading" />
-    }
-  }
-})
-
-import IframeEvent from './events.js'
-
-import './index.less'
-
-const IframeContainerProps = {
-  activeKey: PropTypes.string,
-  checkedKey: PropTypes.string.def('name'), 
-  linkurlKey: PropTypes.string.def('linkUrl'),
-  operatesArr: PropTypes.array,
-  componentsArr: PropTypes.array,
-  postMessage: PropTypes.object
-}
-
-const IframeContainer = {
-  name: 'IframeComp',
-  props: IframeContainerProps,
-  data () {
-    return {
-      /** 页面加载状态 */
-      compSpinning: true,
-      componentAdd: true,
-      /** 弹窗加载状态 */
-      modalSpinning: true,
-      modalComponents: {}
-    }
-  },
-  render(h, content) {
-    const { $props, modalComponents } = this
-
-    const { activeKey, checkedKey, componentsArr } = $props
-
-    const IframeComponents = componentsArr.map(componentItem => {
-      const isActive = activeKey === componentItem[checkedKey]
-      return this.getIframeComponent( componentItem, isActive )
-    })
-
-    const modalKeys = Object.keys(modalComponents)
-
-    const ModalOperates = modalKeys.map(modalKey => { 
-      return (
-        <Modal
-          {...{ 
-            props: { 
-              ...modalComponents[modalKey],
-              cancelHandle: () => this.closeModalHandle(modalKey)
-            }
-          }}>
-            <Spin spinning={this.modalSpinning} tip="加载中...">
-              { this.getIframeComponent(modalComponents[modalKey], true) }
-            </Spin>
-        </Modal>
-      )
-    })
-
-    return (
-      <div class="ant-pro-grid-content-page">
-        <Spin spinning={this.compSpinning} tip="加载中...">
-          {IframeComponents}
-        </Spin>
-        {ModalOperates}
-      </div>
-    )
-
-  },
-  watch: {
-    activeKey(newVal) {
-      this.modalComponents = {}
-    },
-    componentsArr: {
-      handler(newVal, oldVal) {
-        this.componentAdd = newVal.length > oldVal.length
-        this.postCompMessage()
-      },
-      deep: true
-    }
-  },
-  computed: {
-    activeKeyAndParams() {
-      const {activeKey, postMessage, componentsArr} = this
-      return {
-        activeKey,
-        postMessage,
-        componentsArr
-      }
-    }
-  },
-  created() {
-    IframeEvent.$on('modalOpen', ({ name, params }) => {
-      const activeModal = this.switchModalHandle(name, params)
-      activeModal && (
-        this.componentAdd = true,
-        this.$set(
-          this.modalComponents, name, {
-          mode: params.mode,
-          visible: true,
-          ...activeModal
-        }) 
-      )
-    }) 
-    IframeEvent.$on('modalClose', ({ name, params }) => {
-      this.closeModalHandle(name)
-      params && (
-        this.componentAdd = false,
-        this.postCompMessage(params)
-      )
-    })
-    IframeEvent.$on('modalGoBack', ({ name, params }, closeModal) => {
-      this.componentAdd = false
-      this.closeModalHandle(closeModal)
-      this.switchModalHandle(name, params)
-    }) 
-  },
-  mounted() {
-    // this.postCompMessage()
-  },
-  methods: {
-    postCompMessage(data = {}) {
-      const { componentsArr, activeKey, postMessage } = this
-      componentsArr.length && 
-      this.postIframeMessage(componentsArr, {
-        type: 'refreshPage',
-        activeKey,
-        data
-      })
-    },
-    closeModalHandle(name) {
-      this.modalComponents[name].visible = false
-      delete this.modalComponents[name]
-    },
-    switchModalHandle(name, data) {
-      const { operatesArr, checkedKey } = this
-      const activeModal = operatesArr.find( operatesItem => operatesItem[checkedKey] === name )
-      activeModal && this.postIframeMessage(operatesArr, {
-        type: 'refreshModal',
-        activeKey: name,
-        data
-      })
-      return {...activeModal, ...(data.attrs ?? {})}
-    },
-    postIframeMessage(components, iframeConfig) {
-      const { type, activeKey, data = {} } = iframeConfig
-
-      this.$nextTick(() => {
-
-        const { checkedKey, linkurlKey, postMessage } = this
-        const activeComp = components.find(componentsItem => activeKey === componentsItem[checkedKey])
-        const refKey = activeComp[linkurlKey]
-        const isModal = refKey.includes('?type=modal')
-        const spinningKey = isModal ? 'modalSpinning' : 'compSpinning'
-
-        const iframeRef = () => {
-          const _self = this
-          const iframe = this.$refs[refKey]
-          const iframeWin = this.$refs[refKey]?.contentWindow
-          const iframeOptions = {
-            type, 
-            params: {
-              data,
-              name: activeKey,
-              title: isModal ? activeComp.title : activeComp.meta?.title,
-              routeQuery: postMessage
-            }
-          }
-
-          this.componentAdd ? (
-          this[spinningKey] = true,
-          iframe.onload = function() {
-            _self[spinningKey] = false
-            iframeWin.postMessage(iframeOptions, '*')
-          } ) :
-          iframeWin.postMessage(iframeOptions, '*')
-        }
-
-        if(isModal) {
-          const timer = setTimeout( () => {
-            iframeRef()
-            clearTimeout(timer)
-          }, 0 )
-          return
-        }
-        iframeRef()
-      }) 
-    },
-    getIframeComponent(componentItem, isActive) {
-      const { linkurlKey, checkedKey } = this
-      return (
-        <iframe
-          width="100%"
-          height="100%"
-          ref={componentItem[linkurlKey]}
-          src={componentItem[linkurlKey]}
-          key={componentItem[checkedKey]}
-          style={{
-            border: 'none',
-            display: isActive ? 'block' : 'none'
-          }}
-        />
-      )
-    }
-  }
-}
-
-IframeContainer.install = function (Vue) {
-  Vue.prototype.$IframeBus = IframeEvent
-  Vue.component('IframePage', IframeContainer)
-}
-
-export default IframeContainer

package/plugins/lib/iframe/index.less

@@ -1,19 +0,0 @@
-@import '~ant-design-vue/lib/style/themes/default.less';
-
-.ant-pro-grid-content-page,
-.ant-spin-nested-loading,
-.ant-spin-container {
-    width: 100%;
-    height: 100%;
-}
-
-.ant-spin-nested-loading > div > .ant-spin {
-    .ant-spin-dot {
-        font-size: 48px;
-    }
-    .ant-spin-text.ant-spin-text {
-        top: 60%;
-        padding-left: 36px;
-        font-size: @font-size-lg;
-    }
-}

package/plugins/lib/index.js

@@ -1,72 +0,0 @@
-// 按需引入ant-design-vue必要指令组件
-// import './lazy_use'
-
-// 将组件库中定义的所有组件引入并导出
-import Table from './table' 
-import FormComp,{ Model, Search } from './form' 
-import Button from './button' 
-import Avatar from './avatar' 
-import SvgIcon from './svgIcon' 
-import { Tree, Directory } from './tree'
-import DateTime from './dateTime'
-import Weather from './weather'
-import MultiTab from './multiTab'
-import IframePage from './iframe/index.jsx'
-import Modal from './modal/index.jsx'
-import AmapComp,{ AmapDraw } from './amap'
-import Brower from './browse/index.jsx'
-import DescriptionsList from './descriptions/index.jsx'
- 
-const components = {
-  Table,
-  Model,
-  Search,
-  FormComp,
-  Button,
-  Avatar,
-  SvgIcon,
-  Tree,
-  Directory,
-  DateTime,
-  Weather,
-  MultiTab,
-  IframePage,
-  Modal,
-  AmapComp,
-  AmapDraw,
-  Brower,
-  DescriptionsList
-}
-
-const install = function (Vue) { 
-  if (install.installed) return
-  Object.keys(components).forEach(component => { 
-    Vue.component(components[component].name, components[component])
-  })
-}
-
-export {
-  Table,
-  Model,
-  Search,
-  FormComp,
-  Button,
-  Avatar,
-  SvgIcon,
-  Tree,
-  Directory,
-  DateTime,
-  Weather,
-  MultiTab,
-  IframePage,
-  Modal,
-  AmapComp,
-  AmapDraw,
-  Brower,
-  DescriptionsList
-}
-
-export default {
-  install,
-  ...components
-}

package/plugins/lib/lazy_use.js

@@ -1,40 +0,0 @@
-
-import {
-  Input,
-  InputNumber,
-  Checkbox,
-  DatePicker,
-  TimePicker,
-  Cascader,
-  Radio,
-  Select,
-  Upload,
-  Modal,
-  message,
-  notification
-} from 'ant-design-vue'
-
-/** 按需加载antDesignVue */
-export default {
-  install(Vue) {
-    
-    Vue.use(Input)
-    Vue.use(InputNumber)
-    Vue.use(Radio)
-    Vue.use(Checkbox)
-    Vue.use(Select)
-    Vue.use(DatePicker)
-    Vue.use(TimePicker)
-    Vue.use(Upload)
-    Vue.use(Cascader)
-    Vue.use(Modal)
-    
-    Vue.prototype.$confirm = Modal.confirm
-    Vue.prototype.$message = message
-    Vue.prototype.$notification = notification
-    Vue.prototype.$info = Modal.info
-    Vue.prototype.$success = Modal.success
-    Vue.prototype.$error = Modal.error
-    Vue.prototype.$warning = Modal.warning
-  }
-}

package/plugins/lib/modal/index.jsx

@@ -1,53 +0,0 @@
-import PropTypes from 'ant-design-vue/es/_util/vue-types'
-
-import Modal from 'ant-design-vue/es/modal'
-import './index.less'
-
-const ModalProps = {
-  mode: PropTypes.string.def('small'),
-  title: PropTypes.string.def('标题'),
-  visible: PropTypes.bool.def(false),
-  cancelHandle: PropTypes.func,
-  attrs: PropTypes.object.def({})
-} 
-
-const ModalComp = {
-  name: 'ModalComp',
-  props: ModalProps, 
-  functional: true, 
-  render(h, content) { 
-
-    const { props, children } = content
-
-    const attrs = Object.assign({
-      width: null,
-      footer: null,
-      keyboard: false,
-      maskClosable: false
-    }, props.attrs)
-
-    delete props.attrs
-
-    props.mode == 'screen' && delete props.title
-
-    return (
-      <Modal 
-        {...{ props, attrs, on: { cancel: props.cancelHandle } }} 
-        wrapClassName={`AntModal__${props.mode}`}
-      >
-        { children }
-      </Modal>
-    )
-
-  },
-  mounted() {
-  },
-  methods: {
-  }
-}
-
-ModalComp.install = function (Vue) {
-  Vue.component('ModalComp', ModalComp)
-}
-
-export default ModalComp

package/plugins/lib/modal/index.less

@@ -1,50 +0,0 @@
-@import '../style/mixins.less';
-
-.AntModal__small {
-    .ant-modal {
-       .layout( 712px, 640px );
-    }
-} 
-
-.AntModal__middle {
-    .ant-modal {
-       .layout( 1104px, 848px );
-    }
-}
-
-.AntModal__large {
-    .ant-modal {
-       .layout( 1600px, 848px );
-    }
-}
-
-.AntModal__max {
-    .ant-modal {
-       .layout( 100%, 100% );
-       top: 0;
-    }
-}
-
-.AntModal__screen {
-    .ant-modal {
-       .layout( 100%, 100% );
-       top: 0;
-       padding: 0;
-
-       &-body {
-           padding: 0;
-       }
-    }
-}
-
-.ant-modal {
-    &-content {
-        display: flex;
-        flex-direction: column;
-        height: 100%;
-    }
-    &-body {
-        flex: 1;
-        // padding: 0;
-    }
-}

package/plugins/lib/multiTab/APIEnums.js

@@ -1,17 +0,0 @@
-export const TAB_BINDING = {
-  TAB_CLOSE: 'hook:tab:ck',
-  TAB_CLOSE_ALL: 'hook:tab:ca',
-  TAB_CLOSE_LEFT: 'hook:tab:cl',
-  TAB_CLOSE_RIGHT: 'hook:tab:cr',
-  TAB_CLOSE_OTHER: 'hook:tab:co',
-  TAB_NAME: 'hook:tab:rename',
-  TAB_ACTIVE: 'hook:tab:active'
-}
-
-export const ROUTE_BINDING = {
-  R_OPEN: 'hook:open',
-  R_CLOSE: 'hook:close',
-  R_ACTIVE: 'hook:active',
-  R_REFRESH: 'hook:refresh',
-  R_GET_CACHES: 'hook:caches'
-}