tianheng-ui 0.0.42 → 0.0.45

package/package.json

@@ -1,58 +1,65 @@
-{
-  "name": "tianheng-ui",
-  "description": "A Vue.js project",
-  "version": "0.0.42",
-  "author": "shu lang <403732931@qq.com>",
-  "license": "MIT",
-  "private": false,
-  "main": "./lib/tianheng-ui.js",
-  "scripts": {
-    "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
-    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
-  },
-  "dependencies": {
-    "ace-builds": "^1.4.13",
-    "axios": "^0.27.2",
-    "clipboard": "^2.0.11",
-    "element-ui": "^2.15.6",
-    "normalize.css": "^8.0.1",
-    "nprogress": "^0.2.0",
-    "viewerjs": "^1.10.5",
-    "vue": "^2.5.11",
-    "vue-i18n": "^5.0.3",
-    "vue-router": "^3.5.3",
-    "vuedraggable": "^2.24.3"
-  },
-  "browserslist": [
-    "> 1%",
-    "last 2 versions",
-    "not ie <= 8"
-  ],
-  "devDependencies": {
-    "babel-core": "^6.26.0",
-    "babel-loader": "^7.1.2",
-    "babel-preset-env": "^1.6.0",
-    "babel-preset-stage-3": "^6.24.1",
-    "cross-env": "^5.0.5",
-    "css-loader": "^0.28.7",
-    "file-loader": "^1.1.4",
-    "node-sass": "^4.5.3",
-    "less": "^3.9.0",
-    "less-loader": "^4.1.0",
-    "sass-loader": "^6.0.6",
-    "vue-loader": "^13.0.5",
-    "vue-template-compiler": "^2.4.4",
-    "webpack": "^3.6.0",
-    "webpack-dev-server": "^2.9.1"
-  },
-  "files": [
-    "lib",
-    "packages"
-  ],
-  "homepage": "http://element.eleme.io",
-  "keywords": [
-    "tianheng",
-    "tianheng-ui"
-  ],
-  "style": "lib/theme-chalk/index.css"
-}
+{
+  "name": "tianheng-ui",
+  "description": "A Vue.js project",
+  "version": "0.0.45",
+  "author": "shu lang <403732931@qq.com>",
+  "license": "MIT",
+  "private": false,
+  "main": "./lib/tianheng-ui.js",
+  "scripts": {
+    "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
+    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
+  },
+  "dependencies": {
+    "ace-builds": "^1.4.13",
+    "axios": "^0.27.2",
+    "clipboard": "^2.0.11",
+    "element-ui": "^2.15.6",
+    "normalize.css": "^8.0.1",
+    "nprogress": "^0.2.0",
+    "viewerjs": "^1.10.5",
+    "vue": "^2.5.11",
+    "vue-i18n": "^5.0.3",
+    "vue-router": "^3.5.3",
+    "vue2-editor": "^2.10.3",
+    "vuedraggable": "^2.24.3"
+  },
+  "browserslist": [
+    "> 1%",
+    "last 2 versions",
+    "not ie <= 8"
+  ],
+  "devDependencies": {
+    "@babel/core": "^7.0.0",
+    "@babel/plugin-proposal-class-properties": "^7.0.0",
+    "@babel/plugin-proposal-json-strings": "^7.0.0",
+    "@babel/plugin-syntax-dynamic-import": "^7.0.0",
+    "@babel/plugin-syntax-import-meta": "^7.0.0",
+    "@babel/preset-env": "^7.0.0",
+    "@types/ace": "0.0.42",
+    "babel-loader": "^8.2.5",
+    "cross-env": "^5.0.5",
+    "css-loader": "^0.28.7",
+    "file-loader": "^1.1.4",
+    "less": "^3.9.0",
+    "less-loader": "^4.1.0",
+    "sass": "^1.26.5",
+    "sass-loader": "^7.3.1",
+    "uglifyjs-webpack-plugin": "^2.2.0",
+    "vue-loader": "^14.2.4",
+    "vue-template-compiler": "^2.4.4",
+    "webpack": "^4.46.0",
+    "webpack-cli": "^3.3.12",
+    "webpack-dev-server": "^3.11.3"
+  },
+  "files": [
+    "lib",
+    "packages"
+  ],
+  "homepage": "",
+  "keywords": [
+    "tianheng",
+    "tianheng-ui"
+  ],
+  "style": "lib/theme-chalk/index.css"
+}

package/packages/formMaking/Container.vue

@@ -7,7 +7,7 @@
             <div class="components-list">
               <template v-if="basicFields.length">
                 <div class="widget-cate">
-                  {{ $t("fm.components.basic.title") }}
+                  基础字段
                 </div>
                 <draggable
                   tag="ul"
@@ -38,7 +38,7 @@
               </template>
               <template v-if="advanceFields.length">
                 <div class="widget-cate">
-                  {{ $t("fm.components.advance.title") }}
+                  高级字段
                 </div>
                 <draggable
                   tag="ul"
@@ -70,7 +70,7 @@
 
               <template v-if="layoutFields.length">
                 <div class="widget-cate">
-                  {{ $t("fm.components.layout.title") }}
+                  布局字段
                 </div>
                 <draggable
                   tag="ul"
@@ -109,7 +109,7 @@
                 size="medium"
                 icon="el-icon-upload2"
                 @click="handleUpload"
-                >{{ $t("fm.actions.import") }}</el-button
+                >导入JSON</el-button
               >
               <el-button
                 v-if="clearable"
@@ -117,7 +117,7 @@
                 size="medium"
                 icon="el-icon-delete"
                 @click="handleClear"
-                >{{ $t("fm.actions.clear") }}</el-button
+                >清空</el-button
               >
               <el-button
                 v-if="preview"
@@ -125,7 +125,7 @@
                 size="medium"
                 icon="el-icon-view"
                 @click="handlePreview"
-                >{{ $t("fm.actions.preview") }}</el-button
+                >预览</el-button
               >
               <el-button
                 v-if="generateJson"
@@ -133,7 +133,7 @@
                 size="medium"
                 icon="el-icon-tickets"
                 @click="handleGenerateJson"
-                >{{ $t("fm.actions.json") }}</el-button
+                >生成JSON</el-button
               >
               <el-button
                 v-if="generateCode"
@@ -141,7 +141,7 @@
                 size="medium"
                 icon="el-icon-document"
                 @click="handleGenerateCode"
-                >{{ $t("fm.actions.code") }}</el-button
+                >生成代码</el-button
               >
             </el-header>
             <el-main :class="{ 'widget-empty': widgetForm.list.length == 0 }">
@@ -162,20 +162,21 @@
                   :class="{ active: configTab == 'widget' }"
                   @click="handleConfigSelect('widget')"
                 >
-                  {{ $t("fm.config.widget.title") }}
+                  字段属性
                 </div>
                 <div
                   class="config-tab"
                   :class="{ active: configTab == 'form' }"
                   @click="handleConfigSelect('form')"
                 >
-                  {{ $t("fm.config.form.title") }}
+                  表单属性
                 </div>
               </el-header>
               <el-main class="config-content">
                 <widget-config
                   v-show="configTab == 'widget'"
                   :data="widgetFormSelect"
+                  :remoteApis="remoteApis"
                 ></widget-config>
                 <form-config
                   v-show="configTab == 'form'"
@@ -216,12 +217,8 @@
             </generate-form>
 
             <template slot="action">
-              <el-button type="primary" @click="handleTest">{{
-                $t("fm.actions.getData")
-              }}</el-button>
-              <el-button @click="handleReset">{{
-                $t("fm.actions.reset")
-              }}</el-button>
+              <el-button type="primary" @click="handleTest">获取数据</el-button>
+              <el-button @click="handleReset">重置</el-button>
             </template>
           </cus-dialog>
 
@@ -235,7 +232,7 @@
           >
             <el-alert
               type="info"
-              :title="$t('fm.description.uploadJsonInfo')"
+              title="JSON格式如下，直接复制生成的json覆盖此处代码点击确定即可"
             ></el-alert>
             <div id="uploadeditor" style="height: 400px;width: 100%;">
               {{ jsonEg }}
@@ -258,7 +255,7 @@
                 type="primary"
                 class="json-btn"
                 :data-clipboard-text="jsonCopyValue"
-                >{{ $t("fm.actions.copyData") }}</el-button
+                >复制数据</el-button
               >
             </template>
           </cus-dialog>
@@ -302,6 +299,14 @@
 </template>
 
 <script>
+import ace from "ace-builds";
+import "ace-builds/src-min-noconflict/mode-json";
+import "ace-builds/src-min-noconflict/mode-html";
+import htmlWorkerUrl from  "file-loader!ace-builds/src-min-noconflict/worker-html";
+ace.config.setModuleUrl("ace/mode/html_worker", htmlWorkerUrl);
+import jsonWorkerUrl from "file-loader!ace-builds/src-noconflict/worker-json";
+ace.config.setModuleUrl("ace/mode/json_worker", jsonWorkerUrl);
+
 import Draggable from "vuedraggable";
 import Clipboard from "clipboard";
 import WidgetConfig from "./WidgetConfig";
@@ -374,6 +379,10 @@ export default {
     layoutFields: {
       type: Array,
       default: () => ["grid"]
+    },
+    remoteApis: {
+      type: Array,
+      default: () => []
     }
   },
   data() {
@@ -427,7 +436,8 @@ export default {
       uploadEditor: null,
       jsonCopyValue: "",
       jsonClipboard: null,
-      jsonEg: `{
+      jsonEg: `
+{
   "list": [],
   "config": {
     "labelWidth": 100,
@@ -439,29 +449,29 @@ export default {
     };
   },
   mounted() {
-    this._loadComponents();
+    // this._loadComponents();
   },
   methods: {
-    _loadComponents() {
-      this.basicComponents = this.basicComponents.map(item => {
-        return {
-          ...item,
-          name: this.$t(`fm.components.fields.${item.type}`)
-        };
-      });
-      this.advanceComponents = this.advanceComponents.map(item => {
-        return {
-          ...item,
-          name: this.$t(`fm.components.fields.${item.type}`)
-        };
-      });
-      this.layoutComponents = this.layoutComponents.map(item => {
-        return {
-          ...item,
-          name: this.$t(`fm.components.fields.${item.type}`)
-        };
-      });
-    },
+    // _loadComponents() {
+    //   this.basicComponents = this.basicComponents.map(item => {
+    //     return {
+    //       ...item,
+    //       name: this.$t(`fm.components.fields.${item.type}`)
+    //     };
+    //   });
+    //   this.advanceComponents = this.advanceComponents.map(item => {
+    //     return {
+    //       ...item,
+    //       name: this.$t(`fm.components.fields.${item.type}`)
+    //     };
+    //   });
+    //   this.layoutComponents = this.layoutComponents.map(item => {
+    //     return {
+    //       ...item,
+    //       name: this.$t(`fm.components.fields.${item.type}`)
+    //     };
+    //   });
+    // },
     handleGoGithub() {
       window.location.href = "https://github.com/GavinZhuLei/vue-form-making";
     },
@@ -469,16 +479,16 @@ export default {
       this.configTab = value;
     },
     handleMoveEnd(evt) {
-      console.log("end", evt);
+      // console.log("end", evt);
     },
     handleMoveStart({ oldIndex }) {
-      console.log("start", oldIndex, this.basicComponents);
+      // console.log("start", oldIndex, this.basicComponents);
     },
     handleMove() {
       return true;
     },
     handlePreview() {
-      console.log(this.widgetForm);
+      // console.log(this.widgetForm);
       this.previewVisible = true;
     },
     handleTest() {
@@ -498,7 +508,6 @@ export default {
     handleGenerateJson() {
       this.jsonVisible = true;
       this.jsonTemplate = this.widgetForm;
-      console.log(JSON.stringify(this.widgetForm));
       this.$nextTick(() => {
         const editor = ace.edit("jsoneditor");
         editor.session.setMode("ace/mode/json");
@@ -506,7 +515,7 @@ export default {
         if (!this.jsonClipboard) {
           this.jsonClipboard = new Clipboard(".json-btn");
           this.jsonClipboard.on("success", e => {
-            this.$message.success(this.$t("fm.message.copySuccess"));
+            this.$message.success("复制成功");
           });
         }
         this.jsonCopyValue = JSON.stringify(this.widgetForm);
@@ -570,18 +579,18 @@ export default {
       }
     },
     handleInput(val) {
-      console.log(val);
+      // console.log(val);
       this.blank = val;
     },
     handleDataChange(field, value, data) {
-      console.log(field, value, data);
+      // console.log(field, value, data);
     }
   },
   watch: {
     widgetForm: {
       deep: true,
       handler: function(val) {
-        console.log(this.$refs.widgetForm);
+        // console.log(this.$refs.widgetForm);
       }
     },
     $lang: function(val) {

package/packages/formMaking/CusDialog.vue

@@ -17,8 +17,8 @@
     <span v-if="action" slot="footer" class="dialog-footer" v-loading="loading"
       :element-loading-text="loadingText">
       <slot name="action">
-        <el-button @click="close">{{$t('fm.actions.cancel')}}</el-button>
-        <el-button type="primary" @click="submit" >{{$t('fm.actions.confirm')}}</el-button>
+        <el-button @click="close">取 消</el-button>
+        <el-button type="primary" @click="submit" >确 定</el-button>
       </slot>
     </span>
   </el-dialog>

package/packages/formMaking/FormConfig.vue

@@ -1,19 +1,28 @@
 <template>
   <div class="form-config-container">
     <el-form label-position="top">
-      <el-form-item :label="$t('fm.config.form.labelPosition.title')">
+      <el-form-item label="表单标题">
+        <el-input v-model="data.title"></el-input>
+      </el-form-item>
+
+      <el-form-item label="标签对齐方式">
         <el-radio-group v-model="data.labelPosition">
-          <el-radio-button label="left">{{$t('fm.config.form.labelPosition.left')}}</el-radio-button>
-          <el-radio-button label="right">{{$t('fm.config.form.labelPosition.right')}}</el-radio-button>
-          <el-radio-button label="top">{{$t('fm.config.form.labelPosition.top')}}</el-radio-button>
+          <el-radio-button label="left">左对齐</el-radio-button>
+          <el-radio-button label="right">右对齐</el-radio-button>
+          <el-radio-button label="top">顶部对齐</el-radio-button>
         </el-radio-group>
       </el-form-item>
 
-      <el-form-item :label="$t('fm.config.form.labelWidth')">
-        <el-input-number v-model="data.labelWidth" :min="0" :max="200" :step="10"></el-input-number>
+      <el-form-item label="表单标签宽度">
+        <el-input-number
+          v-model="data.labelWidth"
+          :min="0"
+          :max="200"
+          :step="10"
+        ></el-input-number>
       </el-form-item>
 
-      <el-form-item :label="$t('fm.config.form.size')">
+      <el-form-item label="组件尺寸">
         <el-radio-group v-model="data.size">
           <el-radio-button label="medium">medium</el-radio-button>
           <el-radio-button label="small">small</el-radio-button>
@@ -26,6 +35,6 @@
 
 <script>
 export default {
-  props: ['data']
-}
+  props: ["data"]
+};
 </script>

package/packages/formMaking/GenerateForm.vue

@@ -148,7 +148,7 @@ export default {
           if (valid) {
             resolve(this.models);
           } else {
-            reject(new Error(this.$t("fm.message.validError")).message);
+            reject(new Error('表单数据校验失败').message);
           }
         });
       });