tianheng-ui 0.0.40 → 0.0.43

package/packages/formMaking/WidgetForm.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="widget-form-container">
-    <div v-if="data.list.length == 0" class="form-empty">{{$t('fm.description.containerEmpty')}}</div>
+    <div v-if="data.list.length == 0" class="form-empty">从左侧拖拽来添加字段</div>
     <el-form :size="data.config.size" label-suffix=":" :label-position="data.config.labelPosition" :label-width="data.config.labelWidth + 'px'">
       
       <draggable class="" 

package/packages/formMaking/WidgetFormItem.vue

@@ -185,7 +185,7 @@
         </template>
 
         <template v-if="element.type=='blank'">
-          <div style="height: 50px;color: #999;background: #eee;line-height:50px;text-align:center;">{{$t('fm.components.fields.blank')}}</div>
+          <div style="height: 50px;color: #999;background: #eee;line-height:50px;text-align:center;">自定义区域</div>
         </template>
 
         <template v-if="element.type == 'text'">

package/packages/formMaking/componentsConfig.js

@@ -1,151 +1,159 @@
 export const basicComponents = [
   {
-    type: 'input',
-    icon: 'icon-input',
+    name: "单行文本",
+    type: "input",
+    icon: "icon-input",
     options: {
-      width: '100%',
-      defaultValue: '',
+      width: "100%",
+      defaultValue: "",
       required: false,
-      dataType: 'string',
-      pattern: '',
-      placeholder: '',
+      dataType: "string",
+      pattern: "",
+      placeholder: "",
       disabled: false,
       maxlength: -1,
-      showWordLimit: false,
+      showWordLimit: false
     }
   },
   {
-    type: 'textarea',
-    icon: 'icon-diy-com-textarea',
+    name: "多行文本",
+    type: "textarea",
+    icon: "icon-diy-com-textarea",
     options: {
-      width: '100%',
-      defaultValue: '',
+      width: "100%",
+      defaultValue: "",
       required: false,
       disabled: false,
-      pattern: '',
-      placeholder: '',
+      pattern: "",
+      placeholder: "",
       maxlength: -1,
-      showWordLimit: false,
+      showWordLimit: false
     }
   },
   {
-    type: 'number',
-    icon: 'icon-number',
+    name: "计数器",
+    type: "number",
+    icon: "icon-number",
     options: {
-      width: '',
+      width: "",
       required: false,
       defaultValue: 0,
-      min: '',
-      max: '',
+      min: "",
+      max: "",
       step: 1,
       disabled: false,
-      controlsPosition: ''
+      controlsPosition: ""
     }
   },
   {
-    type: 'radio',
-    icon: 'icon-radio-active',
+    name: "单选框组",
+    type: "radio",
+    icon: "icon-radio-active",
     options: {
       inline: false,
-      defaultValue: '',
+      defaultValue: "",
       showLabel: false,
       options: [
         {
-          value: 'Option 1',
-          label: 'Option 1'
+          value: "Option 1",
+          label: "Option 1"
         },
         {
-          value: 'Option 2',
-          label: 'Option 2'
+          value: "Option 2",
+          label: "Option 2"
         },
         {
-          value: 'Option 3',
-          label: 'Option 3'
+          value: "Option 3",
+          label: "Option 3"
         }
       ],
       required: false,
-      width: '',
+      width: "",
       remote: false,
       remoteOptions: [],
       props: {
-        value: 'value',
-        label: 'label'
+        value: "value",
+        label: "label"
       },
-      remoteFunc: '',
-      disabled: false,
+      remoteFunc: "",
+      disabled: false
     }
   },
   {
-    type: 'checkbox',
-    icon: 'icon-check-box',
+    name: "多选框组",
+    type: "checkbox",
+    icon: "icon-check-box",
     options: {
       inline: false,
       defaultValue: [],
       showLabel: false,
       options: [
         {
-          value: 'Option 1'
+          value: "Option 1"
         },
         {
-          value: 'Option 2'
+          value: "Option 2"
         },
         {
-          value: 'Option 3'
+          value: "Option 3"
         }
       ],
       required: false,
-      width: '',
+      width: "",
       remote: false,
       remoteOptions: [],
       props: {
-        value: 'value',
-        label: 'label'
+        value: "value",
+        label: "label"
       },
-      remoteFunc: '',
-      disabled: false,
+      remoteFunc: "",
+      disabled: false
     }
   },
   {
-    type: 'time',
-    icon: 'icon-time',
+    name: "时间选择器",
+    type: "time",
+    icon: "icon-time",
     options: {
-      defaultValue: '21:19:56',
+      defaultValue: "21:19:56",
       readonly: false,
       disabled: false,
       editable: true,
       clearable: true,
-      placeholder: '',
-      startPlaceholder: '',
-      endPlaceholder: '',
+      placeholder: "",
+      startPlaceholder: "",
+      endPlaceholder: "",
       isRange: false,
       arrowControl: true,
-      format: 'HH:mm:ss',
+      format: "HH:mm:ss",
       required: false,
-      width: '',
+      width: ""
     }
   },
   {
-    type: 'date',
-    icon: 'icon-date',
+    name: "日期选择器",
+    type: "date",
+    icon: "icon-date",
     options: {
-      defaultValue: '',
+      defaultValue: "",
       readonly: false,
       disabled: false,
       editable: true,
       clearable: true,
-      placeholder: '',
-      startPlaceholder: '',
-      endPlaceholder: '',
-      type: 'date',
-      format: 'yyyy-MM-dd',
+      placeholder: "",
+      startPlaceholder: "",
+      endPlaceholder: "",
+      type: "date",
+      format: "yyyy-MM-dd",
       timestamp: false,
       required: false,
-      width: '',
+      width: ""
     }
   },
   {
-    type: 'rate',
-    icon: 'icon-pingfen1',
+    name: "评分",
+    type: "rate",
+    icon: "icon-pingfen1",
     options: {
       defaultValue: null,
       max: 5,
@@ -155,59 +163,64 @@ export const basicComponents = [
     }
   },
   {
-    type: 'color',
-    icon: 'icon-color',
+    name: "颜色选择器",
+    type: "color",
+    icon: "icon-color",
     options: {
-      defaultValue: '',
+      defaultValue: "",
       disabled: false,
       showAlpha: false,
       required: false
     }
   },
   {
-    type: 'select',
-    icon: 'icon-select',
+    name: "下拉选择框",
+    type: "select",
+    icon: "icon-select",
     options: {
-      defaultValue: '',
+      defaultValue: "",
       multiple: false,
       disabled: false,
       clearable: false,
-      placeholder: '',
+      placeholder: "",
       required: false,
       showLabel: false,
-      width: '',
+      width: "",
       options: [
         {
-          value: 'Option 1'
+          value: "Option 1"
         },
         {
-          value: 'Option 2'
-        },{
-          value: 'Option 3'
+          value: "Option 2"
+        },
+        {
+          value: "Option 3"
         }
       ],
       remote: false,
       filterable: false,
       remoteOptions: [],
       props: {
-        value: 'value',
-        label: 'label'
+        value: "value",
+        label: "label"
       },
-      remoteFunc: ''
+      remoteFunc: ""
     }
   },
   {
-    type: 'switch',
-    icon: 'icon-switch',
+    name: "开关",
+    type: "switch",
+    icon: "icon-switch",
     options: {
       defaultValue: false,
       required: false,
-      disabled: false,
+      disabled: false
     }
   },
   {
-    type: 'slider',
-    icon: 'icon-slider',
+    name: "滑块",
+    type: "slider",
+    icon: "icon-slider",
     options: {
       defaultValue: 0,
       disabled: false,
@@ -217,40 +230,43 @@ export const basicComponents = [
       step: 1,
       showInput: false,
       range: false,
-      width: ''
+      width: ""
     }
   },
   {
-    type: 'text',
-    icon: 'icon-wenzishezhi-',
+    name: "文字",
+    type: "text",
+    icon: "icon-wenzishezhi-",
     options: {
-      defaultValue: 'This is a text',
-      customClass: '',
+      defaultValue: "This is a text",
+      customClass: ""
     }
   }
-]
+];
 
 export const advanceComponents = [
   {
-    type: 'blank',
-    icon: 'icon-zidingyishuju',
+    name: "自定义区域",
+    type: "blank",
+    icon: "icon-zidingyishuju",
     options: {
-      defaultType: 'String'
+      defaultType: "String"
     }
   },
   {
-    type: 'imgupload',
-    icon: 'icon-tupian',
+    name: "图片",
+    type: "imgupload",
+    icon: "icon-tupian",
     options: {
       defaultValue: [],
       size: {
         width: 100,
-        height: 100,
+        height: 100
       },
-      width: '',
-      tokenFunc: 'funcGetToken',
-      token: '',
-      domain: 'https://tcdn.form.making.link/',
+      width: "",
+      tokenFunc: "funcGetToken",
+      token: "",
+      domain: "https://tcdn.form.making.link/",
       disabled: false,
       length: 8,
       multiple: false,
@@ -258,42 +274,45 @@ export const advanceComponents = [
       isDelete: false,
       min: 0,
       isEdit: false,
-      action: 'https://tools-server.making.link/api/transfer'
+      action: "https://tools-server.making.link/api/transfer"
     }
   },
   {
-    type: 'editor',
-    icon: 'icon-fuwenbenkuang',
+    name: "编辑器",
+    type: "editor",
+    icon: "icon-fuwenbenkuang",
     options: {
-      defaultValue: '',
-      width: ''
+      defaultValue: "",
+      width: ""
     }
   },
   {
-    type: 'cascader',
-    icon: 'icon-jilianxuanze',
+    name: "级联选择器",
+    type: "cascader",
+    icon: "icon-jilianxuanze",
     options: {
       defaultValue: [],
-      width: '',
-      placeholder: '',
+      width: "",
+      placeholder: "",
       disabled: false,
       clearable: false,
       remote: true,
       remoteOptions: [],
       props: {
-        value: 'value',
-        label: 'label',
-        children: 'children'
+        value: "value",
+        label: "label",
+        children: "children"
       },
-      remoteFunc: ''
+      remoteFunc: ""
     }
   }
-]
+];
 
 export const layoutComponents = [
   {
-    type: 'grid',
-    icon: 'icon-grid-',
+    name: "栅格布局",
+    type: "grid",
+    icon: "icon-grid-",
     columns: [
       {
         span: 12,
@@ -306,8 +325,8 @@ export const layoutComponents = [
     ],
     options: {
       gutter: 0,
-      justify: 'start',
-      align: 'top'
+      justify: "start",
+      align: "top"
     }
   }
-]
+];

package/packages/formMaking/index.js

@@ -1,39 +1,37 @@
-import VueI18n from 'vue-i18n'
 import 'normalize.css/normalize.css'
-
-import MakingForm from './Container.vue'
-import GenerateForm from './GenerateForm.vue'
-
-import enUS from './lang/en-US'
-import zhCN from './lang/zh-CN'
-
 import './iconfont/iconfont.css'
 import './styles/cover.scss'
 import './styles/index.scss'
 
-const loadLang = function (Vue, lang, locale, i18n) {
-  if (locale) {
-    locale('en-US', {...locale('en-US'), ...enUS})
-    locale('zh-CN', {...locale('zh-CN'), ...zhCN})
-    Vue.config.lang = lang
-  } else if (i18n) {
-    i18n.setLocaleMessage('en-US', {...i18n.messages['en-US'], ...enUS})
-    i18n.setLocaleMessage('zh-CN', {...i18n.messages['zh-CN'], ...zhCN})
-    i18n.locale = lang
-  } else {
-    Vue.use(VueI18n)
-    Vue.locale('en-US', {...Vue.locale('en-US'), ...enUS})
-    Vue.locale('zh-CN', {...Vue.locale('zh-CN'), ...zhCN})
-    Vue.config.lang = lang
-  }
-}
+import MakingForm from './Container.vue'
+import GenerateForm from './GenerateForm.vue'
+
+// import VueI18n from 'vue-i18n'
+// import enUS from './lang/en-US'
+// import zhCN from './lang/zh-CN'
+// const loadLang = function (Vue, lang, locale, i18n) {
+//   if (locale) {
+//     locale('en-US', {...locale('en-US'), ...enUS})
+//     locale('zh-CN', {...locale('zh-CN'), ...zhCN})
+//     Vue.config.lang = lang
+//   } else if (i18n) {
+//     i18n.setLocaleMessage('en-US', {...i18n.messages['en-US'], ...enUS})
+//     i18n.setLocaleMessage('zh-CN', {...i18n.messages['zh-CN'], ...zhCN})
+//     i18n.locale = lang
+//   } else {
+//     Vue.use(VueI18n)
+//     Vue.locale('en-US', {...Vue.locale('en-US'), ...enUS})
+//     Vue.locale('zh-CN', {...Vue.locale('zh-CN'), ...zhCN})
+//     Vue.config.lang = lang
+//   }
+// }
 
 MakingForm.install = function (Vue, opts = {
   lang: 'zh-CN',
   locale: null,
   i18n: null
 }) {
-  loadLang(Vue, opts.lang, opts.locale, opts.i18n)
+  // loadLang(Vue, opts.lang, opts.locale, opts.i18n)
   Vue.component(MakingForm.name, MakingForm)
 }
 
@@ -42,7 +40,7 @@ GenerateForm.install = function (Vue, opts = {
   locale: null,
   i18n: null
 }) {
-  loadLang(Vue, opts.lang, opts.locale, opts.i18n)
+  // loadLang(Vue, opts.lang, opts.locale, opts.i18n)
   Vue.component(GenerateForm.name, GenerateForm)
 }
 
@@ -56,7 +54,7 @@ const install = function (Vue, opts = {
   locale: null,
   i18n: null
 }) {
-  loadLang(Vue, opts.lang, opts.locale, opts.i18n)
+  // loadLang(Vue, opts.lang, opts.locale, opts.i18n)
   components.forEach(component => {
     Vue.component(component.name, component)
   })