tianheng-ui 0.0.60 → 0.0.63

package/package.json

@@ -1,15 +1,15 @@
 {
   "name": "tianheng-ui",
   "description": "A Vue.js project",
-  "version": "0.0.60",
+  "version": "0.0.63",
   "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",
-    "build:npm": "cross-env NODE_ENV=npm webpack --progress --hide-modules"
+    "build": "cross-env NODE_ENV=preview webpack --progress --hide-modules --mode=production",
+    "build:npm": "cross-env NODE_ENV=production webpack --progress --hide-modules --mode=production"
   },
   "dependencies": {
     "ace-builds": "^1.4.13",
@@ -22,10 +22,9 @@
     "element-ui": "^2.15.6",
     "highlight.js": "^10.5.0",
     "min-dash": "^3.5.2",
-    "mini-css-extract-plugin": "^2.6.1",
+    "mini-css-extract-plugin": "^1.6.2",
     "normalize.css": "^8.0.1",
     "nprogress": "^0.2.0",
-    "vant": "^2.12.50",
     "viewerjs": "^1.10.5",
     "vue": "^2.5.11",
     "vue-i18n": "^5.0.3",
@@ -52,6 +51,7 @@
     "@types/ace": "0.0.42",
     "@vue/babel-helper-vue-jsx-merge-props": "^1.4.0",
     "@vue/babel-preset-jsx": "^1.4.0",
+    "autoprefixer": "^10.4.13",
     "babel-loader": "^8.2.5",
     "babel-plugin-import": "^1.13.5",
     "bpmn-js": "^8.8.3",
@@ -63,8 +63,10 @@
     "html-webpack-plugin": "^4.5.0",
     "less": "^3.9.0",
     "less-loader": "^4.1.0",
+    "postcss-loader": "^4.3.0",
     "sass": "^1.55.0",
     "sass-loader": "^7.3.1",
+    "style-loader": "^2.0.0",
     "uglifyjs-webpack-plugin": "^2.2.0",
     "vue-loader": "^14.2.4",
     "vue-template-compiler": "^2.4.4",

package/packages/Empty/index.vue

@@ -20,7 +20,7 @@
 export default {
   name: "ThEmpty",
   props: {
-    image: { type: String, default: require("./images/notData.png") },
+    image: { type: String, default: "" },
     imageSize: { type: Number, default: 300 },
     description: { type: String, default: "暂无数据" }
   },

package/packages/FormMaking/GenerateForm.vue

@@ -1,24 +1,24 @@
 <template>
-  <div>
+  <div v-if="formJson.config">
     <el-form
       class="generateForm"
-      :class="{ 'form-hideLabel': data.config.hideLabel }"
+      :class="{ 'form-hideLabel': formJson.config.hideLabel }"
       :style="{ width: formWidth }"
-      :label-suffix="data.config.labelSuffix"
-      :size="data.config.size"
+      :label-suffix="formJson.config.labelSuffix"
+      :size="formJson.config.size"
       :model="models"
-      :label-position="data.config.labelPosition"
-      :label-width="data.config.labelWidth + 'px'"
+      :label-position="formJson.config.labelPosition"
+      :label-width="formJson.config.labelWidth + 'px'"
       ref="generateForm"
     >
       <genetate-form-item
-        v-for="item in data.list"
+        v-for="item in formJson.list"
         :key="item.key"
         :models.sync="models"
         :widget="item"
         :slotKeys="slotKeys"
         :remote="remote"
-        :config="data.config"
+        :config="formJson.config"
         :prop="item.type === 'grid' ? '' : item.model"
         :componentsData="componentsData"
         @input-change="onInputChange"
@@ -31,21 +31,21 @@
     <!-- <van-form
       v-else
       class="generateForm"
-      :class="{ 'form-hideLabel': data.config.hideLabel }"
+      :class="{ 'form-hideLabel': formJson.config.hideLabel }"
       :style="{ width: formWidth }"
       style="margin: 0 auto;"
-      :label-align="data.config.labelPosition"
-      :label-width="data.config.labelWidth + 'px'"
+      :label-align="formJson.config.labelPosition"
+      :label-width="formJson.config.labelWidth + 'px'"
       ref="generateForm"
     >
       <genetate-form-item-h5
-        v-for="item in data.list"
+        v-for="item in formJson.list"
         :key="item.key"
         :models.sync="models"
         :widget="item"
         :slotKeys="slotKeys"
         :remote="remote"
-        :config="data.config"
+        :config="formJson.config"
         :prop="item.type === 'grid' ? '' : item.model"
         :componentsData="componentsData"
         @input-change="onInputChange"
@@ -60,35 +60,80 @@
 
 <script>
 import GenetateFormItem from "./GenerateFormItem";
-import GenetateFormItemH5 from "./GenerateFormItemH5";
-import Vue from "vue";
-import { Form } from "vant";
-Vue.use(Form);
+// import GenetateFormItemH5 from "./GenerateFormItemH5";
+// import Vue from "vue";
+// import { Form } from "vant";
+// Vue.use(Form);
 
 export default {
   name: "th-generate-form",
-  components: { GenetateFormItem, GenetateFormItemH5 },
-  props: ["data", "remote", "value", "insite", "slotKeys", "client"],
+  components: { GenetateFormItem },
+  props: {
+    data: {
+      type: Object,
+      default: () => {
+        return {};
+      }
+    },
+    remote: {
+      type: Object,
+      default: () => {
+        return {};
+      }
+    },
+    value: {
+      type: Object,
+      default: () => {
+        return {};
+      }
+    },
+    slotKeys: {
+      type: Array,
+      default: () => {
+        return [];
+      }
+    },
+    client: String
+  },
   data() {
     return {
+      formJson: this.data,
       models: {},
       componentsData: []
     };
   },
   computed: {
     formWidth() {
-      if (this.data.config.width) return this.data.config.width;
+      if (this.formJson.config.width) return this.formJson.config.width;
       if (this.client === "mobile") return "375px";
 
       return "";
     }
   },
+  watch: {
+    data(val) {
+      this.formJson = val;
+    },
+    formJson: {
+      handler(val) {
+        this.$emit("update:data", val);
+      },
+      deep: true
+    },
+    value: {
+      deep: true,
+      handler(val) {
+        this.models = { ...this.models, ...val };
+      }
+    }
+  },
   created() {
-    this.generateModle(this.data.list);
+    this.generateModle(this.formJson.list);
   },
   mounted() {},
   methods: {
     generateModle(genList, modelObj) {
+      if (!genList) return;
       genList.map(item => {
         if (item.type === "grid") {
           item.columns.forEach(item => {
@@ -185,20 +230,9 @@ export default {
     onInputChange(value, field) {
       this.$emit("on-change", field, value, this.models);
     },
-    refresh() {}
-  },
-  watch: {
-    data: {
-      deep: true,
-      handler(val) {
-        // this.generateModle(val.list);
-      }
-    },
-    value: {
-      deep: true,
-      handler(val) {
-        this.models = { ...this.models, ...val };
-      }
+    setJSON(json) {
+      this.formJson = json;
+      this.generateModle(this.formJson.list);
     }
   }
 };

package/packages/FormMaking/custom/items/button.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-button
+  <th-button
     :style="{
       width: widget.options.width,
       height: widget.options.height
@@ -14,7 +14,7 @@
     :icon="widget.options.buttonIcon"
   >
     {{ widget.options.defaultValue }}
-  </el-button>
+  </th-button>
 </template>
 
 <script>

package/packages/FormMaking/custom/items/input.vue

@@ -25,9 +25,6 @@
 
 <script>
 import { itemsComponent } from "../mixins/index";
-import Vue from "vue";
-import { Field } from "vant";
-Vue.use(Field);
 export default {
   mixins: [itemsComponent]
 };

package/packages/index.js

@@ -0,0 +1,83 @@
+/**
+ * Cell : 单元格
+ * Icons : 图标选择器
+ * Table : 表格
+ * TableAction : 表格行操作
+ * TableSearch ：表格搜索
+ * TableTools ：表格公共操作
+ * Empty : 空状态
+ * Dialog : 对话框
+ * Card : 卡片
+ * CodeEditor : 编辑器
+ * Button : 按钮
+ * Image : 图片
+ * ImagePreview : 大图预览
+ * Row : loyout行
+ * Col : loyout列
+ * Upload : 上传
+ * MakingForm : 表单设计器
+ * GenerateForm : 表单渲染器
+ * Workflow : 工作流设计
+ */
+
+import Cell from "./cell/index.js";
+import Icons from "./icons/index.js";
+import Table from "./table/index.js";
+import TableAction from "./table/action.js";
+import TableSearch from "./table/search.js";
+import TableTools from "./table/tools.js";
+import Empty from "./empty/index.js";
+import Dialog from "./dialog/index.js";
+import Card from "./card/index.js";
+import CodeEditor from "./CodeEditor/index.js";
+import Button from "./Button/index.js";
+import Image from "./Image/index.js";
+import ImagePreview from "./ImagePreview/index.js";
+import Row from "./Row/index.js";
+import Col from "./Col/index.js";
+import Upload from "./Upload/index.js";
+import { MakingForm, GenerateForm } from "./formMaking/index.js";
+// import Workflow from "../workflow/index.js";
+
+const components = [
+  Cell,
+  Icons,
+  Table,
+  TableAction,
+  TableSearch,
+  TableTools,
+  Empty,
+  Dialog,
+  Card,
+  CodeEditor,
+  Button,
+  Image,
+  ImagePreview,
+  Row,
+  Col,
+  Upload,
+  MakingForm,
+  GenerateForm
+  // Workflow
+];
+
+const install = function(Vue, opts = {}) {
+  components.forEach(component => {
+    Vue.component(component.name, component);
+  });
+
+  Vue.prototype.$TIANHENG = {
+    size: opts.size || '',
+    zIndex: opts.zIndex || 2000
+  };
+};
+
+if (typeof window !== "undefined" && window.Vue) {
+  install(window.Vue);
+}
+
+export default {
+  version: "0.0.63",
+  install,
+  ...components
+};

package/lib/index.js

@@ -1,78 +0,0 @@
-/**
- * Cell : 单元格
- * Icons : 图标选择器
- * Table : 表格
- * TableAction : 表格行操作
- * TableSearch ：表格搜索
- * TableTools ：表格公共操作
- * Empty : 空状态
- * Dialog : 对话框
- * Card : 卡片
- * CodeEditor : 编辑器
- * Button : 按钮
- * Image : 图片
- * ImagePreview : 大图预览
- * Row : loyout行
- * Col : loyout列
- * Upload : 上传
- * MakingForm : 表单设计器
- * GenerateForm : 表单渲染器
- * Workflow : 工作流设计
- */
-
-import Cell from "../packages/cell/index.js";
-import Icons from "../packages/icons/index.js";
-import Table from "../packages/table/index.js";
-import TableAction from "../packages/table/action.js";
-import TableSearch from "../packages/table/search.js";
-import TableTools from "../packages/table/tools.js";
-import Empty from "../packages/empty/index.js";
-import Dialog from "../packages/dialog/index.js";
-import Card from "../packages/card/index.js";
-import CodeEditor from "../packages/CodeEditor/index.js";
-import Button from "../packages/Button/index.js";
-import Image from "../packages/Image/index.js";
-import ImagePreview from "../packages/ImagePreview/index.js";
-import Row from "../packages/Row/index.js";
-import Col from "../packages/Col/index.js";
-import Upload from "../packages/Upload/index.js";
-import { MakingForm, GenerateForm } from "../packages/formMaking/index.js";
-// import Workflow from "../packages/workflow/index.js";
-
-const components = [
-  Cell,
-  Icons,
-  Table,
-  TableAction,
-  TableSearch,
-  TableTools,
-  Empty,
-  Dialog,
-  Card,
-  CodeEditor,
-  Button,
-  Image,
-  ImagePreview,
-  Row,
-  Col,
-  Upload,
-  MakingForm,
-  GenerateForm,
-  // Workflow
-];
-
-const install = function(Vue) {
-  components.forEach(component => {
-    Vue.component(component.name, component);
-  });
-};
-
-if (typeof window !== "undefined" && window.Vue) {
-  install(window.Vue);
-}
-
-export default {
-  version: "0.0.60",
-  install,
-  ...components
-};