meixioacomponent 0.4.36 → 0.4.39

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "meixioacomponent",
-  "version": "0.4.36",
+  "version": "0.4.39",
   "private": false,
   "author": "YuRi",
   "main": "lib/meixioacomponent.umd.min.js",

package/packages/components/base/baseNumberInput/index.js

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

package/packages/components/base/baseNumberInput/index.vue

@@ -0,0 +1,95 @@
+<template>
+  <div class="pro-number-wrap">
+    <el-input-number
+      :size="size"
+      ref="target"
+      :controls="false"
+      :class="{
+        unit: unit,
+      }"
+      :precision="precision"
+      v-model.number="module"
+      :disabled="disabled"
+      :maxlength="maxlength"
+      style="width: 100%; height: 100%;"
+    ></el-input-number>
+    <div class="number-unit" v-if="unit">
+      <span>{{ unit }}</span>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'baseNumberInput',
+  data() {
+    return {}
+  },
+  props: {
+    value: {},
+    precision: {
+      default: 0,
+    },
+    unit: {},
+
+    disabled: {
+      default: false,
+    },
+
+    maxlength: {},
+
+    size: {},
+  },
+  computed: {
+    module: {
+      set(val) {
+        this.$emit('input', val)
+      },
+      get() {
+        return this.$props.value
+      },
+    },
+  },
+  methods: {
+    focus() {
+      this.$refs.target.focus()
+    },
+  },
+}
+</script>
+
+<style lang="less" scoped>
+.pro-number-wrap {
+  width: 100%;
+  display: flex;
+  position: relative;
+  justify-items: center;
+  &:hover {
+    border-color: var(--color-primary);
+  }
+  .unit {
+    width: calc(100%);
+    border-radius: inherit;
+    /deep/ input {
+      padding-right: 34px !important;
+    }
+  }
+
+  .number-unit {
+    width: 28px;
+    height: 28px;
+    right: 2px;
+    top: 50%;
+    transform: translateY(-50%);
+    text-align: center;
+    line-height: 28px;
+    position: absolute;
+    background: var(--color-gray-d);
+    span {
+      color: var(--font-color-d);
+      font-size: var(--font-size-s);
+      font-weight: var(--font-weight-g);
+    }
+  }
+}
+</style>

package/packages/components/index.js

@@ -37,6 +37,7 @@ import baseTreeSelect from './base/baseTreeSelect'
 import baseUploadTemplate from './base/baseUploadTemplate'
 import VueCropper from 'vue-cropper'
 import baseList from './base/baseList'
+import baseNumberInput from './base/baseNumberInput'
 // js 文件相关
 import Theme from '../config/theme/theme'
 import DynamicMount from './dynamicmount/index.js'
@@ -89,7 +90,8 @@ const meixicomponents = [
   basePopoverButton,
   baseTreeSelect,
   baseUploadTemplate,
-  baseList
+  baseList,
+  baseNumberInput
 ]
 
 const install = (Vue) => {
@@ -145,6 +147,7 @@ export default {
   basePopoverButton,
   baseTreeSelect,
   baseUploadTemplate,
+  baseNumberInput,
   Theme,
   SelectStore,
   useImg,

package/packages/components/proForm/dialogForm/baseDialogForm.vue

@@ -169,6 +169,7 @@ export default {
   },
   methods: {
     createSlots() {
+      this.slotList=[];
       for (let i = 0; i < this.module.length; i++) {
         let item = this.module[i]
         for (let j = 0; j < item.formList.length; j++) {
@@ -202,6 +203,9 @@ export default {
           this.$set(formItem, 'renderHide', result)
         } else if (type == 'disable') {
           this.$set(formItem, 'disabled', result)
+        } else if (type == 'template') {
+          formItem.type = result
+          this.createSlots()
         }
       }
     },

package/packages/components/proForm/proForm/pro_form.vue

@@ -396,6 +396,8 @@ export default {
             this.$set(formItem, 'renderHide', result)
           } else if (type == 'disable') {
             this.$set(formItem, 'disabled', result)
+          } else if (type == 'template') {
+            formItem.type = result
           }
         }
       }

package/packages/components/proForm/proForm/pro_form_item.vue

@@ -83,45 +83,28 @@
         style="width: 100%; height: 100%;"
       ></el-input>
       <!-- 数字类型无小数 -->
-      <div class="pro-number-wrap" v-else-if="config.type == 'number'">
-        <el-input-number
-          ref="target"
-          :size="size"
-          :class="{
-            unit: config.unit,
-          }"
-          :controls="false"
-          v-model.number="module"
-          :disabled="isDisabled"
-          :maxlength="config.maxlength"
-          style="width: 100%; height: 100%;"
-        ></el-input-number>
-
-        <div class="number-unit" v-if="config.unit">
-          <span>{{ config.unit }}</span>
-        </div>
-      </div>
+      <BaseNumberInput
+        v-else-if="config.type == 'number'"
+        ref="target"
+        :size="size"
+        v-model="module"
+        :unit="config.unit"
+        :disabled="isDisabled"
+        :maxlength="config.maxlength"
+      ></BaseNumberInput>
 
       <!--数字类型两位小数  -->
 
-      <div class="pro-number-wrap" v-else-if="config.type == 'number2'">
-        <el-input-number
-          :size="size"
-          ref="target"
-          :precision="2"
-          :controls="false"
-          :class="{
-            unit: config.unit,
-          }"
-          v-model.number="module"
-          :disabled="isDisabled"
-          :maxlength="config.maxlength"
-          style="width: 100%; height: 100%;"
-        ></el-input-number>
-        <div class="number-unit" v-if="config.unit">
-          <span>{{ config.unit }}</span>
-        </div>
-      </div>
+      <BaseNumberInput
+        v-else-if="config.type == 'number2'"
+        ref="target"
+        :size="size"
+        v-model="module"
+        :precision="2"
+        :unit="config.unit"
+        :disabled="isDisabled"
+        :maxlength="config.maxlength"
+      ></BaseNumberInput>
 
       <!-- select选择器 -->
       <el-select
@@ -240,6 +223,7 @@
 <script>
 //
 import componentConfig from '../../../config/componentConfig'
+import BaseNumberInput from '../../base/baseNumberInput/index.vue'
 export default {
   data() {
     return {
@@ -270,7 +254,6 @@ export default {
     config: {
       type: Object,
     },
-
     form: {
       type: Boolean,
       default: false,
@@ -279,19 +262,15 @@ export default {
       type: String,
       default: `right`,
     },
-
     value: {},
-
     size: {
       type: String,
       default: 'small',
     },
-
     width: {
       type: String,
     },
   },
-
   computed: {
     isDisabled() {
       const { config, disabled } = this.$props
@@ -306,15 +285,12 @@ export default {
     selectStore() {
       return componentConfig.selectStore.getStore(this.$props.config.useStore)
     },
-
     selectData() {
       return this.selectStore.getData()
     },
-
     selectConfig() {
       return this.selectStore.getConfig()
     },
-
     spContentType() {
       let configType = this.$props.config.type
       if (
@@ -327,24 +303,19 @@ export default {
       }
       return false
     },
-
     typeOftemplate() {
       const { type } = this.$props.config
-
       if (type == 'template' || type == 'area') {
         return true
       }
-
       return false
     },
-
     contentValue() {
       let type = this.$props.config.type
       switch (type) {
         case 'input':
         case 'textarea':
           return this.module
-
         case 'select':
           let list = this.selectData
           const selectConfig = this.selectConfig
@@ -354,7 +325,6 @@ export default {
                 let index = list.findIndex((item) => {
                   return item[`${selectConfig.value}`] == this.module
                 })
-
                 return list[index][`${selectConfig.label}`]
               } else {
                 return '暂无数据'
@@ -365,7 +335,6 @@ export default {
                 let index = list.findIndex((citem) => {
                   return citem[`${selectConfig.value}`] == item
                 })
-
                 text += text
                   ? ` / ${list[index][`${selectConfig.label}`]}`
                   : list[index][`${selectConfig.label}`]
@@ -376,7 +345,6 @@ export default {
             this.loadSelectData()
             return this.$props.config.value
           }
-
         // case "time":
         //   if (this.module) {
         //     let config = this.$props.config;
@@ -385,12 +353,10 @@ export default {
         //   } else {
         //     return "暂无时间";
         //   }
-
         default:
           return this.module
       }
     },
-
     datePickPlace() {
       const { datePickPlace } = this.$props.config
       if (!datePickPlace || datePickPlace.length < 2) {
@@ -398,21 +364,17 @@ export default {
       }
       return datePickPlace
     },
-
     type() {
       return this.$props.config.type
     },
-
     checkMax() {
       let max = this.$props.config.max
       return max ? max : this.$props.config.list.length
     },
-
     checkMin() {
       let min = this.$props.config.min
       return min < 0 || min == undefined || min == null ? 0 : min
     },
-
     isDatePick() {
       return (
         this.type == 'time' ||
@@ -420,7 +382,6 @@ export default {
         this.type == 'daterange'
       )
     },
-
     module: {
       get() {
         let type = this.$props.config.type
@@ -429,7 +390,6 @@ export default {
             this.loadSelectData()
           }
         }
-
         return this.$props.value
       },
       set(val) {
@@ -505,7 +465,6 @@ export default {
           type: item.type,
           result: item.fn(val),
         }
-
         console.log(val)
         this.$emit('disableWatcherResult', obj)
       })
@@ -516,6 +475,7 @@ export default {
       this.init()
     },
   },
+  components: { BaseNumberInput },
 }
 </script>
 
@@ -675,36 +635,4 @@ export default {
     min-height: 24px;
   }
 }
-.pro-number-wrap {
-  width: 100%;
-  display: flex;
-  position: relative;
-  justify-items: center;
-  &:hover {
-    border-color: var(--color-primary);
-  }
-  .unit {
-    width: calc(100%);
-    border-radius: inherit;
-    /deep/ input {
-      padding-right: 34px !important;
-    }
-  }
-
-  .number-unit {
-    width: 28px;
-    height: 28px;
-    right: 2px;
-    top: 50%;
-    transform: translateY(-50%);
-    text-align: center;
-    line-height: 28px;
-    position: absolute;
-    background: var(--color-gray-d);
-    span {
-      font-size: var(--font-color-d);
-      font-weight: var(--font-weight-g);
-    }
-  }
-}
 </style>

package/src/component/test.vue

@@ -555,9 +555,13 @@ export default {
     :modallAppendToBody="false"
     :footerHandleConfig="footerHandleConfig"
   >
-    <template slot="formWrap-test2">
-      <div style="width: 100%; height: 100px; background: red;"></div>
+    <template v-slot:formslot-test1="data">
+      <el-input v-model="data.scope[0].value"></el-input>
     </template>
+
+    <!-- <template slot="formWrap-test2">
+      <div style="width: 100%; height: 100px; background: red;"></div>
+    </template> -->
   </base-dialog-form>
 </template>
 
@@ -606,8 +610,9 @@ export default {
             },
             {
               key: 'test3',
-              type: 'number',
-     
+              type: 'number2',
+              unit: '元',
+
               disabled: false,
               value: 17490,
               color: 'warn',
@@ -626,77 +631,7 @@ export default {
               type: 'daterange',
               disabled: false,
               label: '下次联系时间',
-              datePickPlace:['开始时间','至','结束时间'],
-            },
-            {
-              value: [2],
-              key: 'test6',
-              type: 'select',
-              disabled: false,
-              label: '商机状态组',
-              multipleLimit: 2,
-              useStore: 'testSelectStore',
-            },
-            {
-              value: 2,
-              key: 'test7',
-              type: 'select',
-              disabled: false,
-              label: '商机阶段',
-              useStore: 'testSelectStore',
-            },
-            {
-              value: '',
-              key: 'test8',
-              type: 'textarea',
-              disabled: false,
-              label: '备注',
-            },
-          ],
-        },
-        {
-          formType: 'template',
-          key: 'test2',
-          formTitle: '基本信息',
-          formList: [
-            {
-              value: '签约行业',
-              key: 'test1',
-              type: 'input',
-              disabled: true,
-              label: '商机名称',
-            },
-            {
-              key: 'test2',
-              type: 'input',
-              disabled: false,
-              label: '客户名称',
-              value: '河南郑州建设股份有限公司 ',
-              click: (formItem) => {
-                console.log(formItem)
-              },
-            },
-            {
-              key: 'test3',
-              type: 'input',
-              disabled: false,
-              value: 17490,
-              color: 'warn',
-              label: '商机金额',
-            },
-            {
-              value: '',
-              key: 'test4',
-              type: 'time',
-              disabled: false,
-              label: '预计成交日期',
-            },
-            {
-              value: '',
-              key: 'test5',
-              type: 'time',
-              disabled: false,
-              label: '下次联系时间',
+              datePickPlace: ['开始时间', '至', '结束时间'],
             },
             {
               value: [2],
@@ -724,19 +659,89 @@ export default {
             },
           ],
         },
-        {
-          key: 'test3',
-          formTitle: '测试活动图片',
-          formType: 'upload',
-          max: 3,
-          formList: [
-            {
-              value: [],
-              key: 'test1',
-              label: '图片上传',
-            },
-          ],
-        },
+        // {
+        //   formType: 'template',
+        //   key: 'test2',
+        //   formTitle: '基本信息',
+        //   formList: [
+        //     {
+        //       value: '签约行业',
+        //       key: 'test1',
+        //       type: 'input',
+        //       disabled: true,
+        //       label: '商机名称',
+        //     },
+        //     {
+        //       key: 'test2',
+        //       type: 'input',
+        //       disabled: false,
+        //       label: '客户名称',
+        //       value: '河南郑州建设股份有限公司 ',
+        //       click: (formItem) => {
+        //         console.log(formItem)
+        //       },
+        //     },
+        //     {
+        //       key: 'test3',
+        //       type: 'input',
+        //       disabled: false,
+        //       value: 17490,
+        //       color: 'warn',
+        //       label: '商机金额',
+        //     },
+        //     {
+        //       value: '',
+        //       key: 'test4',
+        //       type: 'time',
+        //       disabled: false,
+        //       label: '预计成交日期',
+        //     },
+        //     {
+        //       value: '',
+        //       key: 'test5',
+        //       type: 'time',
+        //       disabled: false,
+        //       label: '下次联系时间',
+        //     },
+        //     {
+        //       value: [2],
+        //       key: 'test6',
+        //       type: 'select',
+        //       disabled: false,
+        //       label: '商机状态组',
+        //       multipleLimit: 2,
+        //       useStore: 'testSelectStore',
+        //     },
+        //     {
+        //       value: 2,
+        //       key: 'test7',
+        //       type: 'select',
+        //       disabled: false,
+        //       label: '商机阶段',
+        //       useStore: 'testSelectStore',
+        //     },
+        //     {
+        //       value: '',
+        //       key: 'test8',
+        //       type: 'textarea',
+        //       disabled: false,
+        //       label: '备注',
+        //     },
+        //   ],
+        // },
+        // {
+        //   key: 'test3',
+        //   formTitle: '测试活动图片',
+        //   formType: 'upload',
+        //   max: 3,
+        //   formList: [
+        //     {
+        //       value: [],
+        //       key: 'test1',
+        //       label: '图片上传',
+        //     },
+        //   ],
+        // },
       ],
       rulesList: {},
       footerHandleConfig: [],
@@ -751,7 +756,7 @@ export default {
         effects: [
           {
             key: 'test1',
-            type: 'hide',
+            type: 'template',
             fn: this.hideMenuTypeOfButton,
           },
         ],
@@ -799,7 +804,10 @@ export default {
   props: { index: {} },
   methods: {
     hideMenuTypeOfButton(val) {
-      return val == 1
+      if (val == 1) {
+        return 'input'
+      }
+      return 'template'
     },
   },
 }