更新

.eslintignore

@@ -1,4 +1,6 @@
-build/*.js
-src/assets
-public
-dist
+build/*.js
+src/assets
+public
+dist
+views
+src

.eslintrc.js

@@ -1,207 +0,0 @@
-module.exports = {
-  root: true,
-  parserOptions: {
-    parser: 'babel-eslint',
-    sourceType: 'module'
-  },
-  env: {
-    browser: true,
-    node: true,
-    es6: true,
-  },
-  extends: ['plugin:vue/recommended', 'eslint:recommended'],
-
-  // add your custom rules here
-  //it is base on https://github.com/vuejs/eslint-config-vue
-  rules: {
-    "vue/max-attributes-per-line": [2, {
-      "singleline": 10,
-      "multiline": {
-        "max": 1,
-        "allowFirstLine": false
-      }
-    }],
-    "vue/html-self-closing": ["error", {
-      "html": {
-          "void": "never",
-          "normal": "any",
-          "component": "any"
-      },
-      "svg": "always",
-      "math": "always"
-    }],
-    "vue/singleline-html-element-content-newline": "off",
-    "vue/multiline-html-element-content-newline":"off",
-    "vue/name-property-casing": ["error", "PascalCase"],
-    "vue/no-v-html": "off",
-    'accessor-pairs': 2,
-    'arrow-spacing': [2, {
-      'before': true,
-      'after': true
-    }],
-    'block-spacing': [2, 'always'],
-    'brace-style': [2, '1tbs', {
-      'allowSingleLine': true
-    }],
-    'camelcase': [0, {
-      'properties': 'always'
-    }],
-    'comma-dangle': [2, 'never'],
-    'comma-spacing': [2, {
-      'before': false,
-      'after': true
-    }],
-    'comma-style': [2, 'last'],
-    'constructor-super': 2,
-    'curly': [2, 'multi-line'],
-    'dot-location': [2, 'property'],
-    'eol-last': 2,
-    // 'eqeqeq': ["error", "always", {"null": "ignore"}],
-    'generator-star-spacing': [2, {
-      'before': true,
-      'after': true
-    }],
-    'handle-callback-err': [2, '^(err|error)$'],
-    'indent': [2, 2, {
-      'SwitchCase': 1
-    }],
-    'jsx-quotes': [2, 'prefer-single'],
-    'key-spacing': [2, {
-      'beforeColon': false,
-      'afterColon': true
-    }],
-    'keyword-spacing': [2, {
-      'before': true,
-      'after': true
-    }],
-    'new-cap': [2, {
-      'newIsCap': true,
-      'capIsNew': false
-    }],
-    'new-parens': 2,
-    'no-array-constructor': 2,
-    'no-caller': 2,
-    'no-console': 'off',
-    'no-class-assign': 2,
-    'no-cond-assign': 2,
-    'no-const-assign': 2,
-    'no-control-regex': 0,
-    'no-delete-var': 2,
-    'no-dupe-args': 2,
-    'no-dupe-class-members': 2,
-    'no-dupe-keys': 2,
-    'no-duplicate-case': 2,
-    'no-empty-character-class': 2,
-    'no-empty-pattern': 2,
-    'no-eval': 2,
-    'no-ex-assign': 2,
-    'no-extend-native': 2,
-    'no-extra-bind': 2,
-    'no-extra-boolean-cast': 2,
-    'no-extra-parens': [2, 'functions'],
-    'no-fallthrough': 2,
-    'no-floating-decimal': 2,
-    'no-func-assign': 2,
-    'no-implied-eval': 2,
-    'no-inner-declarations': [2, 'functions'],
-    'no-invalid-regexp': 2,
-    'no-irregular-whitespace': 2,
-    'no-iterator': 2,
-    'no-label-var': 2,
-    'no-labels': [2, {
-      'allowLoop': false,
-      'allowSwitch': false
-    }],
-    'no-lone-blocks': 2,
-    'no-mixed-spaces-and-tabs': 2,
-    'no-multi-spaces': 2,
-    'no-multi-str': 2,
-    'no-multiple-empty-lines': [2, {
-      'max': 1
-    }],
-    'no-native-reassign': 2,
-    'no-negated-in-lhs': 2,
-    'no-new-object': 2,
-    'no-new-require': 2,
-    'no-new-symbol': 2,
-    'no-new-wrappers': 2,
-    'no-obj-calls': 2,
-    'no-octal': 2,
-    'no-octal-escape': 2,
-    'no-path-concat': 2,
-    'no-proto': 2,
-    'no-redeclare': 2,
-    'no-regex-spaces': 2,
-    'no-return-assign': [2, 'except-parens'],
-    'no-self-assign': 2,
-    'no-self-compare': 2,
-    // 'no-sequences': 2,
-    'no-shadow-restricted-names': 2,
-    'no-spaced-func': 2,
-    'no-sparse-arrays': 2,
-    'no-this-before-super': 2,
-    'no-throw-literal': 2,
-    'no-trailing-spaces': 2,
-    'no-undef': 2,
-    'no-undef-init': 2,
-    'no-unexpected-multiline': 2,
-    'no-unmodified-loop-condition': 2,
-    'no-unneeded-ternary': [2, {
-      'defaultAssignment': false
-    }],
-    'no-unreachable': 2,
-    'no-unsafe-finally': 2,
-    'no-unused-vars': [2, {
-      'vars': 'all',
-      'args': 'none'
-    }],
-    'no-useless-call': 2,
-    'no-useless-computed-key': 2,
-    'no-useless-constructor': 2,
-    'no-useless-escape': 0,
-    'no-whitespace-before-property': 2,
-    'no-with': 2,
-    'one-var': [2, {
-      'initialized': 'never'
-    }],
-    'operator-linebreak': [2, 'after', {
-      'overrides': {
-        '?': 'before',
-        ':': 'before'
-      }
-    }],
-    'padded-blocks': [2, 'never'],
-    'quotes': [2, 'single', {
-      'avoidEscape': true,
-      'allowTemplateLiterals': true
-    }],
-    'semi': [2, 'never'],
-    'semi-spacing': [2, {
-      'before': false,
-      'after': true
-    }],
-    'space-before-blocks': [2, 'always'],
-    'space-before-function-paren': [2, 'never'],
-    'space-in-parens': [2, 'never'],
-    'space-infix-ops': 2,
-    'space-unary-ops': [2, {
-      'words': true,
-      'nonwords': false
-    }],
-    'spaced-comment': [2, 'always', {
-      'markers': ['global', 'globals', 'eslint', 'eslint-disable', '*package', '!', ',']
-    }],
-    'template-curly-spacing': [2, 'never'],
-    'use-isnan': 2,
-    'valid-typeof': 2,
-    'wrap-iife': [2, 'any'],
-    'yield-star-spacing': [2, 'both'],
-    'yoda': [2, 'never'],
-    'prefer-const': 2,
-    'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
-    'object-curly-spacing': [2, 'always', {
-      objectsInObjects: false
-    }],
-    'array-bracket-spacing': [2, 'never']
-  }
-}

.eslintrc.jstemp

@@ -0,0 +1,207 @@
+module.exports = {
+  // root: true,
+  // parserOptions: {
+  //   parser: 'babel-eslint',
+  //   sourceType: 'module'
+  // },
+  // env: {
+  //   browser: true,
+  //   node: true,
+  //   es6: true,
+  // },
+  // extends: ['plugin:vue/recommended', 'eslint:recommended'],
+
+  // add your custom rules here
+  //it is base on https://github.com/vuejs/eslint-config-vue
+  // rules: {
+  //   "vue/max-attributes-per-line": [2, {
+  //     "singleline": 10,
+  //     "multiline": {
+  //       "max": 1,
+  //       "allowFirstLine": false
+  //     }
+  //   }],
+  //   "vue/html-self-closing": ["error", {
+  //     "html": {
+  //         "void": "never",
+  //         "normal": "any",
+  //         "component": "any"
+  //     },
+  //     "svg": "always",
+  //     "math": "always"
+  //   }],
+  //   "vue/singleline-html-element-content-newline": "off",
+  //   "vue/multiline-html-element-content-newline":"off",
+  //   "vue/name-property-casing": ["error", "PascalCase"],
+  //   "vue/no-v-html": "off",
+  //   'accessor-pairs': 2,
+  //   'arrow-spacing': [2, {
+  //     'before': true,
+  //     'after': true
+  //   }],
+  //   'block-spacing': [2, 'always'],
+  //   'brace-style': [2, '1tbs', {
+  //     'allowSingleLine': true
+  //   }],
+  //   'camelcase': [0, {
+  //     'properties': 'always'
+  //   }],
+  //   'comma-dangle': [2, 'never'],
+  //   'comma-spacing': [2, {
+  //     'before': false,
+  //     'after': true
+  //   }],
+  //   'comma-style': [2, 'last'],
+  //   'constructor-super': 2,
+  //   'curly': [2, 'multi-line'],
+  //   'dot-location': [2, 'property'],
+  //   'eol-last': 2,
+  //   // 'eqeqeq': ["error", "always", {"null": "ignore"}],
+  //   'generator-star-spacing': [2, {
+  //     'before': true,
+  //     'after': true
+  //   }],
+  //   'handle-callback-err': [2, '^(err|error)$'],
+  //   'indent': [2, 2, {
+  //     'SwitchCase': 1
+  //   }],
+  //   'jsx-quotes': [2, 'prefer-single'],
+  //   'key-spacing': [2, {
+  //     'beforeColon': false,
+  //     'afterColon': true
+  //   }],
+  //   'keyword-spacing': [2, {
+  //     'before': true,
+  //     'after': true
+  //   }],
+  //   'new-cap': [2, {
+  //     'newIsCap': true,
+  //     'capIsNew': false
+  //   }],
+  //   'new-parens': 2,
+  //   'no-array-constructor': 2,
+  //   'no-caller': 2,
+  //   'no-console': 'off',
+  //   'no-class-assign': 2,
+  //   'no-cond-assign': 2,
+  //   'no-const-assign': 2,
+  //   'no-control-regex': 0,
+  //   'no-delete-var': 2,
+  //   'no-dupe-args': 2,
+  //   'no-dupe-class-members': 2,
+  //   'no-dupe-keys': 2,
+  //   'no-duplicate-case': 2,
+  //   'no-empty-character-class': 2,
+  //   'no-empty-pattern': 2,
+  //   'no-eval': 2,
+  //   'no-ex-assign': 2,
+  //   'no-extend-native': 2,
+  //   'no-extra-bind': 2,
+  //   'no-extra-boolean-cast': 2,
+  //   'no-extra-parens': [2, 'functions'],
+  //   'no-fallthrough': 2,
+  //   'no-floating-decimal': 2,
+  //   'no-func-assign': 2,
+  //   'no-implied-eval': 2,
+  //   'no-inner-declarations': [2, 'functions'],
+  //   'no-invalid-regexp': 2,
+  //   'no-irregular-whitespace': 2,
+  //   'no-iterator': 2,
+  //   'no-label-var': 2,
+  //   'no-labels': [2, {
+  //     'allowLoop': false,
+  //     'allowSwitch': false
+  //   }],
+  //   'no-lone-blocks': 2,
+  //   'no-mixed-spaces-and-tabs': 2,
+  //   'no-multi-spaces': 2,
+  //   'no-multi-str': 2,
+  //   'no-multiple-empty-lines': [2, {
+  //     'max': 1
+  //   }],
+  //   'no-native-reassign': 2,
+  //   'no-negated-in-lhs': 2,
+  //   'no-new-object': 2,
+  //   'no-new-require': 2,
+  //   'no-new-symbol': 2,
+  //   'no-new-wrappers': 2,
+  //   'no-obj-calls': 2,
+  //   'no-octal': 2,
+  //   'no-octal-escape': 2,
+  //   'no-path-concat': 2,
+  //   'no-proto': 2,
+  //   'no-redeclare': 2,
+  //   'no-regex-spaces': 2,
+  //   'no-return-assign': [2, 'except-parens'],
+  //   'no-self-assign': 2,
+  //   'no-self-compare': 2,
+  //   // 'no-sequences': 2,
+  //   'no-shadow-restricted-names': 2,
+  //   'no-spaced-func': 2,
+  //   'no-sparse-arrays': 2,
+  //   'no-this-before-super': 2,
+  //   'no-throw-literal': 2,
+  //   'no-trailing-spaces': 2,
+  //   'no-undef': 2,
+  //   'no-undef-init': 2,
+  //   'no-unexpected-multiline': 2,
+  //   'no-unmodified-loop-condition': 2,
+  //   'no-unneeded-ternary': [2, {
+  //     'defaultAssignment': false
+  //   }],
+  //   'no-unreachable': 2,
+  //   'no-unsafe-finally': 2,
+  //   'no-unused-vars': [2, {
+  //     'vars': 'all',
+  //     'args': 'none'
+  //   }],
+  //   'no-useless-call': 2,
+  //   'no-useless-computed-key': 2,
+  //   'no-useless-constructor': 2,
+  //   'no-useless-escape': 0,
+  //   'no-whitespace-before-property': 2,
+  //   'no-with': 2,
+  //   'one-var': [2, {
+  //     'initialized': 'never'
+  //   }],
+  //   'operator-linebreak': [2, 'after', {
+  //     'overrides': {
+  //       '?': 'before',
+  //       ':': 'before'
+  //     }
+  //   }],
+  //   'padded-blocks': [2, 'never'],
+  //   'quotes': [2, 'single', {
+  //     'avoidEscape': true,
+  //     'allowTemplateLiterals': true
+  //   }],
+  //   'semi': [2, 'never'],
+  //   'semi-spacing': [2, {
+  //     'before': false,
+  //     'after': true
+  //   }],
+  //   'space-before-blocks': [2, 'always'],
+  //   'space-before-function-paren': [2, 'never'],
+  //   'space-in-parens': [2, 'never'],
+  //   'space-infix-ops': 2,
+  //   'space-unary-ops': [2, {
+  //     'words': true,
+  //     'nonwords': false
+  //   }],
+  //   'spaced-comment': [2, 'always', {
+  //     'markers': ['global', 'globals', 'eslint', 'eslint-disable', '*package', '!', ',']
+  //   }],
+  //   'template-curly-spacing': [2, 'never'],
+  //   'use-isnan': 2,
+  //   'valid-typeof': 2,
+  //   'wrap-iife': [2, 'any'],
+  //   'yield-star-spacing': [2, 'both'],
+  //   'yoda': [2, 'never'],
+  //   'prefer-const': 2,
+  //   'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
+  //   'object-curly-spacing': [2, 'always', {
+  //     objectsInObjects: false
+  //   }],
+  //   'array-bracket-spacing': [2, 'never']
+  // }
+}

package.json

@@ -1,130 +1,130 @@
-{
-  "name": "vue-element-admin",
-  "version": "4.2.1",
-  "license": "MIT",
-  "scripts": {
-    "dev": "vue-cli-service serve",
-    "build:prod": "vue-cli-service build",
-    "build:stage": "vue-cli-service build --mode staging",
-    "preview": "node build/index.js --preview",
-    "lint": "eslint --ext .js,.vue src",
-    "test:unit": "jest --clearCache && vue-cli-service test:unit",
-    "test:ci": "npm run lint && npm run test:unit",
-    "svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml",
-    "new": "plop"
-  },
-  "husky": {
-    "hooks": {
-      "pre-commit": "lint-staged"
-    }
-  },
-  "lint-staged": {
-    "src/**/*.{js,vue}": [
-      "eslint --fix",
-      "git add"
-    ]
-  },
-  "keywords": [
-    "vue",
-    "admin",
-    "dashboard",
-    "element-ui",
-    "boilerplate",
-    "admin-template",
-    "management-system"
-  ],
-  "dependencies": {
-    "@antv/g6": "3.1.10",
-    "@antv/g6-editor": "^1.2.0",
-    "@antv/util": "1.3.1",
-    "@riophae/vue-treeselect": "0.4.0",
-    "ace-builds": "^1.4.12",
-    "axios": "^0.21.1",
-    "clipboard": "^2.0.6",
-    "codemirror": "^5.58.1",
-    "core-js": "^2.6.11",
-    "driver.js": "0.9.5",
-    "dropzone": "5.5.1",
-    "e-icon-picker": "1.0.7",
-    "echarts": "^4.8.0",
-    "element-ui": "^2.13.2",
-    "file-saver": "2.0.1",
-    "form-making": "^1.2.8",
-    "fuse.js": "3.4.4",
-    "js-cookie": "2.2.0",
-    "jsonlint": "1.6.3",
-    "jszip": "3.2.1",
-    "moment": "^2.27.0",
-    "monaco-editor": "^0.20.0",
-    "normalize.css": "7.0.0",
-    "nprogress": "0.2.0",
-    "numericjs": "^1.2.6",
-    "path-to-regexp": "2.4.0",
-    "qiniu-js": "^3.0.3",
-    "qs": "^6.10.1",
-    "screenfull": "4.2.0",
-    "showdown": "^1.9.1",
-    "solarlunar": "^2.0.7",
-    "sortablejs": "1.8.4",
-    "tui-editor": "1.3.3",
-    "viewerjs": "^1.6.1",
-    "vue": "^2.6.12",
-    "vue-codemirror": "^4.0.6",
-    "vue-codemirror-lite": "^1.0.4",
-    "vue-count-to": "1.0.13",
-    "vue-cropper": "^0.5.0",
-    "vue-i18n": "^5.0.3",
-    "vue-loader": "^15.9.3",
-    "vue-particles": "^1.0.9",
-    "vue-quill-editor": "^3.0.6",
-    "vue-router": "3.0.2",
-    "vue-splitpane": "1.0.4",
-    "vue2-editor": "^2.10.2",
-    "vuedraggable": "2.20.0",
-    "vueify": "^9.4.1",
-    "vuex": "3.1.0",
-    "xlsx": "0.14.1"
-  },
-  "devDependencies": {
-    "@babel/core": "7.0.0",
-    "@babel/register": "^7.9.0",
-    "@vue/cli-plugin-babel": "3.5.3",
-    "@vue/cli-plugin-eslint": "^3.9.1",
-    "@vue/cli-plugin-unit-jest": "3.5.3",
-    "@vue/cli-service": "3.5.3",
-    "@vue/test-utils": "1.0.0-beta.29",
-    "autoprefixer": "^9.5.1",
-    "babel-core": "7.0.0-bridge.0",
-    "babel-eslint": "10.0.1",
-    "babel-jest": "23.6.0",
-    "beautifier": "^0.1.7",
-    "chalk": "2.4.2",
-    "chokidar": "2.1.5",
-    "connect": "3.6.6",
-    "eslint": "5.15.3",
-    "eslint-plugin-vue": "5.2.2",
-    "html-webpack-plugin": "3.2.0",
-    "husky": "1.3.1",
-    "lint-staged": "8.1.5",
-    "mockjs": "1.0.1-beta3",
-    "monaco-editor-webpack-plugin": "^1.9.0",
-    "node-sass": "^4.13.1",
-    "plop": "2.3.0",
-    "runjs": "^4.3.2",
-    "sass-loader": "^7.1.0",
-    "script-ext-html-webpack-plugin": "2.1.3",
-    "script-loader": "0.7.2",
-    "serve-static": "^1.13.2",
-    "svg-sprite-loader": "4.1.3",
-    "svgo": "1.2.0",
-    "vue-template-compiler": "^2.6.12"
-  },
-  "engines": {
-    "node": ">=8.9",
-    "npm": ">= 3.0.0"
-  },
-  "browserslist": [
-    "> 1%",
-    "last 2 versions"
-  ]
-}
+{
+  "name": "vue-element-admin",
+  "version": "4.2.1",
+  "license": "MIT",
+  "scripts": {
+    "dev": "vue-cli-service serve",
+    "build:prod": "vue-cli-service build",
+    "build:stage": "vue-cli-service build --mode staging",
+    "preview": "node build/index.js --preview",
+    "lint": "eslint --ext .js,.vue src",
+    "test:unit": "jest --clearCache && vue-cli-service test:unit",
+    "test:ci": "npm run lint && npm run test:unit",
+    "svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml",
+    "new": "plop"
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "lint-staged"
+    }
+  },
+  "lint-staged": {
+    "src/**/*.{js,vue}": [
+      "eslint --fix",
+      "git add"
+    ]
+  },
+  "keywords": [
+    "vue",
+    "admin",
+    "dashboard",
+    "element-ui",
+    "boilerplate",
+    "admin-template",
+    "management-system"
+  ],
+  "dependencies": {
+    "@antv/g6": "3.1.10",
+    "@antv/g6-editor": "^1.2.0",
+    "@antv/util": "1.3.1",
+    "@riophae/vue-treeselect": "0.4.0",
+    "ace-builds": "^1.4.12",
+    "axios": "^0.21.1",
+    "clipboard": "^2.0.6",
+    "codemirror": "^5.58.1",
+    "core-js": "^2.6.11",
+    "driver.js": "0.9.5",
+    "dropzone": "5.5.1",
+    "e-icon-picker": "1.0.7",
+    "echarts": "^4.8.0",
+    "element-ui": "^2.13.2",
+    "file-saver": "2.0.1",
+    "form-making": "^1.2.8",
+    "fuse.js": "3.4.4",
+    "js-cookie": "2.2.0",
+    "jsonlint": "1.6.3",
+    "jszip": "3.2.1",
+    "moment": "^2.27.0",
+    "monaco-editor": "^0.20.0",
+    "normalize.css": "7.0.0",
+    "nprogress": "0.2.0",
+    "numericjs": "^1.2.6",
+    "path-to-regexp": "2.4.0",
+    "qiniu-js": "^3.0.3",
+    "qs": "^6.10.1",
+    "screenfull": "4.2.0",
+    "showdown": "^1.9.1",
+    "solarlunar": "^2.0.7",
+    "sortablejs": "1.8.4",
+    "tui-editor": "1.3.3",
+    "viewerjs": "^1.6.1",
+    "vue": "^2.6.12",
+    "vue-codemirror": "^4.0.6",
+    "vue-codemirror-lite": "^1.0.4",
+    "vue-count-to": "1.0.13",
+    "vue-cropper": "^0.5.0",
+    "vue-i18n": "^5.0.3",
+    "vue-loader": "^15.9.3",
+    "vue-particles": "^1.0.9",
+    "vue-quill-editor": "^3.0.6",
+    "vue-router": "3.0.2",
+    "vue-splitpane": "1.0.4",
+    "vue2-editor": "^2.10.2",
+    "vuedraggable": "2.20.0",
+    "vueify": "^9.4.1",
+    "vuex": "3.1.0",
+    "xlsx": "0.14.1"
+  },
+  "devDependencies": {
+    "@babel/core": "7.0.0",
+    "@babel/register": "^7.9.0",
+    "@vue/cli-plugin-babel": "3.5.3",
+    "@vue/cli-plugin-eslint": "^3.9.1",
+    "@vue/cli-plugin-unit-jest": "3.5.3",
+    "@vue/cli-service": "3.5.3",
+    "@vue/test-utils": "1.0.0-beta.29",
+    "autoprefixer": "^9.5.1",
+    "babel-core": "7.0.0-bridge.0",
+    "babel-eslint": "10.0.1",
+    "babel-jest": "23.6.0",
+    "beautifier": "^0.1.7",
+    "chalk": "2.4.2",
+    "chokidar": "2.1.5",
+    "connect": "3.6.6",
+    "eslint": "5.15.3",
+    "eslint-plugin-vue": "5.2.2",
+    "html-webpack-plugin": "3.2.0",
+    "husky": "1.3.1",
+    "lint-staged": "8.1.5",
+    "mockjs": "1.0.1-beta3",
+    "monaco-editor-webpack-plugin": "^1.9.0",
+    "node-sass": "^4.13.1",
+    "plop": "2.3.0",
+    "runjs": "^4.3.2",
+    "sass-loader": "^7.1.0",
+    "script-ext-html-webpack-plugin": "2.1.3",
+    "script-loader": "0.7.2",
+    "serve-static": "^1.13.2",
+    "svg-sprite-loader": "4.1.3",
+    "svgo": "1.2.0",
+    "vue-template-compiler": "^2.6.12"
+  },
+  "engines": {
+    "node": ">=8.9",
+    "npm": ">= 3.0.0"
+  },
+  "browserslist": [
+    "> 1%",
+    "last 2 versions"
+  ]
+}

src/api/dashboard.js

@@ -1,9 +1,19 @@
-import request from '@/utils/request'
-
-export function initData(params) {
-  return request({
-    url: '/api-oa/api/v1/dashboard',
-    method: 'get',
-    params
-  })
-}
+import request from '@/utils/request'
+
+export function initData(params) {
+  return request({
+    url: '/api-oa/api/v1/dashboard',
+    method: 'get',
+    params
+  })
+}
+
+
+// 全部分部
+export function queryAllOrgan(params) {
+  return request({
+      url: '/eduOrganization/queryAllOrgan',
+      method: 'get',
+      params
+  })
+}

src/api/process/work-order.js

@@ -1,106 +1,106 @@
-import request from '@/utils/request'
-
-// 流程结构
-export function processStructure(params) {
-  return request({
-    url: '/api-oa/api/v1/work-order/process-structure',
-    method: 'get',
-    params
-  })
-}
-
-// 新建工单
-export function createWorkOrder(data) {
-  return request({
-    url: '/api-oa/api/v1/work-order/create',
-    method: 'post',
-    data
-  })
-}
-
-// 工单列表
-export function workOrderList(params) {
-  return request({
-    url: '/api-oa/api/v1/work-order/list',
-    method: 'get',
-    params
-  })
-}
-
-// 处理工单
-export function handleWorkOrder(data) {
-  return request({
-    url: '/api-oa/api/v1/work-order/handle',
-    method: 'post',
-    data
-  })
-}
-
-// 结束工单
-export function unityWorkOrder(params) {
-  return request({
-    url: '/api-oa/api/v1/work-order/unity',
-    method: 'get',
-    params
-  })
-}
-
-// 转交工单
-export function inversionWorkOrder(data) {
-  return request({
-    url: '/api-oa/api/v1/work-order/inversion',
-    method: 'post',
-    data
-  })
-}
-
-// 催办工单
-export function urgeWorkOrder(params) {
-  return request({
-    url: '/api-oa/api/v1/work-order/urge',
-    method: 'get',
-    params
-  })
-}
-
-// 主动接单
-export function activeOrder(data, workOrderId) {
-  return request({
-    url: `/api-oa/api/v1/work-order/active-order/${workOrderId}`,
-    method: 'put',
-    data
-  })
-}
-
-// 删除工单
-export function deleteWorkOrder(workOrderId) {
-  return request({
-    url: `/api-oa/api/v1/work-order/delete/${workOrderId}`,
-    method: 'delete'
-  })
-}
-
-// 删除工单
-export function reopenWorkOrder(id) {
-  return request({
-    url: `/api-oa/api/v1/work-order/reopen/${id}`,
-    method: 'post'
-  })
-}
-
-// 获取所有分部
-export function queryAllOrgan() {
-  return request({
-    url: `/api-web/eduOrganization/queryAllOrgan`,
-    method: 'get'
-  })
-}
-
-// 获取合作单位
-export function getOrganCooperation(params) {
-  return request({
-    url: `/api-web/eduOrganization/getOrganCooperation`,
-    method: 'get',
-    params
-  })
-}
+import request from '@/utils/request'
+
+// 流程结构
+export function processStructure(params) {
+  return request({
+    url: '/api-oa/api/v1/work-order/process-structure',
+    method: 'get',
+    params
+  })
+}
+
+// 新建工单
+export function createWorkOrder(data) {
+  return request({
+    url: '/api-oa/api/v1/work-order/create',
+    method: 'post',
+    data
+  })
+}
+
+// 工单列表
+export function workOrderList(params) {
+  return request({
+    url: '/api-oa/api/v1/work-order/list',
+    method: 'get',
+    params
+  })
+}
+
+// 处理工单
+export function handleWorkOrder(data) {
+  return request({
+    url: '/api-oa/api/v1/work-order/handle',
+    method: 'post',
+    data
+  })
+}
+
+// 结束工单
+export function unityWorkOrder(params) {
+  return request({
+    url: '/api-oa/api/v1/work-order/unity',
+    method: 'get',
+    params
+  })
+}
+
+// 转交工单
+export function inversionWorkOrder(data) {
+  return request({
+    url: '/api-oa/api/v1/work-order/inversion',
+    method: 'post',
+    data
+  })
+}
+
+// 催办工单
+export function urgeWorkOrder(params) {
+  return request({
+    url: '/api-oa/api/v1/work-order/urge',
+    method: 'get',
+    params
+  })
+}
+
+// 主动接单
+export function activeOrder(data, workOrderId) {
+  return request({
+    url: `/api-oa/api/v1/work-order/active-order/${workOrderId}`,
+    method: 'put',
+    data
+  })
+}
+
+// 删除工单
+export function deleteWorkOrder(workOrderId) {
+  return request({
+    url: `/api-oa/api/v1/work-order/delete/${workOrderId}`,
+    method: 'delete'
+  })
+}
+
+// 删除工单
+export function reopenWorkOrder(id) {
+  return request({
+    url: `/api-oa/api/v1/work-order/reopen/${id}`,
+    method: 'post'
+  })
+}
+
+// 获取所有分部
+export function queryAllOrgan() {
+  return request({
+    url: `/api-web/eduOrganization/queryAllOrgan`,
+    method: 'get'
+  })
+}
+
+// 获取合作单位
+export function getOrganCooperation(params) {
+  return request({
+    url: `/api-web/eduOrganization/getOrganCooperation`,
+    method: 'get',
+    params
+  })
+}

src/components/VueFormMaking/components/GenerateForm.vue

@@ -1,274 +1,419 @@
-<template>
-  <div>
-    <el-form
-      ref="generateForm"
-      label-suffix=":"
-      :size="data.config.size"
-      :model="models"
-      :rules="rules"
-      :label-position="data.config.labelPosition"
-      :label-width="data.config.labelWidth + 'px'"
-    >
-      <template v-for="item in data.list">
-        <template v-if="item.type == 'grid'">
-          <el-row
-            :key="item.key"
-            type="flex"
-            :gutter="item.options.gutter ? item.options.gutter : 0"
-            :justify="item.options.justify"
-            :align="item.options.align"
-          >
-            <el-col v-for="(col, colIndex) in item.columns" :key="colIndex" :span="col.span">
-              <template v-for="citem in col.list">
-                <el-form-item v-if="citem.type=='blank'" :key="citem.key" :label="citem.name" :prop="citem.model">
-                  <slot :name="citem.model" :model="models" />
-                </el-form-item>
-                <genetate-form-item
-                  v-else
-                  :key="citem.key"
-                  :preview="preview"
-                  :models.sync="models"
-                  :organ-list="itemOrganList"
-                  :remote="remote"
-                  :widget="citem"
-                  :data="data"
-                  :prop-value="citem.model"
-                  :cooperation-list="cooperationList"
-                  @input-change="onInputChange"
-                />
-              </template>
-            </el-col>
-          </el-row>
-        </template>
-
-        <template v-else-if="item.type == 'blank'">
-          <el-form-item :key="item.key" :label="item.name" :prop="item.model">
-            <slot :name="item.model" :model="models" />
-          </el-form-item>
-        </template>
-        <!-- 子表单 -->
-        <template v-else-if="item.type === 'subform'">
-          <el-form-item
-            :key="item.key"
-            :label-width="!item.options.labelWidthStatus?'0px': item.options.labelWidth + 'px'"
-            :label="!item.options.labelWidthStatus?'':item.name"
-          >
-            <el-table
-              :data="models[item.model]"
-              border
-              style="width: 100%"
-              :header-cell-style="{padding: '5px 0'}"
-              size="mini"
-            >
-              <el-table-column
-                v-if="!preview"
-                fixed
-                width="50"
-              >
-                <template slot="header">
-                  <i style="font-size: 25px; color: #409EFF;cursor:pointer;" class="el-icon-circle-plus" @click="addSubformCol(item)" />
-                </template>
-                <template slot-scope="scope">
-                  <i style="font-size: 25px; color: red" class="el-icon-remove" @click="delSubformCol(item, scope.$index)" />
-                </template>
-              </el-table-column>
-              <template v-for="(c, i) in item.columns">
-                <div :key="i">
-                  <el-table-column
-                    v-for="v in c.list"
-                    :key="v.key"
-                    :prop="v.model"
-                    :label="v.name"
-                    min-width="250"
-                  >
-                    <template slot-scope="scope">
-                      <genetate-form-item
-                        :prop-value="item.model + '.' + scope.$index + '.' + v.model"
-                        :preview="preview"
-                        :models.sync="models"
-                        :widget="v"
-                        :remote="remote"
-                        :data="data"
-                        :disabled="disabled"
-                        :is-label="false"
-                        :organ-list="itemOrganList"
-                        :subform-index="scope.$index"
-                        :subform-model="item.model"
-                        :cooperation-list="cooperationList"
-                        @input-change="onInputChange"
-                      />
-                    </template>
-                  </el-table-column>
-                </div>
-              </template>
-            </el-table>
-          </el-form-item>
-        </template>
-
-        <template v-else>
-          <genetate-form-item
-            :key="item.key"
-            :prop-value="item.model"
-            :preview="preview"
-            :models.sync="models"
-            :widget="item"
-            :remote="remote"
-            :data="data"
-            :organ-list="itemOrganList"
-            :disabled="disabled"
-            :cooperation-list="cooperationList"
-            @input-change="onInputChange"
-          />
-        </template>
-
-      </template>
-    </el-form>
-  </div>
-</template>
-
-<script>
-import GenetateFormItem from './GenerateFormItem'
-import {
-  getOrganCooperation
-} from '@/api/process/work-order'
-export default {
-  name: 'FmGenerateForm',
-  components: {
-    GenetateFormItem
-  },
-  /* eslint-disable */
-  props: ['data', 'remote', 'value', 'insite', 'disabled', 'preview', 'organList'],
-  data() {
-    return {
-      tableData: [],
-      models: {},
-      rules: {},
-      subformFields: {},
-      itemOrganList: [],
-      selectOrganId: [],
-      cooperationList: [], // 合作单位列表
-    }
-  },
-  watch: {
-    data: {
-      deep: true,
-      handler(val) {
-        this.generateModle(val.list)
-      }
-    },
-    value: {
-      deep: true,
-      handler(val) {
-        this.models = { ...this.models, ...val }
-      }
-    }
-  },
-  created() {
-    this.itemOrganList = this.organList
-    this.generateModle(this.data.list)
-  },
-  mounted() {
-  },
-  methods: {
-    addSubformCol(item) {
-      var subformFields = {}
-      for (var c of item.columns) {
-        for (var l of c.list) {
-          if (l.options !== null && l.options !== undefined) {
-            subformFields[l.model] = l.options.defaultValue !== undefined && l.options.defaultValue !== null ? l.options.defaultValue: ""
-          } else {
-            subformFields[l.model] = ""
-          }
-
-          if (this.rules[item.model] === undefined) {
-            this.rules[item.model] = []
-          }
-          if (this.rules[item.model][this.models[item.model].length] === undefined) {
-            this.rules[item.model][this.models[item.model].length] = {}
-          }
-          this.rules[item.model][this.models[item.model].length][l.model] = [...l.rules.map(item => {
-            if (item.pattern) {
-              return { ...item, pattern: eval(item.pattern) }
-            } else {
-              return { ...item }
-            }
-          })]
-        }
-      }
-      this.models[item.model].push(subformFields)
-      this.models.status = 1
-    },
-    delSubformCol(item, index) {
-      this.models[item.model].splice(index, 1)
-      this.models.status = -1
-    },
-    generateModle(genList) {
-      for (let i = 0; i < genList.length; i++) {
-        if (genList[i].type === 'grid') {
-          genList[i].columns.forEach(item => {
-            this.generateModle(item.list)
-          })
-        } else {
-          if (this.value && Object.keys(this.value).indexOf(genList[i].model) >= 0) {
-            this.models[genList[i].model] = this.value[genList[i].model]
-          } else {
-            if (genList[i].type === 'blank') {
-              this.$set(this.models, genList[i].model, genList[i].options.defaultType === 'String' ? '' : (genList[i].options.defaultType === 'Object' ? {} : []))
-            } if (genList[i].type === 'subform') { 
-              this.$set(this.models, genList[i].model, [])
-            } else {
-              this.models[genList[i].model] = genList[i].options.defaultValue
-            }
-          }
-
-          if (!this.preview) {
-            if (this.rules[genList[i].model]) {
-              this.rules[genList[i].model] = [...this.rules[genList[i].model], ...genList[i].rules.map(item => {
-                if (item.pattern) {
-                  return { ...item, pattern: eval(item.pattern) }
-                } else {
-                  return { ...item }
-                }
-              })]
-            } else {
-              this.rules[genList[i].model] = [...genList[i].rules.map(item => {
-                if (item.pattern) {
-                  return { ...item, pattern: eval(item.pattern) }
-                } else {
-                  return { ...item }
-                }
-              })]
-            }
-          }
-        }
-      }
-    },
-    getData() {
-      return new Promise((resolve, reject) => {
-        this.$refs.generateForm.validate(valid => {
-          if (valid) {
-            resolve(this.models)
-          } else {
-            reject(new Error(this.$t('fm.message.validError')).message)
-          }
-        })
-      })
-    },
-    reset() {
-      this.$refs.generateForm.resetFields()
-    },
-    async onInputChange(value) {
-      if(!value || this.selectOrganId.includes(value)) { return }
-      let res = await getOrganCooperation({ organId: value })
-      this.cooperationList.push(...res.data)
-    },
-    refresh() {
-
-    }
-  }
-}
-</script>
-
-<style lang="scss">
-// @import '../styles/cover.scss';
-</style>
+<template>
+  <div>
+    <el-form
+      ref="generateForm"
+      label-suffix=":"
+      :size="data.config.size"
+      :model="models"
+      :rules="rules"
+      :label-position="data.config.labelPosition"
+      :label-width="150 + 'px'"
+    >
+      <template v-for="item in templateData">
+        <template v-if="item.type == 'grid'">
+          <el-row
+            :key="item.key"
+            type="flex"
+            :gutter="item.options.gutter ? item.options.gutter : 0"
+            :justify="item.options.justify"
+            :align="item.options.align"
+          >
+            <el-col
+              v-for="(col, colIndex) in item.columns"
+              :key="colIndex"
+              :span="col.span"
+            >
+              <template v-for="citem in col.list">
+                <el-form-item
+                  v-if="citem.type == 'blank'"
+                  :key="citem.key"
+                  :label="citem.name"
+                  :prop="citem.model"
+                >
+                  <slot :name="citem.model" :model="models" />
+                </el-form-item>
+                <genetate-form-item
+                  v-else
+                  :key="citem.key"
+                  :preview="preview"
+                  :models.sync="models"
+                  :organ-list="itemOrganList"
+                  :remote="remote"
+                  :widget="citem"
+                  :data="data"
+                  :prop-value="citem.model"
+                />
+              </template>
+            </el-col>
+          </el-row>
+        </template>
+
+        <template v-else-if="item.type == 'blank'">
+          <el-form-item :key="item.key" :label="item.name" :prop="item.model">
+            <slot :name="item.model" :model="models" />
+          </el-form-item>
+        </template>
+        <!-- 子表单 -->
+        <template v-else-if="item.type === 'subform'">
+          <el-form-item
+            :key="item.key"
+            :label-width="!item.options.labelWidthStatus ? '0px' : 150 + 'px'"
+            :label="!item.options.labelWidthStatus ? '' : item.name"
+          >
+            <el-table
+              :data="models[item.model]"
+              border
+              style="width: 100%"
+              :header-cell-style="{ padding: '5px 0' }"
+              size="mini"
+            >
+              <el-table-column v-if="!preview" fixed width="50">
+                <template slot="header">
+                  <i
+                    style="font-size: 25px; color: #409EFF;cursor:pointer;"
+                    class="el-icon-circle-plus"
+                    @click="addSubformCol(item)"
+                  />
+                </template>
+                <template slot-scope="scope">
+                  <i
+                    style="font-size: 25px; color: red"
+                    class="el-icon-remove"
+                    @click="delSubformCol(item, scope.$index)"
+                  />
+                </template>
+              </el-table-column>
+              <template v-for="(c, i) in item.columns">
+                <div :key="i">
+                  <el-table-column
+                    v-for="v in c.list"
+                    :key="v.key"
+                    :prop="v.model"
+                    :label="v.name"
+                    min-width="250"
+                  >
+                    <template slot-scope="scope">
+                      <genetate-form-item
+                        :prop-value="
+                          item.model + '.' + scope.$index + '.' + v.model
+                        "
+                        :parent-form="item.model + scope.$index"
+                        :preview="preview"
+                        :models.sync="models"
+                        :widget="v"
+                        :remote="remote"
+                        :data="data"
+                        :disabled="disabled"
+                        :is-label="false"
+                        :organ-list="itemOrganList"
+                        :cooperation-list="cooperationList"
+                        :subform-index="scope.$index"
+                        :subform-model="item.model"
+                        @relationFormChange="relationFormChange"
+                      />
+                    </template>
+                  </el-table-column>
+                </div>
+              </template>
+            </el-table>
+          </el-form-item>
+        </template>
+
+        <template v-else>
+          <genetate-form-item
+            :key="item.key"
+            :prop-value="item.model"
+            :preview="preview"
+            :models.sync="models"
+            :widget="item"
+            :remote="remote"
+            :data="data"
+            :organ-list="itemOrganList"
+            :disabled="disabled"
+            @relationFormChange="relationFormChange"
+          />
+        </template>
+      </template>
+    </el-form>
+  </div>
+</template>
+
+<script>
+import GenetateFormItem from "./GenerateFormItem";
+import { getOrganCooperation } from "@/api/process/work-order";
+export default {
+  name: "FmGenerateForm",
+  components: {
+    GenetateFormItem
+  },
+  /* eslint-disable */
+  props: [
+    "data",
+    "remote",
+    "value",
+    "insite",
+    "disabled",
+    "preview",
+    "organList"
+  ],
+  data() {
+    return {
+      templateData: [], // 临时对象
+      formStatus: false,
+      tableData: [],
+      models: {},
+      rules: {},
+      subformFields: {},
+      itemOrganList: [],
+      selectOrganId: [],
+      cooperationList: [] // 合作单位列表
+    };
+  },
+  watch: {
+    data: {
+      deep: true,
+      handler(val) {
+        console.log('true')
+        this.generateModle(val.list);
+      }
+    },
+    value: {
+      deep: true,
+      handler(val) {
+        this.models = { ...this.models, ...val };
+      }
+    }
+  },
+  created() {
+    this.itemOrganList = this.organList;
+    console.log(this.data)
+    this.templateData = this.data.list
+    this.generateModle(this.templateData);
+    if (!this.preview) {
+      let tempData = this.templateData;
+      let hiddenFormList = this.getSelectValueObject(tempData);
+      this.formStatus = hiddenFormList;
+      this.relationFormChange();
+      console.log(this.data);
+    }
+  },
+  mounted() {},
+  methods: {
+    addSubformCol(item) {
+      var subformFields = {};
+      for (var c of item.columns) {
+        for (var l of c.list) {
+          if (l.options !== null && l.options !== undefined) {
+            subformFields[l.model] =
+              l.options.defaultValue !== undefined &&
+              l.options.defaultValue !== null
+                ? l.options.defaultValue
+                : "";
+          } else {
+            subformFields[l.model] = "";
+          }
+
+          if (this.rules[item.model] === undefined) {
+            this.rules[item.model] = [];
+          }
+          if (
+            this.rules[item.model][this.models[item.model].length] === undefined
+          ) {
+            this.rules[item.model][this.models[item.model].length] = {};
+          }
+          this.rules[item.model][this.models[item.model].length][l.model] = [
+            ...l.rules.map(item => {
+              if (item.pattern) {
+                return { ...item, pattern: eval(item.pattern) };
+              } else {
+                return { ...item };
+              }
+            })
+          ];
+        }
+      }
+      this.models[item.model].push(subformFields);
+      this.models.status = 1;
+    },
+    getSelectValueObject(tpls) {
+      let tempList = tpls || [];
+      let status = false;
+      tempList.forEach(list => {
+        if (list.type == "select" && list.options.relationStatus) {
+          status = true;
+        }
+        if (list.type == "subform") {
+          let childList = list.columns || [];
+          childList.forEach(child => {
+            let childList = child.list || [];
+            childList.forEach(c => {
+              if (c.type == "select" && list.options.relationStatus) {
+                status = true;
+              }
+            });
+          });
+        }
+      });
+      return status;
+    },
+    relationFormChange(value) {
+      console.log(value)
+      // false 为显示，true 为隐藏
+      let temp = value || [];
+      let tempData = JSON.parse(JSON.stringify(this.templateData));
+      tempData.forEach(item => {
+        // console.log(!item.options.relationStatus, 'relationStatus')
+        if (this.formStatus) {
+          if (
+            item.type != "text" &&
+            item.type != "subform" &&
+            !item.options.relationStatus
+          ) {
+            item.hidden = true;
+          } else {
+            item.hidden = false;
+          }
+          if (temp.includes(item.model)) {
+            item.hidden = false;
+          }
+        } else {
+          item.hidden = false;
+        }
+        // 子表单  不支持子表单，根据不同的类型显示不同
+        if (item.type == "subform") {
+          (item.columns || []).forEach(child => {
+            if (child.list.length > 0) {
+              child.list.forEach(c => {
+                // c.hidden = true
+                if (this.formStatus) {
+                  if (
+                    c.type != "text" &&
+                    c.type != "subform" &&
+                    !c.options.relationStatus
+                  ) {
+                    c.hidden = true;
+                  } else {
+                    c.hidden = false;
+                  }
+                  if (temp.includes(c.originModel)) {
+                    c.hidden = false;
+                  }
+                } else {
+                  c.hidden = false;
+                }
+              });
+            }
+          });
+          // 重置数据
+          let subForm = this.$refs.subform;
+          subForm.forEach(item => {
+            item.reSetFormData();
+          });
+          let subFormStatus = true;
+          childList.forEach(child => {
+            if (child.list.length > 0) {
+              child.list.forEach(c => {
+                if (!c.hidden) {
+                  subFormStatus = false;
+                }
+              });
+            }
+          });
+          item.hidden = subFormStatus;
+        }
+      });
+      this.templateData = tempData;
+      this.$forceUpdate();
+    },
+    delSubformCol(item, index) {
+      this.models[item.model].splice(index, 1);
+      this.models.status = -1;
+    },
+    generateModle(genList) {
+      for (let i = 0; i < genList.length; i++) {
+        if (genList[i].type === "grid") {
+          genList[i].columns.forEach(item => {
+            this.generateModle(item.list);
+          });
+        } else {
+          if (
+            this.value &&
+            Object.keys(this.value).indexOf(genList[i].model) >= 0
+          ) {
+            this.models[genList[i].model] = this.value[genList[i].model];
+          } else {
+            if (genList[i].type === "blank") {
+              this.$set(
+                this.models,
+                genList[i].model,
+                genList[i].options.defaultType === "String"
+                  ? ""
+                  : genList[i].options.defaultType === "Object"
+                  ? {}
+                  : []
+              );
+            }
+            if (genList[i].type === "subform") {
+              this.$set(this.models, genList[i].model, []);
+            } else {
+              this.models[genList[i].model] = genList[i].options.defaultValue;
+            }
+          }
+
+          if (!this.preview) {
+            if (this.rules[genList[i].model]) {
+              this.rules[genList[i].model] = [
+                ...this.rules[genList[i].model],
+                ...genList[i].rules.map(item => {
+                  if (item.pattern) {
+                    return { ...item, pattern: eval(item.pattern) };
+                  } else {
+                    return { ...item };
+                  }
+                })
+              ];
+            } else {
+              this.rules[genList[i].model] = [
+                ...genList[i].rules.map(item => {
+                  if (item.pattern) {
+                    return { ...item, pattern: eval(item.pattern) };
+                  } else {
+                    return { ...item };
+                  }
+                })
+              ];
+            }
+          }
+        }
+      }
+    },
+    getData() {
+      return new Promise((resolve, reject) => {
+        this.$refs.generateForm.validate(valid => {
+          if (valid) {
+            resolve(this.models);
+          } else {
+            reject(new Error(this.$t("fm.message.validError")).message);
+          }
+        });
+      });
+    },
+    reset() {
+      this.$refs.generateForm.resetFields();
+    },
+    async onInputChange(value) {
+      console.log(value, "onInputChange");
+      if (!value || this.selectOrganId.includes(value)) {
+        return;
+      }
+      let res = await getOrganCooperation({ organId: value });
+      this.cooperationList.push(...res.data);
+    },
+    refresh() {}
+  }
+};
+</script>
+
+<style lang="scss">
+// @import '../styles/cover.scss';
+</style>

src/components/VueFormMaking/components/GenerateFormItem.vue

@@ -1,537 +1,627 @@
-<template>
-  <el-form-item
-    v-if="showStatus"
-    :label-width="isLabel===false||!widget.options.labelWidthStatus?'0px': widgetLabelWidth + 'px'"
-    :label="isLabel===false||widget.type==='divider' || !widget.options.labelWidthStatus?'':widget.name"
-    :prop="propValue"
-    :style="subformIndex !== undefined?{'margin-bottom': '0'}: {}"
-  >
-    <template v-if="preview">
-      <template v-if="widget.type === 'color'">
-        <div style="width: 32px; height: 20px; margin-top: 6px; border-radius: 3px" :style="{'background-color': dataModel}" />
-      </template>
-      <template v-else-if="widget.type=='switch'">
-        <el-switch
-          v-model="dataModel"
-          :disabled="true"
-        />
-      </template>
-      <template v-else-if="widget.type === 'editor'">
-        <div class="previewEditorDiv" v-html="dataModel" />
-      </template>
-
-      <template v-else-if="widget.type=='file'">
-        <div v-for="(uploadUrlItem, uploadUrlIndex) of dataModel" :key="uploadUrlIndex">
-          <i style="color: #909399;" class="el-icon-document" />
-          <a :href="uploadUrlItem.url" target="_blank">{{ uploadUrlItem.name }}</a>
-        </div>
-      </template>
-
-      <template v-else-if="widget.type=='imgupload'">
-        <fm-upload
-          v-model="dataModel"
-          :style="{'width': widget.options.width}"
-          :width="widget.options.size.width"
-          :height="widget.options.size.height"
-          :preview="preview"
-        />
-      </template>
-      <template v-else-if="widget.type =='rate'">
-        <el-rate
-          v-model="dataModel"
-          :max="widget.options.max"
-          :disabled="true"
-          :allow-half="widget.options.allowHalf"
-        />
-      </template>
-      <template v-else-if="widget.type === 'divider'">
-        <el-divider
-          :direction="widget.options.direction"
-          :content-position="widget.options.content_position"
-        >
-          <span
-            :style="{
-              'font-size': widget.options.font_size,
-              'font-family': widget.options.font_family,
-              'font-weight': widget.options.font_weight,
-              'color': widget.options.font_color
-            }"
-          >
-            {{ widget.options.defaultValue }}
-          </span>
-        </el-divider>
-      </template>
-      <template v-else-if="widget.type === 'input' && widget.options.showPassword">
-        <input :value="dataModel" type="password" style="border: none; background-color: #ffffff; color: #303133" disabled="disabled">
-      </template>
-      <template v-else-if="widget.type === 'cascader'">
-        <el-cascader
-          v-model="dataModel"
-          class="preview-cascader-class"
-          :disabled="true"
-          :show-all-levels="widget.options.showAllLevels"
-          :options="widget.options.remote?widget.options.remoteOptions:widget.options.options"
-        />
-      </template>
-      <template v-else>
-        <div v-if="dataModel && dataModel.length > 0">
-          <template v-if="widget.type == 'organ' || widget.type == 'school'">
-            {{ dataModelStr }}
-          </template>
-          <template v-else>
-            {{ dataModel }}
-          </template>
-        </div>
-      </template>
-    </template>
-    <template v-else>
-      <template v-if="widget.type === 'input'">
-        <el-input
-          v-if="widget.options.dataType === 'number'
-            || widget.options.dataType === 'integer'
-            || widget.options.dataType === 'float'"
-          v-model.number="dataModel"
-          :type="widget.options.dataType"
-          :placeholder="widget.options.placeholder"
-          :style="{width: widget.options.width}"
-          :disabled="widget.options.disabled"
-          :show-password="widget.options.showPassword"
-        />
-        <el-input
-          v-else
-          v-model="dataModel"
-          :type="widget.options.dataType"
-          :disabled="widget.options.disabled"
-          :placeholder="widget.options.placeholder"
-          :style="{width: widget.options.width}"
-          :show-password="widget.options.showPassword"
-        />
-      </template>
-
-      <template v-if="widget.type === 'textarea'">
-        <el-input
-          v-model="dataModel"
-          type="textarea"
-          :rows="5"
-          :disabled="widget.options.disabled"
-          :placeholder="widget.options.placeholder"
-          :style="{width: widget.options.width}"
-        />
-      </template>
-
-      <template v-if="widget.type === 'number'">
-        <el-input-number
-          v-model="dataModel"
-          :style="{width: widget.options.width}"
-          :step="widget.options.step"
-          controls-position="right"
-          :disabled="widget.options.disabled"
-        />
-      </template>
-
-      <template v-if="widget.type === 'radio'">
-        <el-radio-group
-          v-model="dataModel"
-          :style="{width: widget.options.width}"
-          :disabled="widget.options.disabled"
-        >
-          <el-radio
-            v-for="(item, index) in (widget.options.remote ? widget.options.remoteOptions : widget.options.options)"
-            :key="index"
-            :style="{display: widget.options.inline ? 'inline-block' : 'block'}"
-            :label="item.value"
-          >
-            <template v-if="widget.options.remote">{{ item.label }}</template>
-            <template v-else>{{ widget.options.showLabel ? item.label : item.value }}</template>
-          </el-radio>
-        </el-radio-group>
-      </template>
-
-      <template v-if="widget.type === 'checkbox'">
-        <el-checkbox-group
-          v-model="dataModel"
-          :style="{width: widget.options.width}"
-          :disabled="widget.options.disabled"
-        >
-          <el-checkbox
-
-            v-for="(item, index) in (widget.options.remote ? widget.options.remoteOptions : widget.options.options)"
-            :key="index"
-            :style="{display: widget.options.inline ? 'inline-block' : 'block'}"
-            :label="item.value"
-          >
-            <template v-if="widget.options.remote">{{ item.label }}</template>
-            <template v-else>{{ widget.options.showLabel ? item.label : item.value }}</template>
-          </el-checkbox>
-        </el-checkbox-group>
-      </template>
-
-      <template v-if="widget.type === 'time'">
-        <el-time-picker
-          v-model="dataModel"
-          :is-range="widget.options.isRange"
-          :placeholder="widget.options.placeholder"
-          :start-placeholder="widget.options.startPlaceholder"
-          :end-placeholder="widget.options.endPlaceholder"
-          :readonly="widget.options.readonly"
-          :disabled="widget.options.disabled"
-          :editable="widget.options.editable"
-          :clearable="widget.options.clearable"
-          :arrow-control="widget.options.arrowControl"
-          :value-format="widget.options.format"
-          :style="{width: widget.options.width}"
-        />
-      </template>
-
-      <template v-if="widget.type=='date'">
-        <el-date-picker
-          v-model="dataModel"
-          :type="widget.options.type"
-          :placeholder="widget.options.placeholder"
-          :start-placeholder="widget.options.startPlaceholder"
-          :end-placeholder="widget.options.endPlaceholder"
-          :readonly="widget.options.readonly"
-          :disabled="widget.options.disabled"
-          :editable="widget.options.editable"
-          :clearable="widget.options.clearable"
-          :value-format="widget.options.timestamp ? 'timestamp' : widget.options.format"
-          :format="widget.options.format"
-          :style="{width: widget.options.width}"
-        />
-      </template>
-
-      <template v-if="widget.type =='rate'">
-        <el-rate
-          v-model="dataModel"
-          :max="widget.options.max"
-          :disabled="widget.options.disabled"
-          :allow-half="widget.options.allowHalf"
-        />
-      </template>
-
-      <template v-if="widget.type === 'color'">
-        <el-color-picker
-          v-model="dataModel"
-          :disabled="widget.options.disabled"
-          :show-alpha="widget.options.showAlpha"
-        />
-      </template>
-
-      <template v-if="widget.type === 'select'">
-        <el-select
-          v-model="dataModel"
-          :disabled="widget.options.disabled"
-          :multiple="widget.options.multiple"
-          :clearable="widget.options.clearable"
-          :placeholder="widget.options.placeholder"
-          :style="{width: widget.options.width}"
-          :filterable="widget.options.filterable"
-        >
-          <el-option v-for="item in (widget.options.remote ? widget.options.remoteOptions : widget.options.options)" :key="item.value" :value="item.value" :label="widget.options.showLabel || widget.options.remote?item.label:item.value" />
-        </el-select>
-      </template>
-
-      <template v-if="widget.type === 'organ'">
-        <el-select
-          v-model="dataModel"
-          :disabled="widget.options.disabled"
-          :multiple="widget.options.multiple"
-          :clearable="widget.options.clearable"
-          :placeholder="widget.options.placeholder"
-          :style="{width: widget.options.width}"
-          :filterable="widget.options.filterable"
-        >
-          <el-option v-for="item in (widget.options.remote ? widget.options.remoteOptions : widget.options.options)" :key="item.value" :value="item.value" :label="widget.options.showLabel || widget.options.remote?item.label:item.value" />
-        </el-select>
-      </template>
-
-      <template v-if="widget.type === 'school'">
-        <el-select
-          v-model="dataModel"
-          :disabled="widget.options.disabled"
-          :multiple="widget.options.multiple"
-          :clearable="widget.options.clearable"
-          :placeholder="widget.options.placeholder"
-          :style="{width: widget.options.width}"
-          :filterable="widget.options.filterable"
-        >
-          <el-option v-for="item in (widget.options.remote ? widget.options.remoteOptions : widget.options.options)" :key="item.value" :value="item.value" :label="widget.options.showLabel || widget.options.remote?item.label:item.value" />
-        </el-select>
-      </template>
-
-      <template v-if="widget.type=='switch'">
-        <el-switch
-          v-model="dataModel"
-          :disabled="widget.options.disabled"
-        />
-      </template>
-
-      <template v-if="widget.type=='slider'">
-        <el-slider
-          v-model="dataModel"
-          :min="widget.options.min"
-          :max="widget.options.max"
-          :disabled="widget.options.disabled"
-          :step="widget.options.step"
-          :show-input="widget.options.showInput"
-          :range="widget.options.range"
-          :style="{width: widget.options.width}"
-        />
-      </template>
-
-      <template v-if="widget.type=='imgupload'">
-        <fm-upload
-          v-model="dataModel"
-          :disabled="widget.options.disabled"
-          :style="{'width': widget.options.width}"
-          :width="widget.options.size.width"
-          :height="widget.options.size.height"
-          :token="widget.options.token"
-          :domain="widget.options.domain"
-          :multiple="widget.options.multiple"
-          :length="widget.options.length"
-          :is-qiniu="widget.options.isQiniu"
-          :is-delete="widget.options.isDelete"
-          :min="widget.options.min"
-          :is-edit="widget.options.isEdit"
-          :action="widget.options.action"
-        />
-      </template>
-
-      <template v-if="widget.type=='file'">
-        <FileUpload :element="widget" :data-model="dataModel" @fileList="fileList" />
-      </template>
-
-      <template v-if="widget.type === 'editor'">
-        <vue-editor
-          v-model="dataModel"
-          :disabled="widget.options.disabled"
-          :style="{width: widget.options.width}"
-        />
-      </template>
-
-      <template v-if="widget.type === 'cascader'">
-        <el-cascader
-          v-model="dataModel"
-          :disabled="widget.options.disabled"
-          :show-all-levels="widget.options.showAllLevels"
-          :clearable="widget.options.clearable"
-          :placeholder="widget.options.placeholder"
-          :style="{width: widget.options.width}"
-          :options="widget.options.remote?widget.options.remoteOptions:widget.options.options"
-        />
-      </template>
-
-      <template v-if="widget.type === 'text'">
-        <span
-          :style="{
-            'font-size': widget.options.font_size,
-            'font-family': widget.options.font_family,
-            'font-weight': widget.options.font_weight,
-            'color': widget.options.font_color
-          }"
-        >
-          {{ widget.options.defaultValue }}
-        </span>
-      </template>
-
-      <template v-if="widget.type === 'divider'">
-        <el-divider
-          :direction="widget.options.direction"
-          :content-position="widget.options.content_position"
-        >
-          <span
-            :style="{
-              'font-size': widget.options.font_size,
-              'font-family': widget.options.font_family,
-              'font-weight': widget.options.font_weight,
-              'color': widget.options.font_color
-            }"
-          >
-            {{ widget.options.defaultValue }}
-          </span>
-        </el-divider>
-      </template>
-    </template>
-
-  </el-form-item>
-</template>
-
-<script>
-import FmUpload from './Upload'
-import FileUpload from './Upload/file'
-
-export default {
-  name: 'GenetateFormItem',
-  components: {
-    FmUpload,
-    FileUpload
-  },
-  /* eslint-disable */
-  props: ['widget', 'models', 'propValue', 'remote', 'data', 'disabled', 'preview', 'isLabel', 'subformIndex', 'subformModel', 'organList', 'cooperationList'],
-  data() {
-    return {
-      showStatus: true,
-      widgetLabelWidth: '',
-      dataModel: this.subformIndex===undefined?
-        this.models[this.widget.model]:
-        this.models[this.subformModel][this.subformIndex][this.widget.model],
-      dataModelStr: null,
-      tableData: []
-    }
-  },
-  watch: {
-    dataModel: {
-      deep: true,
-      handler(newValue) {
-        if (newValue !== undefined && newValue !== null) {
-          if (this.subformIndex !== undefined) {
-            this.models[this.subformModel][this.subformIndex][this.widget.model] = newValue
-            this.$emit('update:models', {
-              ...this.models,
-              [this.subformModel]: this.models[this.subformModel]
-            })
-            // this.$emit('input-change', val, this.widget.model, this.subformIndex)
-          } else {
-            this.models[this.widget.model] = newValue
-            this.$emit('update:models', {
-              ...this.models,
-              [this.widget.model]: newValue
-            })
-            // this.$emit('input-change', val, this.widget.model)
-          }
-        }
-      }
-    },
-    models: {
-      deep: true,
-      handler(val) {
-        if (val.status === undefined && val.status === null) {
-          if (this.subformIndex === undefined) {
-            this.dataModel = val[this.widget.model]
-          } else {
-            this.dataModel = val[this.subformModel][this.subformIndex][this.widget.model]
-          }
-        }
-        delete this.models.status
-        this.handleDisplayVerifiy()
-      }
-    },
-    cooperationList: {
-      deep: true,
-      handler(val) {
-        if(this.widget.type == 'school' && this.preview) {
-          let tempStr = null
-          val.forEach(item => {
-            if(item.id == this.dataModel) {
-              tempStr = item.name
-            }
-          });
-          this.dataModelStr = tempStr
-        }
-      }
-    }
-  },
-  created() {
-    // 判断当前元素是否是分部表单（）
-    if(this.widget.type == 'organ' && this.preview) {
-      this.$emit('input-change', this.dataModel)
-      let tempStr = null
-      this.organList.forEach(item => {
-        if(item.id == this.dataModel) {
-          tempStr = item.name
-        }
-      });
-      this.dataModelStr = tempStr
-    }
-    // if(this.widget.type == 'school' && this.preview) {
-    //   let tempStr = null
-    //   this.cooperationList.forEach(item => {
-    //     if(item.id == this.dataModel) {
-    //       tempStr = item.name
-    //     }
-    //   });
-    //   console.log(tempStr, this.dataModel)
-    //   // this.dataModel = tempStr
-    // }
-    if (this.widget.options.remote && this.remote[this.widget.options.remoteFunc]) {
-      this.remote[this.widget.options.remoteFunc]((data) => {
-        this.widget.options.remoteOptions = data.map(item => {
-          return {
-            value: item[this.widget.options.props.value],
-            label: item[this.widget.options.props.label],
-            children: item[this.widget.options.props.children]
-          }
-        })
-      })
-    }
-
-    if (this.widget.type === 'imgupload' && this.widget.options.isQiniu) {
-      this.remote[this.widget.options.tokenFunc]((data) => {
-        this.widget.options.token = data
-      })
-    }
-
-    if (this.disabled !== undefined && this.disabled !== null) {
-      this.widget.options.disabled = this.disabled
-    }
-
-    // label width
-    if (this.widget.options.labelWidthDisabled) {
-      this.widgetLabelWidth = this.widget.options.labelWidth
-    } else if (this.widget.type==='divider') {
-      this.widgetLabelWidth = 0
-    } else {
-      this.widgetLabelWidth = this.data.config.labelWidth
-    }
-
-    this.handleDisplayVerifiy()
-  },
-  methods: {
-    fileList(files) {
-      this.dataModel = files
-    },
-    handleDisplayVerifiy() {
-      if (Object.keys(this.widget.options).indexOf('displayVerifiy')>=0) {
-        if (this.widget.options.displayVerifiy.type !== 'hide') {
-          var c = 0
-          for (var v of this.widget.options.displayVerifiy.list) {
-            if (this.models[v.model].toString() === v.value) {
-              c++
-            }
-          }
-          if (this.widget.options.displayVerifiy.type === 'and') {
-            if (c !== this.widget.options.displayVerifiy.list.length) {
-              this.showStatus = false
-            } else {
-              this.showStatus = true
-            }
-          } else if (this.widget.options.displayVerifiy.type === 'or')  {
-            if (c === 0) {
-              this.showStatus = false
-            } else {
-              this.showStatus = true
-            }
-          }
-        }
-      }
-    }
-  }
-}
-</script>
-
-<style>
-  .previewEditorDiv > p {
-    margin: 0;
-  }
-
-  .preview-cascader-class .el-input.is-disabled .el-input__inner {
-    background-color: #fff;
-    border: none;
-    color: #303133;
-  }
-
-  .preview-cascader-class .el-input.is-disabled .el-input__suffix .el-input__suffix-inner .el-input__icon.el-icon-arrow-down:before {
-    content: ''
-  }
-</style>
+<template>
+  <el-form-item
+    v-if="showStatus && !widget.hidden"
+    :label-width="isLabel===false||!widget.options.labelWidthStatus?'0px': widgetLabelWidth + 'px'"
+    :label="isLabel===false||widget.type==='divider' || !widget.options.labelWidthStatus?'':widget.name"
+    :prop="propValue"
+    :class="parentForm"
+    :style="subformIndex !== undefined?{'margin-bottom': '0'}: {}"
+  >
+    <template v-if="preview">
+      <template v-if="widget.type === 'color'">
+        <div style="width: 32px; height: 20px; margin-top: 6px; border-radius: 3px" :style="{'background-color': dataModel}" />
+      </template>
+      <template v-else-if="widget.type=='switch'">
+        <el-switch
+          v-model="dataModel"
+          :disabled="true"
+        />
+      </template>
+      <template v-else-if="widget.type === 'editor'">
+        <div class="previewEditorDiv" v-html="dataModel" />
+      </template>
+
+      <template v-else-if="widget.type=='file'">
+        <div v-for="(uploadUrlItem, uploadUrlIndex) of dataModel" :key="uploadUrlIndex">
+          <i style="color: #909399;" class="el-icon-document" />
+          <a :href="uploadUrlItem.url" target="_blank">{{ uploadUrlItem.name }}</a>
+        </div>
+      </template>
+
+      <template v-else-if="widget.type=='imgupload'">
+        <fm-upload
+          v-model="dataModel"
+          :style="{'width': widget.options.width}"
+          :width="widget.options.size.width"
+          :height="widget.options.size.height"
+          :preview="preview"
+        />
+      </template>
+      <template v-else-if="widget.type =='rate'">
+        <el-rate
+          v-model="dataModel"
+          :max="widget.options.max"
+          :disabled="true"
+          :allow-half="widget.options.allowHalf"
+        />
+      </template>
+      <template v-else-if="widget.type === 'divider'">
+        <el-divider
+          :direction="widget.options.direction"
+          :content-position="widget.options.content_position"
+        >
+          <span
+            :style="{
+              'font-size': widget.options.font_size,
+              'font-family': widget.options.font_family,
+              'font-weight': widget.options.font_weight,
+              'color': widget.options.font_color
+            }"
+          >
+            {{ widget.options.defaultValue }}
+          </span>
+        </el-divider>
+      </template>
+      <template v-else-if="widget.type === 'input' && widget.options.showPassword">
+        <input :value="dataModel" type="password" style="border: none; background-color: #ffffff; color: #303133" disabled="disabled">
+      </template>
+      <template v-else-if="widget.type === 'cascader'">
+        <el-cascader
+          v-model="dataModel"
+          class="preview-cascader-class"
+          :disabled="true"
+          :show-all-levels="widget.options.showAllLevels"
+          :options="widget.options.remote?widget.options.remoteOptions:widget.options.options"
+        />
+      </template>
+      <template v-else>
+        <div v-if="dataModel">
+          <template v-if="widget.type == 'organ' || widget.type == 'school'">
+            {{ dataModelStr }}
+          </template>
+          <template v-else>
+            {{ dataModel }}
+          </template>
+        </div>
+      </template>
+    </template>
+    <template v-else>
+      <template v-if="widget.type === 'input'">
+        <el-input
+          v-if="widget.options.dataType === 'number'
+            || widget.options.dataType === 'integer'
+            || widget.options.dataType === 'float'"
+          v-model="dataModel"
+          :type="widget.options.dataType"
+          @input="onInputChangeNumber($event)"
+          :placeholder="widget.options.placeholder"
+          :style="{width: widget.options.width}"
+          :disabled="widget.options.disabled"
+          :show-password="widget.options.showPassword"
+        />
+        <el-input
+          v-else
+          v-model="dataModel"
+          :type="widget.options.dataType"
+          :disabled="widget.options.disabled"
+          :placeholder="widget.options.placeholder"
+          :style="{width: widget.options.width}"
+          :show-password="widget.options.showPassword"
+        />
+      </template>
+
+      <template v-if="widget.type === 'textarea'">
+        <el-input
+          v-model="dataModel"
+          type="textarea"
+          :rows="5"
+          :disabled="widget.options.disabled"
+          :placeholder="widget.options.placeholder"
+          :style="{width: widget.options.width}"
+        />
+      </template>
+
+      <template v-if="widget.type === 'number'">
+        <el-input-number
+          v-model="dataModel"
+          :style="{width: widget.options.width}"
+          :step="widget.options.step"
+          controls-position="right"
+          :disabled="widget.options.disabled"
+        />
+      </template>
+
+      <template v-if="widget.type === 'radio'">
+        <el-radio-group
+          v-model="dataModel"
+          :style="{width: widget.options.width}"
+          :disabled="widget.options.disabled"
+        >
+          <el-radio
+            v-for="(item, index) in (widget.options.remote ? widget.options.remoteOptions : widget.options.options)"
+            :key="index"
+            :style="{display: widget.options.inline ? 'inline-block' : 'block'}"
+            :label="item.value"
+          >
+            <template v-if="widget.options.remote">{{ item.label }}</template>
+            <template v-else>{{ widget.options.showLabel ? item.label : item.value }}</template>
+          </el-radio>
+        </el-radio-group>
+      </template>
+
+      <template v-if="widget.type === 'checkbox'">
+        <el-checkbox-group
+          v-model="dataModel"
+          :style="{width: widget.options.width}"
+          :disabled="widget.options.disabled"
+        >
+          <el-checkbox
+
+            v-for="(item, index) in (widget.options.remote ? widget.options.remoteOptions : widget.options.options)"
+            :key="index"
+            :style="{display: widget.options.inline ? 'inline-block' : 'block'}"
+            :label="item.value"
+          >
+            <template v-if="widget.options.remote">{{ item.label }}</template>
+            <template v-else>{{ widget.options.showLabel ? item.label : item.value }}</template>
+          </el-checkbox>
+        </el-checkbox-group>
+      </template>
+
+      <template v-if="widget.type === 'time'">
+        <el-time-picker
+          v-model="dataModel"
+          :is-range="widget.options.isRange"
+          :placeholder="widget.options.placeholder"
+          :start-placeholder="widget.options.startPlaceholder"
+          :end-placeholder="widget.options.endPlaceholder"
+          :readonly="widget.options.readonly"
+          :disabled="widget.options.disabled"
+          :editable="widget.options.editable"
+          :clearable="widget.options.clearable"
+          :arrow-control="widget.options.arrowControl"
+          :value-format="widget.options.format"
+          :style="{width: widget.options.width}"
+        />
+      </template>
+
+      <template v-if="widget.type=='date'">
+        <el-date-picker
+          v-model="dataModel"
+          :type="widget.options.type"
+          :placeholder="widget.options.placeholder"
+          :start-placeholder="widget.options.startPlaceholder"
+          :end-placeholder="widget.options.endPlaceholder"
+          :readonly="widget.options.readonly"
+          :disabled="widget.options.disabled"
+          :editable="widget.options.editable"
+          :clearable="widget.options.clearable"
+          :value-format="widget.options.timestamp ? 'timestamp' : widget.options.format"
+          :format="widget.options.format"
+          :style="{width: widget.options.width}"
+        />
+      </template>
+
+      <template v-if="widget.type =='rate'">
+        <el-rate
+          v-model="dataModel"
+          :max="widget.options.max"
+          :disabled="widget.options.disabled"
+          :allow-half="widget.options.allowHalf"
+        />
+      </template>
+
+      <template v-if="widget.type === 'color'">
+        <el-color-picker
+          v-model="dataModel"
+          :disabled="widget.options.disabled"
+          :show-alpha="widget.options.showAlpha"
+        />
+      </template>
+
+      <template v-if="widget.type === 'select'">
+        <el-select
+          v-model="dataModel"
+          :disabled="widget.options.disabled"
+          :multiple="widget.options.multiple"
+          :clearable="widget.options.clearable"
+          :placeholder="widget.options.placeholder"
+          :style="{width: widget.options.width}"
+          :filterable="widget.options.filterable"
+          @change="onChangeSelect"
+        >
+          <el-option v-for="item in (widget.options.remote ? widget.options.remoteOptions : widget.options.options)" :key="item.value" :value="item.value" :label="widget.options.showLabel || widget.options.remote?item.label:item.value" />
+        </el-select>
+      </template>
+
+      <template v-if="widget.type === 'organ'">
+        <el-select
+          v-model="dataModel"
+          :disabled="widget.options.disabled"
+          :multiple="widget.options.multiple"
+          clearable
+          :placeholder="widget.options.placeholder"
+          :style="{width: widget.options.width}"
+          :filterable="widget.options.filterable"
+          :name="widget.model"
+        >
+          <el-option v-for="item in organList" :key="item.id" :value="item.id" :label="item.name" />
+        </el-select>
+      </template>
+
+      <template v-if="widget.type === 'school'">
+        <el-select
+          v-model="dataModel"
+          :disabled="widget.options.disabled"
+          :multiple="widget.options.multiple"
+          clearable
+          :placeholder="widget.options.placeholder"
+          :style="{width: widget.options.width}"
+          :filterable="widget.options.filterable"
+           :loading="selectLoading"
+          @visible-change="onGetSchoolList"
+        >
+          <el-option v-for="item in cooperationList" :key="item.id" :value="item.id" :label="item.name" />
+        </el-select>
+      </template>
+
+      <template v-if="widget.type=='switch'">
+        <el-switch
+          v-model="dataModel"
+          :disabled="widget.options.disabled"
+        />
+      </template>
+
+      <template v-if="widget.type=='slider'">
+        <el-slider
+          v-model="dataModel"
+          :min="widget.options.min"
+          :max="widget.options.max"
+          :disabled="widget.options.disabled"
+          :step="widget.options.step"
+          :show-input="widget.options.showInput"
+          :range="widget.options.range"
+          :style="{width: widget.options.width}"
+        />
+      </template>
+
+      <template v-if="widget.type=='imgupload'">
+        <fm-upload
+          v-model="dataModel"
+          :disabled="widget.options.disabled"
+          :style="{'width': widget.options.width}"
+          :width="widget.options.size.width"
+          :height="widget.options.size.height"
+          :token="widget.options.token"
+          :domain="widget.options.domain"
+          :multiple="widget.options.multiple"
+          :length="widget.options.length"
+          :is-qiniu="widget.options.isQiniu"
+          :is-delete="widget.options.isDelete"
+          :min="widget.options.min"
+          :is-edit="widget.options.isEdit"
+          :action="widget.options.action"
+        />
+      </template>
+
+      <template v-if="widget.type=='file'">
+        <FileUpload :element="widget" :data-model="dataModel" @fileList="fileList" />
+      </template>
+
+      <template v-if="widget.type === 'editor'">
+        <vue-editor
+          v-model="dataModel"
+          :disabled="widget.options.disabled"
+          :style="{width: widget.options.width}"
+        />
+      </template>
+
+      <template v-if="widget.type === 'cascader'">
+        <el-cascader
+          v-model="dataModel"
+          :disabled="widget.options.disabled"
+          :show-all-levels="widget.options.showAllLevels"
+          :clearable="widget.options.clearable"
+          :placeholder="widget.options.placeholder"
+          :style="{width: widget.options.width}"
+          :options="widget.options.remote?widget.options.remoteOptions:widget.options.options"
+        />
+      </template>
+
+      <template v-if="widget.type === 'text'">
+        <span
+          :style="{
+            'font-size': widget.options.font_size,
+            'font-family': widget.options.font_family,
+            'font-weight': widget.options.font_weight,
+            'color': widget.options.font_color
+          }"
+        >
+          {{ widget.options.defaultValue }}
+        </span>
+      </template>
+
+      <template v-if="widget.type === 'divider'">
+        <el-divider
+          :direction="widget.options.direction"
+          :content-position="widget.options.content_position"
+        >
+          <span
+            :style="{
+              'font-size': widget.options.font_size,
+              'font-family': widget.options.font_family,
+              'font-weight': widget.options.font_weight,
+              'color': widget.options.font_color
+            }"
+          >
+            {{ widget.options.defaultValue }}
+          </span>
+        </el-divider>
+      </template>
+    </template>
+
+  </el-form-item>
+</template>
+
+<script>
+import FmUpload from './Upload'
+import FileUpload from './Upload/file'
+import {
+  getOrganCooperation
+} from '@/api/process/work-order'
+export default {
+  name: 'GenetateFormItem',
+  components: {
+    FmUpload,
+    FileUpload
+  },
+  /* eslint-disable */
+  props: ['widget', 'models', 'propValue', 'parentForm', 'remote', 'data', 'disabled', 'preview', 'isLabel', 'subformIndex', 'subformModel', 'organList'],
+  data() {
+    return {
+      showStatus: true,
+      widgetLabelWidth: '',
+      dataModel: this.subformIndex===undefined?
+        this.models[this.widget.model]:
+        this.models[this.subformModel][this.subformIndex][this.widget.model],
+      dataModelStr: null,
+      tableData: [],
+      cooperationList: [],
+      selectLoading: true
+    }
+  },
+  watch: {
+    dataModel: {
+      deep: true,
+      handler(newValue) {
+        // console.log(newValue, 'model', this.widget.model)
+        if (newValue !== undefined && newValue !== null) {
+          if (this.subformIndex !== undefined) {
+            this.models[this.subformModel][this.subformIndex][this.widget.model] = newValue
+            this.$emit('update:models', {
+              ...this.models,
+              [this.subformModel]: this.models[this.subformModel]
+            })
+            // this.$emit('input-change', val, this.widget.model, this.subformIndex)
+          } else {
+            this.models[this.widget.model] = newValue
+            this.$emit('update:models', {
+              ...this.models,
+              [this.widget.model]: newValue
+            })
+            // this.$emit('input-change', val, this.widget.model)
+          }
+        }
+      }
+    },
+    models: {
+      deep: true,
+      async handler(val) {
+        // console.log(val, 'show')
+        if (val.status === undefined && val.status === null) {
+          if (this.subformIndex === undefined) {
+            this.dataModel = val[this.widget.model]
+          } else {
+            this.dataModel = val[this.subformModel][this.subformIndex][this.widget.model]
+          }
+        }
+        delete this.models.status
+        this.handleDisplayVerifiy()
+      }
+    },
+    cooperationList: {
+      deep: true,
+      handler(val) {
+        if(this.widget.type == 'school' && this.preview) {
+          let tempStr = null
+          val.forEach(item => {
+            if(item.id == this.dataModel) {
+              tempStr = item.name
+            }
+          });
+          this.dataModelStr = tempStr
+        }
+      }
+    }
+  },
+  created() {
+    // 判断当前元素是否是分部表单（）
+    if(this.widget.type == 'organ' && this.preview) {
+      let tempStr = null
+      this.organList.forEach(item => {
+        if(item.id == this.dataModel) {
+          tempStr = item.name
+        }
+      });
+      this.dataModelStr = tempStr
+    }
+    // 学校信息
+    if(this.widget.type == 'school' && this.preview) {
+      this.onGetSchoolList(true)
+    //   let tempStr = null
+    //   this.cooperationList.forEach(item => {
+    //     if(item.id == this.dataModel) {
+    //       tempStr = item.name
+    //     }
+    //   });
+    //   // this.dataModel = tempStr
+    }
+
+    if (this.widget.options.remote && this.remote[this.widget.options.remoteFunc]) {
+      this.remote[this.widget.options.remoteFunc]((data) => {
+        this.widget.options.remoteOptions = data.map(item => {
+          return {
+            value: item[this.widget.options.props.value],
+            label: item[this.widget.options.props.label],
+            children: item[this.widget.options.props.children]
+          }
+        })
+      })
+    }
+
+    if (this.widget.type === 'imgupload' && this.widget.options.isQiniu) {
+      this.remote[this.widget.options.tokenFunc]((data) => {
+        this.widget.options.token = data
+      })
+    }
+
+    if (this.disabled !== undefined && this.disabled !== null) {
+      this.widget.options.disabled = this.disabled
+    }
+
+    // label width
+    if (this.widget.options.labelWidthDisabled) {
+      this.widgetLabelWidth = this.widget.options.labelWidth
+    } else if (this.widget.type==='divider') {
+      this.widgetLabelWidth = 0
+    } else {
+      this.widgetLabelWidth = 150
+    }
+
+    this.handleDisplayVerifiy()
+  },
+  methods: {
+    // select 选择时触发
+    onChangeSelect() {
+      let relationArray = []
+      // console.log(this.widget.options.options)
+      this.widget.options && this.widget.options.options.forEach(item => {
+          if(this.dataModel == item.value) {
+              let tempRelation = item.relationOptions || []
+              relationArray.push(...tempRelation)
+          }
+      })
+      if(relationArray.length > 0) {
+          this.$emit('relationFormChange', relationArray)
+      }
+    },
+    async onGetSchoolList(val) {
+      // 隐藏的时候的不获取数据，
+      // 为什么每次都需要请求，因为我没有判断分部数据是否有修改
+      if(!val) {
+        return
+      }
+      let organId = null
+      this.selectLoading = true
+      if(this.subformModel) {
+        organId = this.models[this.subformModel][this.subformIndex][this.widget.options.displayRelation]
+      } else {
+        organId = this.models[this.subformIndex][this.widget.options.displayRelation]
+      }
+      // // 判断是否有选择分部 判断列表已经有数据了
+      if(organId) {
+        let res = await getOrganCooperation({ organId })
+        this.cooperationList = [...res.data]
+      }
+      this.selectLoading = false
+    },
+    // 处理用户输入的值 input框
+    onInputChangeNumber(event) {
+      // 不用处理string类型的
+      // console.log(event, this.widget.options)
+      const type = this.widget.options.dataType
+      if(type == 'number' || type == 'integer') {
+        this.onVerifiyNumberInteger(event)
+      } else if(type == 'float') {
+        this.verifyNumberIntegerAndFloat(event)
+      }
+    },
+    verifyNumberIntegerAndFloat(val) {
+      // val = this.ruleForm.test;
+      // 匹配空格
+      // console.log(val)
+      let v = val.replace(/(^\s*)|(\s*$)/g, '');
+      // 只能是数字和小数点，不能是其他输入
+      v = v.replace(/[^\d.]/g, '');
+      // 以0开始只能输入一个
+      v = v.replace(/^0{2}$/g, '0');
+      // 保证第一位只能是数字，不能是点
+      v = v.replace(/^\./g, '');
+      // 小数只能出现1位
+      v = v.replace('.', '$#$').replace(/\./g, '').replace('$#$', '.');
+      // 小数点后面保留2位
+      v = v.replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3');
+      // 返回结果
+      this.dataModel = v;
+    },
+    onVerifiyNumberInteger(val) {
+      // 匹配空格
+      let v = val.replace(/(^\s*)|(\s*$)/g, '');
+      // 去掉 '.' , 防止贴贴的时候出现问题 如 0.1.12.12
+      v = v.replace(/[\.]*/g, '');
+      // 去掉以 0 开始后面的数, 防止贴贴的时候出现问题 如 00121323
+      v = v.replace(/(^0[\d]*)$/g, '0');
+      // 首位是0,只能出现一次
+      v = v.replace(/^0\d$/g, '0');
+      // 只匹配数字
+      v = v.replace(/[^\d]/g, '');
+      // 返回结果
+      this.dataModel = v;
+    },
+    fileList(files) {
+      this.dataModel = files
+    },
+    handleDisplayVerifiy() {
+      if (Object.keys(this.widget.options).indexOf('displayVerifiy')>=0) {
+        if (this.widget.options.displayVerifiy.type !== 'hide') {
+          var c = 0
+          for (var v of this.widget.options.displayVerifiy.list) {
+            if (this.models[v.model].toString() === v.value) {
+              c++
+            }
+          }
+          if (this.widget.options.displayVerifiy.type === 'and') {
+            if (c !== this.widget.options.displayVerifiy.list.length) {
+              this.showStatus = false
+            } else {
+              this.showStatus = true
+            }
+          } else if (this.widget.options.displayVerifiy.type === 'or')  {
+            if (c === 0) {
+              this.showStatus = false
+            } else {
+              this.showStatus = true
+            }
+          }
+        }
+      }
+    }
+  }
+}
+</script>
+
+<style>
+  .previewEditorDiv > p {
+    margin: 0;
+  }
+
+  .preview-cascader-class .el-input.is-disabled .el-input__inner {
+    background-color: #fff;
+    border: none;
+    color: #303133;
+  }
+
+  .preview-cascader-class .el-input.is-disabled .el-input__suffix .el-input__suffix-inner .el-input__icon.el-icon-arrow-down:before {
+    content: ''
+  }
+</style>

src/components/VueFormMaking/components/Upload/file.vue

@@ -1,63 +1,63 @@
-<template>
-  <div>
-    <el-upload
-      :action="element.options.action"
-      :on-success="handleSuccess"
-      :on-preview="handlePreview"
-      :on-remove="handleRemove"
-      :before-remove="beforeRemove"
-      multiple
-      :limit="element.options.length"
-      :headers="element.options.headers"
-      :on-exceed="handleExceed"
-      :file-list="dataModel"
-      :disabled="element.options.disabled"
-      :style="{'width': element.options.width}"
-    >
-      <div v-if="!preview">
-        <el-button size="small" type="primary">点击上传</el-button>
-        <div slot="tip" class="el-upload__tip">{{ element.options.tip }}</div>
-      </div>
-    </el-upload>
-  </div>
-</template>
-
-<script>
-export default {
-  name: 'FileUpload',
-  // eslint-disable-next-line vue/require-prop-types
-  props: ['element', 'preview', 'dataModel'],
-  data() {
-    return {
-      fileListTmp: []
-    }
-  },
-  methods: {
-    handleRemove(file, fileList) {
-      this.fileListTmp = fileList
-      this.$emit('fileList', fileList)
-    },
-    handlePreview(file) {
-      window.open(file.url, '_blank')
-    },
-    handleExceed(files, fileList) {
-      this.$message.warning(`最多允许上传 ${this.element.options.length} 个文件。`)
-    },
-    beforeRemove(file, fileList) {
-      return this.$confirm(`确定要移除 ${file.name}？`)
-    },
-    handleSuccess(response, file, fileList) {
-      this.fileListTmp.push({
-        uid: file.uid,
-        name: file.name,
-        url: response.data
-      })
-      this.$emit('fileList', this.fileListTmp)
-    }
-  }
-}
-</script>
-
-<style scoped>
-
-</style>
+<template>
+  <div>
+    <el-upload
+      action="/api-web/uploadFile"
+      :on-success="handleSuccess"
+      :on-preview="handlePreview"
+      :on-remove="handleRemove"
+      :before-remove="beforeRemove"
+      multiple
+      :limit="element.options.length"
+      :headers="element.options.headers"
+      :on-exceed="handleExceed"
+      :file-list="dataModel"
+      :disabled="element.options.disabled"
+      :style="{'width': element.options.width}"
+    >
+      <div v-if="!preview">
+        <el-button size="small" type="primary">点击上传</el-button>
+        <div slot="tip" class="el-upload__tip">{{ element.options.tip }}</div>
+      </div>
+    </el-upload>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'FileUpload',
+  // eslint-disable-next-line vue/require-prop-types
+  props: ['element', 'preview', 'dataModel'],
+  data() {
+    return {
+      fileListTmp: []
+    }
+  },
+  methods: {
+    handleRemove(file, fileList) {
+      this.fileListTmp = fileList
+      this.$emit('fileList', fileList)
+    },
+    handlePreview(file) {
+      window.open(file.url, '_blank')
+    },
+    handleExceed(files, fileList) {
+      this.$message.warning(`最多允许上传 ${this.element.options.length} 个文件。`)
+    },
+    beforeRemove(file, fileList) {
+      return this.$confirm(`确定要移除 ${file.name}？`)
+    },
+    handleSuccess(response, file, fileList) {
+      this.fileListTmp.push({
+        uid: file.uid,
+        name: file.name,
+        url: response.data.url
+      })
+      this.$emit('fileList', this.fileListTmp)
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/components/VueFormMaking/components/Upload/index.vue

@@ -1,474 +1,476 @@
-<template>
-  <div
-    :id="uploadId"
-    class="fm-uplaod-container"
-  >
-    <draggable
-      v-model="fileList"
-      class="drag-img-list"
-      v-bind="{group: uploadId, ghostClass: 'ghost', animation: 200}"
-      :no-transition-on-drag="true"
-    >
-      <div
-        v-for="(item) in fileList"
-        :id="item.key"
-        :key="item.key"
-        :style="{width: width+'px', height: height+'px'}"
-        :class="{uploading: item.status=='uploading', 'is-success': item.status=='success', 'is-diabled': disabled}"
-        class="upload-file"
-      >
-        <img :src="item.url">
-
-        <el-progress v-if="item.status=='uploading'" :width="miniWidth*0.9" class="upload-progress" type="circle" :percentage="item.percent" />
-
-        <label v-if="item.status=='success'" class="item-status">
-          <i class="el-icon-upload-success el-icon-check" />
-        </label>
-
-        <div v-if="!disabled" class="uplaod-action" :style="{height: miniWidth / 4 + 'px'}">
-          <i class="iconfont icon-tupianyulan" :title="$t('fm.upload.preview')" :style="{'font-size': miniWidth/8+'px'}" @click="handlePreviewFile(item.key)" />
-          <i v-if="isEdit" class="iconfont icon-sync1" :title="$t('fm.upload.edit')" :style="{'font-size': miniWidth/8+'px'}" @click="handleEdit(item.key)" />
-          <i v-if="isDelete && fileList.length > min" class="iconfont icon-delete" :title="$t('fm.upload.delete')" :style="{'font-size': miniWidth/8+'px'}" @click="handleRemove(item.key)" />
-        </div>
-      </div>
-    </draggable>
-
-    <div
-      v-if="!preview"
-      v-show="(!isQiniu || (isQiniu && token)) && fileList.length < length"
-      class="el-upload el-upload--picture-card"
-      :class="{'is-disabled': disabled}"
-      :style="{width: width+'px', height: height+'px'}"
-      @click.self="handleAdd"
-    >
-      <i class="el-icon-plus" :style="{fontSize:miniWidth/4+'px',marginTop: (-miniWidth/8)+'px', marginLeft: (-miniWidth/8)+'px'}" @click.self="handleAdd" />
-      <input
-        v-if="multiple"
-        ref="uploadInput"
-        accept="image/*"
-        multiple
-        type="file"
-        :style="{width: 0, height: 0}"
-        name="file"
-        class="el-upload__input upload-input"
-        @change="handleChange"
-      >
-      <input v-else ref="uploadInput" accept="image/*" type="file" :style="{width:0, height: 0}" name="file" class="el-upload__input upload-input" @change="handleChange">
-    </div>
-  </div>
-</template>
-
-<script>
-import Vue from 'vue'
-import Viewer from 'viewerjs'
-import Draggable from 'vuedraggable'
-import * as qiniu from 'qiniu-js'
-require('viewerjs/dist/viewer.css')
-
-import VueI18n from 'vue-i18n'
-Vue.use(VueI18n)
-export default {
-  components: {
-    Draggable
-  },
-  props: {
-    value: {
-      type: Array,
-      default: () => []
-    },
-    width: {
-      type: Number,
-      default: 100
-    },
-    height: {
-      type: Number,
-      default: 100
-    },
-    token: {
-      type: String,
-      default: ''
-    },
-    domain: {
-      type: String,
-      default: ''
-    },
-    multiple: {
-      type: Boolean,
-      default: false
-    },
-    length: {
-      type: Number,
-      default: 9
-    },
-    isQiniu: {
-      type: Boolean,
-      default: false
-    },
-    isDelete: {
-      type: Boolean,
-      default: false
-    },
-    min: {
-      type: Number,
-      default: 0
-    },
-    meitu: {
-      type: Boolean,
-      default: false
-    },
-    isEdit: {
-      type: Boolean,
-      default: false
-    },
-    action: {
-      type: String,
-      default: ''
-    },
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    preview: {
-      type: Boolean,
-      default: false
-    }
-  },
-  data() {
-    return {
-      fileList: this.value.map(item => {
-        return {
-          key: item.key ? item.key : (new Date().getTime()) + '_' + Math.ceil(Math.random() * 99999),
-          url: item.url,
-          percent: item.percent ? item.percent : 100,
-          status: item.status ? item.status : 'success'
-        }
-      }),
-      viewer: null,
-      uploadId: 'upload_' + new Date().getTime(),
-      editIndex: -1,
-      meituIndex: -1
-    }
-  },
-  computed: {
-    miniWidth() {
-      if (this.width > this.height) {
-        return this.height
-      } else {
-        return this.width
-      }
-    }
-  },
-  watch: {
-    'fileList': {
-      deep: true,
-      handler(val) {
-        // this.$emit('input', this.fileList)
-      }
-    }
-  },
-  mounted() {
-    this.$emit('input', this.fileList)
-  },
-  methods: {
-    handleChange() {
-      const files = this.$refs.uploadInput.files
-
-      for (let i = 0; i < files.length; i++) {
-        const file = files[i]
-        const reader = new FileReader()
-        const key = (new Date().getTime()) + '_' + Math.ceil(Math.random() * 99999)
-        reader.readAsDataURL(file)
-        reader.onload = () => {
-          if (this.editIndex >= 0) {
-            this.$set(this.fileList, this.editIndex, {
-              key,
-              url: reader.result,
-              percent: 0,
-              status: 'uploading'
-            })
-
-            this.editIndex = -1
-          } else {
-            this.fileList.push({
-              key,
-              url: reader.result,
-              percent: 0,
-              status: 'uploading'
-            })
-          }
-
-          this.$nextTick(() => {
-            if (this.isQiniu) {
-              this.uplaodAction2(reader.result, file, key)
-            } else {
-              this.uplaodAction(reader.result, file, key)
-            }
-          })
-        }
-      }
-      this.$refs.uploadInput.value = []
-    },
-    uplaodAction(res, file, key) {
-      // eslint-disable-next-line no-unused-vars
-      const changeIndex = this.fileList.findIndex(item => item.key === key)
-      const xhr = new XMLHttpRequest()
-
-      const url = this.action
-      xhr.open('POST', url, true)
-      // xhr.setRequestHeader('Content-Type', 'multipart/form-data')
-
-      const formData = new FormData()
-      formData.append('file', file)
-
-      xhr.send(formData)
-      xhr.onreadystatechange = () => {
-        if (xhr.readyState === 4) {
-          const resData = JSON.parse(xhr.response)
-          var uploadUrl = ''
-          if (resData.url !== undefined && resData.url !== null && resData.url !== '') {
-            uploadUrl = resData.url
-          } else if (resData.data !== undefined && resData.data !== null && resData.data !== '') {
-            uploadUrl = resData.data
-          }
-          if (resData && uploadUrl) {
-            this.$set(this.fileList, this.fileList.findIndex(item => item.key === key), {
-              ...this.fileList[this.fileList.findIndex(item => item.key === key)],
-              url: uploadUrl,
-              percent: 100
-            })
-            setTimeout(() => {
-              this.$set(this.fileList, this.fileList.findIndex(item => item.key === key), {
-                ...this.fileList[this.fileList.findIndex(item => item.key === key)],
-                status: 'success'
-              })
-              this.$emit('input', this.fileList)
-            }, 200)
-          } else {
-            this.$set(this.fileList, this.fileList.findIndex(item => item.key === key), {
-              ...this.fileList[this.fileList.findIndex(item => item.key === key)],
-              status: 'error'
-            })
-            this.fileList.splice(this.fileList.findIndex(item => item.key === key), 1)
-          }
-        }
-      }
-      xhr.onprogress = (res) => {
-        if (res.total && res.loaded) {
-          this.$set(this.fileList[this.fileList.findIndex(item => item.key === key)], 'percent', res.loaded / res.total * 100)
-        }
-      }
-    },
-    uplaodAction2(res, file, key) {
-      const _this = this
-      const observable = qiniu.upload(file, key, this.token, {
-        fname: key,
-        mimeType: []
-      }, {
-        useCdnDomain: true,
-        region: qiniu.region.z2
-      })
-      observable.subscribe({
-        next(res) {
-          _this.$set(_this.fileList[_this.fileList.findIndex(item => item.key === key)], 'percent', parseInt(res.total.percent))
-        },
-        // eslint-disable-next-line handle-callback-err
-        error(err) {
-          _this.$set(_this.fileList, _this.fileList.findIndex(item => item.key === key), {
-            ..._this.fileList[_this.fileList.findIndex(item => item.key === key)],
-            status: 'error'
-          })
-          _this.fileList.splice(_this.fileList.findIndex(item => item.key === key), 1)
-        },
-        complete(res) {
-          _this.$set(_this.fileList, _this.fileList.findIndex(item => item.key === key), {
-            ..._this.fileList[_this.fileList.findIndex(item => item.key === key)],
-            url: _this.domain + res.key,
-            percent: 100
-          })
-          setTimeout(() => {
-            _this.$set(_this.fileList, _this.fileList.findIndex(item => item.key === key), {
-              ..._this.fileList[_this.fileList.findIndex(item => item.key === key)],
-              status: 'success'
-            })
-            _this.$emit('input', _this.fileList)
-          }, 200)
-        }
-      })
-    },
-    handleRemove(key) {
-      this.fileList.splice(this.fileList.findIndex(item => item.key === key), 1)
-    },
-    handleEdit(key) {
-      this.editIndex = this.fileList.findIndex(item => item.key === key)
-
-      this.$refs.uploadInput.click()
-    },
-    handleMeitu(key) {
-      this.$emit('on-meitu', this.fileList.findIndex(item => item.key === key))
-    },
-    handleAdd() {
-      if (!this.disabled) {
-        this.editIndex = -1
-        this.$refs.uploadInput.click()
-      }
-    },
-    handlePreviewFile(key) {
-      this.viewer && this.viewer.destroy()
-      this.uploadId = 'upload_' + new Date().getTime()
-
-      this.$nextTick(() => {
-        this.viewer = new Viewer(document.getElementById(this.uploadId))
-        this.viewer.view(this.fileList.findIndex(item => item.key === key))
-      })
-    }
-  }
-}
-</script>
-
-<style lang="scss">
-.fm-uplaod-container{
-  .is-disabled{
-    position: relative;
-
-    &::after{
-      position: absolute;
-      top: 0;
-      bottom: 0;
-      left: 0;
-      right: 0;
-      // background: rgba(0,0,0,.1);
-      content: '';
-      display: block;
-      cursor:not-allowed;
-    }
-  }
-
-  .upload-file{
-    margin: 0 10px 10px 0;
-    display: inline-flex;
-    justify-content: center;
-    align-items: center;
-    // background: #fff;
-    overflow: hidden;
-    background-color: #fff;
-    border: 1px solid #c0ccda;
-    border-radius: 6px;
-    box-sizing: border-box;
-    position: relative;
-    vertical-align: top;
-    &:hover{
-      .uplaod-action{
-        display: flex;
-      }
-    }
-    .uplaod-action{
-      position: absolute;
-      // top: 0;
-      // height: 30px;
-      bottom: 0;
-      left: 0;
-      right: 0;
-      background: rgba(0,0,0,0.6);
-      display: none;
-      justify-content: center;
-      align-items: center;
-      i{
-        color: #fff;
-        cursor: pointer;
-        margin: 0 5px;
-      }
-    }
-    &.is-success{
-      .item-status{
-        position: absolute;
-        right: -15px;
-        top: -6px;
-        width: 40px;
-        height: 24px;
-        background: #13ce66;
-        text-align: center;
-        transform: rotate(45deg);
-        box-shadow: 0 0 1pc 1px rgba(0,0,0,.2);
-        &>i{
-          font-size: 12px;
-          margin-top: 11px;
-          color: #fff;
-          transform: rotate(-45deg);
-        }
-      }
-    }
-    &.uploading{
-      &:before{
-        display: block;
-        content: '';
-        position: absolute;
-        top: 0;
-        left: 0;
-        right: 0;
-        bottom: 0;
-        background: rgba(0,0,0,0.3);
-      }
-    }
-    .upload-progress{
-      position: absolute;
-      .el-progress__text{
-        color: #fff;
-        font-size: 16px !important;
-      }
-    }
-    img{
-      max-width: 100%;
-      max-height: 100%;
-      vertical-align: middle;
-    }
-  }
-  .el-upload--picture-card{
-    position: relative;
-    overflow: hidden;
-    .el-icon-plus{
-      position: absolute;
-      top: 50%;
-      left: 50%;
-    }
-  }
-  .upload-input{
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    display: block;
-    opacity: 0;
-    cursor: pointer;
-  }
-
-  .drag-img-list{
-    display: inline;
-
-    .ghost{
-      position: relative;
-      &::after {
-        width: 100%;
-        height: 100%;
-        display: block;
-        content: '';
-        background: #fbfdff;
-        position: absolute;
-        top: 0;
-        bottom: 0;
-        left: 0;
-        right: 0;
-        border: 1px dashed #3bb3c2;
-      }
-    }
-
-    &>div{
-      cursor: move;
-    }
-  }
-}
-
-.viewer-container{
-  z-index: 9999 !important;
-}
-</style>
+<template>
+  <div
+    :id="uploadId"
+    class="fm-uplaod-container"
+  >
+    <draggable
+      v-model="fileList"
+      class="drag-img-list"
+      v-bind="{group: uploadId, ghostClass: 'ghost', animation: 200}"
+      :no-transition-on-drag="true"
+    >
+      <div
+        v-for="(item) in fileList"
+        :id="item.key"
+        :key="item.key"
+        :style="{width: width+'px', height: height+'px'}"
+        :class="{uploading: item.status=='uploading', 'is-success': item.status=='success', 'is-diabled': disabled}"
+        class="upload-file"
+      >
+        <img :src="item.url">
+
+        <el-progress v-if="item.status=='uploading'" :width="miniWidth*0.9" class="upload-progress" type="circle" :percentage="item.percent" />
+
+        <label v-if="item.status=='success'" class="item-status">
+          <i class="el-icon-upload-success el-icon-check" />
+        </label>
+
+        <div v-if="!disabled" class="uplaod-action" :style="{height: miniWidth / 4 + 'px'}">
+          <i class="iconfont icon-tupianyulan" :title="$t('fm.upload.preview')" :style="{'font-size': miniWidth/8+'px'}" @click="handlePreviewFile(item.key)" />
+          <i v-if="isEdit" class="iconfont icon-sync1" :title="$t('fm.upload.edit')" :style="{'font-size': miniWidth/8+'px'}" @click="handleEdit(item.key)" />
+          <i v-if="isDelete && fileList.length > min" class="iconfont icon-delete" :title="$t('fm.upload.delete')" :style="{'font-size': miniWidth/8+'px'}" @click="handleRemove(item.key)" />
+        </div>
+      </div>
+    </draggable>
+
+    <div
+      v-if="!preview"
+      v-show="(!isQiniu || (isQiniu && token)) && fileList.length < length"
+      class="el-upload el-upload--picture-card"
+      :class="{'is-disabled': disabled}"
+      :style="{width: width+'px', height: height+'px'}"
+      @click.self="handleAdd"
+    >
+      <i class="el-icon-plus" :style="{fontSize:miniWidth/4+'px',marginTop: (-miniWidth/8)+'px', marginLeft: (-miniWidth/8)+'px'}" @click.self="handleAdd" />
+      <input
+        v-if="multiple"
+        ref="uploadInput"
+        accept="image/*"
+        multiple
+        type="file"
+        :style="{width: 0, height: 0}"
+        name="file"
+        class="el-upload__input upload-input"
+        @change="handleChange"
+      >
+      <input v-else ref="uploadInput" accept="image/*" type="file" :style="{width:0, height: 0}" name="file" class="el-upload__input upload-input" @change="handleChange">
+    </div>
+  </div>
+</template>
+
+<script>
+import Vue from 'vue'
+import Viewer from 'viewerjs'
+import Draggable from 'vuedraggable'
+import * as qiniu from 'qiniu-js'
+require('viewerjs/dist/viewer.css')
+
+import VueI18n from 'vue-i18n'
+Vue.use(VueI18n)
+export default {
+  components: {
+    Draggable
+  },
+  props: {
+    value: {
+      type: Array,
+      default: () => []
+    },
+    width: {
+      type: Number,
+      default: 100
+    },
+    height: {
+      type: Number,
+      default: 100
+    },
+    token: {
+      type: String,
+      default: ''
+    },
+    domain: {
+      type: String,
+      default: ''
+    },
+    multiple: {
+      type: Boolean,
+      default: false
+    },
+    length: {
+      type: Number,
+      default: 9
+    },
+    isQiniu: {
+      type: Boolean,
+      default: false
+    },
+    isDelete: {
+      type: Boolean,
+      default: false
+    },
+    min: {
+      type: Number,
+      default: 0
+    },
+    meitu: {
+      type: Boolean,
+      default: false
+    },
+    isEdit: {
+      type: Boolean,
+      default: false
+    },
+    action: {
+      type: String,
+      default: ''
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    preview: {
+      type: Boolean,
+      default: false
+    }
+  },
+  data() {
+    return {
+      fileList: this.value.map(item => {
+        return {
+          key: item.key ? item.key : (new Date().getTime()) + '_' + Math.ceil(Math.random() * 99999),
+          url: item.url,
+          percent: item.percent ? item.percent : 100,
+          status: item.status ? item.status : 'success'
+        }
+      }),
+      viewer: null,
+      uploadId: 'upload_' + new Date().getTime(),
+      editIndex: -1,
+      meituIndex: -1
+    }
+  },
+  computed: {
+    miniWidth() {
+      if (this.width > this.height) {
+        return this.height
+      } else {
+        return this.width
+      }
+    }
+  },
+  watch: {
+    'fileList': {
+      deep: true,
+      handler(val) {
+        // this.$emit('input', this.fileList)
+      }
+    }
+  },
+  mounted() {
+    this.$emit('input', this.fileList)
+  },
+  methods: {
+    handleChange() {
+      const files = this.$refs.uploadInput.files
+
+      for (let i = 0; i < files.length; i++) {
+        const file = files[i]
+        const reader = new FileReader()
+        const key = (new Date().getTime()) + '_' + Math.ceil(Math.random() * 99999)
+        reader.readAsDataURL(file)
+        reader.onload = () => {
+          if (this.editIndex >= 0) {
+            this.$set(this.fileList, this.editIndex, {
+              key,
+              url: reader.result,
+              percent: 0,
+              status: 'uploading'
+            })
+
+            this.editIndex = -1
+          } else {
+            this.fileList.push({
+              key,
+              url: reader.result,
+              percent: 0,
+              status: 'uploading'
+            })
+          }
+
+          this.$nextTick(() => {
+            this.uplaodAction(reader.result, file, key)
+            // if (this.isQiniu) {
+            //   this.uplaodAction2(reader.result, file, key)
+            // } else {
+            //   this.uplaodAction(reader.result, file, key)
+            // }
+          })
+        }
+      }
+      this.$refs.uploadInput.value = []
+    },
+    uplaodAction(res, file, key) {
+      // eslint-disable-next-line no-unused-vars
+      const changeIndex = this.fileList.findIndex(item => item.key === key)
+      const xhr = new XMLHttpRequest()
+
+      const url = '/api-web/uploadFile'
+      xhr.open('POST', url, true)
+      // xhr.setRequestHeader('Content-Type', 'multipart/form-data')
+
+      const formData = new FormData()
+      formData.append('file', file)
+
+      xhr.send(formData)
+      xhr.onreadystatechange = () => {
+        if (xhr.readyState === 4) {
+          const tempData = JSON.parse(xhr.response)
+          const resData = tempData.data
+          var uploadUrl = ''
+          if (resData.url !== undefined && resData.url !== null && resData.url !== '') {
+            uploadUrl = resData.url
+          } else if (resData.data !== undefined && resData.data !== null && resData.data !== '') {
+            uploadUrl = resData.data
+          }
+          if (resData && uploadUrl) {
+            this.$set(this.fileList, this.fileList.findIndex(item => item.key === key), {
+              ...this.fileList[this.fileList.findIndex(item => item.key === key)],
+              url: uploadUrl,
+              percent: 100
+            })
+            setTimeout(() => {
+              this.$set(this.fileList, this.fileList.findIndex(item => item.key === key), {
+                ...this.fileList[this.fileList.findIndex(item => item.key === key)],
+                status: 'success'
+              })
+              this.$emit('input', this.fileList)
+            }, 200)
+          } else {
+            this.$set(this.fileList, this.fileList.findIndex(item => item.key === key), {
+              ...this.fileList[this.fileList.findIndex(item => item.key === key)],
+              status: 'error'
+            })
+            this.fileList.splice(this.fileList.findIndex(item => item.key === key), 1)
+          }
+        }
+      }
+      xhr.onprogress = (res) => {
+        if (res.total && res.loaded) {
+          this.$set(this.fileList[this.fileList.findIndex(item => item.key === key)], 'percent', res.loaded / res.total * 100)
+        }
+      }
+    },
+    uplaodAction2(res, file, key) {
+      const _this = this
+      const observable = qiniu.upload(file, key, this.token, {
+        fname: key,
+        mimeType: []
+      }, {
+        useCdnDomain: true,
+        region: qiniu.region.z2
+      })
+      observable.subscribe({
+        next(res) {
+          _this.$set(_this.fileList[_this.fileList.findIndex(item => item.key === key)], 'percent', parseInt(res.total.percent))
+        },
+        // eslint-disable-next-line handle-callback-err
+        error(err) {
+          _this.$set(_this.fileList, _this.fileList.findIndex(item => item.key === key), {
+            ..._this.fileList[_this.fileList.findIndex(item => item.key === key)],
+            status: 'error'
+          })
+          _this.fileList.splice(_this.fileList.findIndex(item => item.key === key), 1)
+        },
+        complete(res) {
+          _this.$set(_this.fileList, _this.fileList.findIndex(item => item.key === key), {
+            ..._this.fileList[_this.fileList.findIndex(item => item.key === key)],
+            url: _this.domain + res.key,
+            percent: 100
+          })
+          setTimeout(() => {
+            _this.$set(_this.fileList, _this.fileList.findIndex(item => item.key === key), {
+              ..._this.fileList[_this.fileList.findIndex(item => item.key === key)],
+              status: 'success'
+            })
+            _this.$emit('input', _this.fileList)
+          }, 200)
+        }
+      })
+    },
+    handleRemove(key) {
+      this.fileList.splice(this.fileList.findIndex(item => item.key === key), 1)
+    },
+    handleEdit(key) {
+      this.editIndex = this.fileList.findIndex(item => item.key === key)
+
+      this.$refs.uploadInput.click()
+    },
+    handleMeitu(key) {
+      this.$emit('on-meitu', this.fileList.findIndex(item => item.key === key))
+    },
+    handleAdd() {
+      if (!this.disabled) {
+        this.editIndex = -1
+        this.$refs.uploadInput.click()
+      }
+    },
+    handlePreviewFile(key) {
+      this.viewer && this.viewer.destroy()
+      this.uploadId = 'upload_' + new Date().getTime()
+
+      this.$nextTick(() => {
+        this.viewer = new Viewer(document.getElementById(this.uploadId))
+        this.viewer.view(this.fileList.findIndex(item => item.key === key))
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss">
+.fm-uplaod-container{
+  .is-disabled{
+    position: relative;
+
+    &::after{
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      left: 0;
+      right: 0;
+      // background: rgba(0,0,0,.1);
+      content: '';
+      display: block;
+      cursor:not-allowed;
+    }
+  }
+
+  .upload-file{
+    margin: 0 10px 10px 0;
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+    // background: #fff;
+    overflow: hidden;
+    background-color: #fff;
+    border: 1px solid #c0ccda;
+    border-radius: 6px;
+    box-sizing: border-box;
+    position: relative;
+    vertical-align: top;
+    &:hover{
+      .uplaod-action{
+        display: flex;
+      }
+    }
+    .uplaod-action{
+      position: absolute;
+      // top: 0;
+      // height: 30px;
+      bottom: 0;
+      left: 0;
+      right: 0;
+      background: rgba(0,0,0,0.6);
+      display: none;
+      justify-content: center;
+      align-items: center;
+      i{
+        color: #fff;
+        cursor: pointer;
+        margin: 0 5px;
+      }
+    }
+    &.is-success{
+      .item-status{
+        position: absolute;
+        right: -15px;
+        top: -6px;
+        width: 40px;
+        height: 24px;
+        background: #13ce66;
+        text-align: center;
+        transform: rotate(45deg);
+        box-shadow: 0 0 1pc 1px rgba(0,0,0,.2);
+        &>i{
+          font-size: 12px;
+          margin-top: 11px;
+          color: #fff;
+          transform: rotate(-45deg);
+        }
+      }
+    }
+    &.uploading{
+      &:before{
+        display: block;
+        content: '';
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+        background: rgba(0,0,0,0.3);
+      }
+    }
+    .upload-progress{
+      position: absolute;
+      .el-progress__text{
+        color: #fff;
+        font-size: 16px !important;
+      }
+    }
+    img{
+      max-width: 100%;
+      max-height: 100%;
+      vertical-align: middle;
+    }
+  }
+  .el-upload--picture-card{
+    position: relative;
+    overflow: hidden;
+    .el-icon-plus{
+      position: absolute;
+      top: 50%;
+      left: 50%;
+    }
+  }
+  .upload-input{
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    display: block;
+    opacity: 0;
+    cursor: pointer;
+  }
+
+  .drag-img-list{
+    display: inline;
+
+    .ghost{
+      position: relative;
+      &::after {
+        width: 100%;
+        height: 100%;
+        display: block;
+        content: '';
+        background: #fbfdff;
+        position: absolute;
+        top: 0;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        border: 1px dashed #3bb3c2;
+      }
+    }
+
+    &>div{
+      cursor: move;
+    }
+  }
+}
+
+.viewer-container{
+  z-index: 9999 !important;
+}
+</style>

src/components/VueFormMaking/components/WidgetConfig.vue

@@ -857,8 +857,8 @@ export default {
       if (!this.show) {
         return false
       }
-
-      if (val) {
+      // 为了处理，float 类型校验的问题
+      if (val && this.data.type != 'input') {
         this.validator.type = { type: val, message: this.data.name + this.$t('fm.config.widget.validatorType') }
       } else {
         this.validator.type = null

src/components/VueFormMaking/lang/zh-CN.js

@@ -1,196 +1,196 @@
-export default {
-  fm: {
-    components: {
-      fields: {
-        input: '单行文本',
-        textarea: '多行文本',
-        number: '计数器',
-        radio: '单选框组',
-        checkbox: '多选框组',
-        time: '时间选择器',
-        date: '日期选择器',
-        rate: '评分',
-        color: '颜色选择器',
-        select: '下拉选择框',
-        switch: '开关',
-        slider: '滑块',
-        text: '文字',
-        blank: '自定义区域',
-        fileupload: '文件',
-        imgupload: '图片',
-        editor: '编辑器',
-        cascader: '级联选择器',
-        table: '子表单',
-        subform: '子表单',
-        grid: '栅格布局',
-        tabs: '标签页',
-        divider: '分割线',
-        file: '文件',
-        organ: '分部',
-        school: '学校'
-      },
-      basic: {
-        title: '基础字段'
-      },
-      advance: {
-        title: '高级字段'
-      },
-      layout: {
-        title: '布局字段'
-      }
-    },
-    description: {
-      containerEmpty: '从左侧拖拽来添加字段',
-      configEmpty: '请添加字段',
-      tableEmpty: '从左侧拖拽来添加字段',
-      uploadJsonInfo: 'JSON格式如下，直接复制生成的json覆盖此处代码点击确定即可'
-    },
-    message: {
-      copySuccess: '复制成功',
-      validError: '表单数据校验失败'
-    },
-    actions: {
-      import: '导入JSON',
-      clear: '清空',
-      preview: '预览',
-      json: '生成JSON',
-      code: '生成代码',
-      getData: '获取数据',
-      reset: '重置',
-      copyData: '复制数据',
-      cancel: '取 消',
-      confirm: '确 定',
-      addOption: '添加选项',
-      addColumn: '添加列',
-      addTab: '添加标签',
-      upload: '点击上传',
-      add: '添加'
-    },
-    config: {
-      form: {
-        title: '表单属性',
-        labelPosition: {
-          title: '标签对齐方式',
-          left: '左对齐',
-          right: '右对齐',
-          top: '顶部对齐'
-        },
-        labelWidth: '表单标签宽度',
-        size: '组件尺寸',
-        customClass: '自定义Class'
-      },
-      widget: {
-        title: '字段属性',
-        model: '字段标识',
-        name: '标题',
-        width: '宽度',
-        height: '高度',
-        size: '大小',
-        labelWidth: '标签宽度',
-        custom: '自定义',
-        placeholder: '占位内容',
-        layout: '布局方式',
-        block: '块级',
-        inline: '行内',
-        contentPosition: '文案位置',
-        center: '居中',
-        showInput: '显示输入框',
-        min: '最小值',
-        max: '最大值',
-        step: '步长',
-        multiple: '是否多选',
-        filterable: '是否可搜索',
-        allowHalf: '允许半选',
-        showAlpha: '支持透明度选择',
-        showLabel: '是否显示标签',
-        option: '选项',
-        staticData: '静态数据',
-        remoteData: '远端数据',
-        remoteFunc: '远端方法',
-        value: '值',
-        label: '标签',
-        childrenOption: '子选项',
-        defaultValue: '默认值',
-        showType: '显示类型',
-        isRange: '是否为范围选择',
-        isTimestamp: '是否获取时间戳',
-        startPlaceholder: '开始时间占位内容',
-        endPlaceholder: '结束时间占位内容',
-        format: '格式',
-        limit: '最大上传数',
-        isQiniu: '使用七牛上传',
-        tokenFunc: '获取七牛Token方法',
-        setHeaders: '设置上传的请求头部',
-        imageAction: '图片上传地址',
-        tip: '提示说明文字',
-        action: '上传地址',
-        defaultType: '绑定数据类型',
-        string: '字符串',
-        object: '对象',
-        array: '数组',
-        number: '数字',
-        boolean: '布尔值',
-        integer: '整数',
-        float: '浮点数',
-        url: 'URL地址',
-        email: '邮箱地址',
-        hex: '十六进制',
-        gutter: '栅格间隔',
-        columnOption: '列配置项',
-        span: '栅格值',
-        justify: '水平排列方式',
-        justifyStart: '左对齐',
-        justifyEnd: '右对齐',
-        justifyCenter: '居中',
-        justifySpaceAround: '两侧间隔相等',
-        justifySpaceBetween: '两端对齐',
-        align: '垂直排列方式',
-        alignTop: '顶部对齐',
-        alignMiddle: '居中',
-        alignBottom: '底部对齐',
-        type: '风格类型',
-        default: '默认',
-        card: '选项卡',
-        borderCard: '卡片化',
-        tabPosition: '选项卡位置',
-        top: '顶部',
-        left: '左侧',
-        right: '右侧',
-        bottom: '底部',
-        tabOption: '标签配置项',
-        tabName: '标签名称',
-        customClass: '自定义Class',
-        attribute: '操作属性',
-        dataBind: '数据绑定',
-        hidden: '隐藏',
-        readonly: '完全只读',
-        disabled: '禁用',
-        editable: '文本框可输入',
-        clearable: '显示清除按钮',
-        arrowControl: '使用箭头进行时间选择',
-        isDelete: '删除',
-        isEdit: '编辑',
-        showPassword: '密码',
-        validate: '校验',
-        required: '必填',
-        patternPlaceholder: '填写正则表达式',
-        newOption: '新选项',
-        tab: '标签页',
-        validatorRequired: '必须填写',
-        validatorType: '格式不正确',
-        validatorPattern: '格式不匹配',
-        showAllLevels: '完整路径',
-        displayVerifiy: '显示校验',
-        displayVerifiyPlaceholderModel: '请输入字段标识',
-        displayVerifiyPlaceholderValue: '请输入字段值',
-        displayRelation: '关联字段',
-        displayRelationPlaceholderModel: '请输入关联字段标识'
-      }
-    },
-    upload: {
-      preview: '预览',
-      edit: '替换',
-      delete: '删除'
-    }
-  }
-}
+export default {
+  fm: {
+    components: {
+      fields: {
+        input: '单行文本',
+        textarea: '多行文本',
+        number: '计数器',
+        radio: '单选框组',
+        checkbox: '多选框组',
+        time: '时间选择器',
+        date: '日期选择器',
+        rate: '评分',
+        color: '颜色选择器',
+        select: '下拉选择框',
+        switch: '开关',
+        slider: '滑块',
+        text: '文字',
+        blank: '自定义区域',
+        fileupload: '文件',
+        imgupload: '图片',
+        editor: '编辑器',
+        cascader: '级联选择器',
+        table: '子表单',
+        subform: '子表单',
+        grid: '栅格布局',
+        tabs: '标签页',
+        divider: '分割线',
+        file: '文件',
+        organ: '分部',
+        school: '学校'
+      },
+      basic: {
+        title: '基础字段'
+      },
+      advance: {
+        title: '高级字段'
+      },
+      layout: {
+        title: '布局字段'
+      }
+    },
+    description: {
+      containerEmpty: '从左侧拖拽来添加字段',
+      configEmpty: '请添加字段',
+      tableEmpty: '从左侧拖拽来添加字段',
+      uploadJsonInfo: 'JSON格式如下，直接复制生成的json覆盖此处代码点击确定即可'
+    },
+    message: {
+      copySuccess: '复制成功',
+      validError: '表单数据校验失败'
+    },
+    actions: {
+      import: '导入JSON',
+      clear: '清空',
+      preview: '预览',
+      json: '生成JSON',
+      code: '生成代码',
+      getData: '获取数据',
+      reset: '重置',
+      copyData: '复制数据',
+      cancel: '取 消',
+      confirm: '确 定',
+      addOption: '添加选项',
+      addColumn: '添加列',
+      addTab: '添加标签',
+      upload: '点击上传',
+      add: '添加'
+    },
+    config: {
+      form: {
+        title: '表单属性',
+        labelPosition: {
+          title: '标签对齐方式',
+          left: '左对齐',
+          right: '右对齐',
+          top: '顶部对齐'
+        },
+        labelWidth: '表单标签宽度',
+        size: '组件尺寸',
+        customClass: '自定义Class'
+      },
+      widget: {
+        title: '字段属性',
+        model: '字段标识',
+        name: '标题',
+        width: '宽度',
+        height: '高度',
+        size: '大小',
+        labelWidth: '标签宽度',
+        custom: '自定义',
+        placeholder: '占位内容',
+        layout: '布局方式',
+        block: '块级',
+        inline: '行内',
+        contentPosition: '文案位置',
+        center: '居中',
+        showInput: '显示输入框',
+        min: '最小值',
+        max: '最大值',
+        step: '步长',
+        multiple: '是否多选',
+        filterable: '是否可搜索',
+        allowHalf: '允许半选',
+        showAlpha: '支持透明度选择',
+        showLabel: '是否显示标签',
+        option: '选项',
+        staticData: '静态数据',
+        remoteData: '远端数据',
+        remoteFunc: '远端方法',
+        value: '值',
+        label: '标签',
+        childrenOption: '子选项',
+        defaultValue: '默认值',
+        showType: '显示类型',
+        isRange: '是否为范围选择',
+        isTimestamp: '是否获取时间戳',
+        startPlaceholder: '开始时间占位内容',
+        endPlaceholder: '结束时间占位内容',
+        format: '格式',
+        limit: '最大上传数',
+        isQiniu: '使用七牛上传',
+        tokenFunc: '获取七牛Token方法',
+        setHeaders: '设置上传的请求头部',
+        imageAction: '图片上传地址',
+        tip: '提示说明文字',
+        action: '上传地址',
+        defaultType: '绑定数据类型',
+        string: '字符串',
+        object: '对象',
+        array: '数组',
+        number: '数字',
+        boolean: '布尔值',
+        integer: '整数',
+        float: '浮点数',
+        url: 'URL地址',
+        email: '邮箱地址',
+        hex: '十六进制',
+        gutter: '栅格间隔',
+        columnOption: '列配置项',
+        span: '栅格值',
+        justify: '水平排列方式',
+        justifyStart: '左对齐',
+        justifyEnd: '右对齐',
+        justifyCenter: '居中',
+        justifySpaceAround: '两侧间隔相等',
+        justifySpaceBetween: '两端对齐',
+        align: '垂直排列方式',
+        alignTop: '顶部对齐',
+        alignMiddle: '居中',
+        alignBottom: '底部对齐',
+        type: '风格类型',
+        default: '默认',
+        card: '选项卡',
+        borderCard: '卡片化',
+        tabPosition: '选项卡位置',
+        top: '顶部',
+        left: '左侧',
+        right: '右侧',
+        bottom: '底部',
+        tabOption: '标签配置项',
+        tabName: '标签名称',
+        customClass: '自定义Class',
+        attribute: '操作属性',
+        dataBind: '数据绑定',
+        hidden: '隐藏',
+        readonly: '完全只读',
+        disabled: '禁用',
+        editable: '文本框可输入',
+        clearable: '显示清除按钮',
+        arrowControl: '使用箭头进行时间选择',
+        isDelete: '删除',
+        isEdit: '编辑',
+        showPassword: '密码',
+        validate: '校验',
+        required: '必填',
+        patternPlaceholder: '填写正则表达式',
+        newOption: '新选项',
+        tab: '标签页',
+        validatorRequired: '必须填写',
+        validatorType: '格式不正确',
+        validatorPattern: '格式不匹配',
+        showAllLevels: '完整路径',
+        displayVerifiy: '显示校验',
+        displayVerifiyPlaceholderModel: '请输入字段标识',
+        displayVerifiyPlaceholderValue: '请输入字段值',
+        displayRelation: '关联字段',
+        displayRelationPlaceholderModel: '请输入关联字段标识'
+      }
+    },
+    upload: {
+      preview: '预览',
+      edit: '替换',
+      delete: '删除'
+    }
+  }
+}

src/store/modules/getDataList.js

@@ -0,0 +1,46 @@
+
+import { queryAllOrgan } from "../../api/dashboard"
+const loadings = {}
+const filterOrganId = [36, 39, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 52, 54, 55, 56]
+const state = {
+  allBranch: []
+}
+
+const mutations = {
+  commit_all_branch: (state, allBranch) => {
+    state.allBranch = allBranch
+  }
+}
+
+const actions = {
+  async setAllBranch({
+    commit,
+    state
+  }, force) {
+    if ((!state.allBranch.length || force === true) && !loadings.commit_all_branch) {
+      loadings.commit_all_branch = await queryAllOrgan()
+      try {
+        const res = await loadings.commit_all_branch
+        const result = res.data
+        let tempOrgan = []
+        // 过滤不会显示的分部
+        result.forEach(item => {
+          if (!filterOrganId.includes(item.id)) {
+            tempOrgan.push(item)
+          }
+        })
+        commit('commit_all_branch', tempOrgan)
+      } catch (error) {
+        //
+      }
+      loadings.commit_all_branch = false
+    }
+  },
+}
+
+export default {
+  namespaced: true,
+  state,
+  mutations,
+  actions
+}

src/views/process/list/apply-process-list.vue

@@ -1,157 +1,156 @@
-<template>
-  <div class="app-container">
-    <el-card class="box-card remove-padding-bottom">
-      <el-form ref="listQuery" :model="listQuery" :inline="true">
-        <el-form-item label="流程名称">
-          <el-input
-            v-model="listQuery.name"
-            placeholder="请输入流程名称"
-            clearable
-            size="small"
-            style="width: 240px"
-            @keyup.enter.native="handleQuery"
-          />
-        </el-form-item>
-        <el-form-item>
-          <el-button type="primary" icon="el-icon-search" size="small" @click="handleQuery">搜索</el-button>
-        </el-form-item>
-      </el-form>
-
-      <div v-for="item in processLists" :key="item.id">
-        <div v-if="item.process_list.length!==0">
-          <div class="workflow-classify-title">
-            {{ item.name }}
-          </div>
-          <div style="margin-bottom: 15px;">
-            <template v-for="(buttonItem, buttonIndex) in item.process_list">
-              <el-tooltip :key="buttonItem.id" effect="dark" placement="top">
-                <div slot="content">
-                  {{ buttonItem.name }}
-                  <br>
-                  {{ buttonItem.remarks }}
-                </div>
-                <div
-                  class="workflow-classify-div"
-                  :style="(buttonIndex + 1) % 5 === 0 ? {'padding-right': 0} : {'padding-right': '12px'}"
-                >
-                  <el-button
-                    style="width: 100%"
-                    plain
-                    @click="submitWorkOrder(buttonItem.id)"
-                  >
-                    <div class="process-button-div">
-                      <div class="process-div-icon">
-                        <e-icon class="process-div-el-icon" :icon-name="buttonItem.icon" />
-                      </div>
-                      <div class="process-div-body">
-                        <div class="process-div-title ellipsis">
-                          {{ buttonItem.name }}
-                        </div>
-                        <div class="process-div-remarks ellipsis">
-                          {{ buttonItem.remarks }}
-                        </div>
-                      </div>
-                    </div>
-                  </el-button>
-                </div>
-              </el-tooltip>
-            </template>
-          </div>
-        </div>
-      </div>
-    </el-card>
-  </div>
-</template>
-
-<script>
-import { classifyProcessList } from '@/api/process/admin/process'
-
-export default {
-  name: 'ApplyProcessList',
-  data() {
-    return {
-      processLists: [],
-      listQuery: {}
-    }
-  },
-  created() {
-    this.getProcessList()
-  },
-  methods: {
-    getProcessList() {
-      classifyProcessList(this.listQuery).then(response => {
-        this.processLists = response.data
-      })
-    },
-    handleQuery() {
-      this.getProcessList()
-    },
-    submitWorkOrder(processId) {
-      this.$router.push({ path: '/process/create-ticket', query: { processId: processId }})
-    }
-  }
-}
-</script>
-
-<style scoped>
-  .workflow-classify-title {
-    border-left: 3px solid rgb(64, 158, 255);
-    padding-left: 5px;
-  }
-
-  .workflow-classify-div {
-    width: 20%;
-    display: inline-block;
-    margin-left: 0;
-    margin-top: 12px;
-  }
-
-  .el-card__body {
-    padding-bottom: 0;
-  }
-
-  .process-button-div {
-    width: 180px;
-    height: 50px;
-  }
-
-  .process-div-icon {
-    float: left;
-    width: 50px;
-    height: 100%;
-    margin-right: 10px;
-  }
-
-  .process-div-el-icon {
-    font-size: 32px;
-    line-height: 50px;
-    color: #606266;
-  }
-
-  .process-div-body {
-    float: left;
-    width: 120px;
-    height: 100%;
-    text-align: left;
-  }
-
-  .process-div-title {
-    font-size: 15px;
-    margin-top: 6px;
-    color: #606266;
-    height: 18px;
-    line-height: 18px;
-  }
-
-  .process-div-remarks {
-    color: #999999;
-    margin-top: 6px;
-    font-size: 12px;
-  }
-
-  .ellipsis {
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-</style>
+<template>
+  <div class="app-container">
+    <el-card class="box-card remove-padding-bottom">
+      <el-form ref="listQuery" :model="listQuery" :inline="true">
+        <el-form-item label="流程名称">
+          <el-input
+            v-model="listQuery.name"
+            placeholder="请输入流程名称"
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" icon="el-icon-search" size="small" @click="handleQuery">搜索</el-button>
+        </el-form-item>
+      </el-form>
+
+      <div v-for="item in processLists" :key="item.id">
+        <div v-if="item.process_list.length!==0">
+          <div class="workflow-classify-title">
+            {{ item.name }}
+          </div>
+          <div style="margin-bottom: 15px;">
+            <template v-for="(buttonItem, buttonIndex) in item.process_list">
+              <el-tooltip :key="buttonItem.id" effect="dark" placement="top">
+                <div slot="content">
+                  <div style="font-size: 16px;">{{ buttonItem.name }}</div>
+                  <div style="width: 250px; padding-top: 10px;line-height: 1.2;">{{ buttonItem.remarks }}</div>
+                </div>
+                <div
+                  class="workflow-classify-div"
+                  :style="(buttonIndex + 1) % 5 === 0 ? {'padding-right': 0} : {'padding-right': '12px'}"
+                >
+                  <el-button
+                    style="width: 100%"
+                    plain
+                    @click="submitWorkOrder(buttonItem.id)"
+                  >
+                    <div class="process-button-div">
+                      <div class="process-div-icon">
+                        <e-icon class="process-div-el-icon" :icon-name="buttonItem.icon" />
+                      </div>
+                      <div class="process-div-body">
+                        <div class="process-div-title ellipsis">
+                          {{ buttonItem.name }}
+                        </div>
+                        <div class="process-div-remarks ellipsis">
+                          {{ buttonItem.remarks }}
+                        </div>
+                      </div>
+                    </div>
+                  </el-button>
+                </div>
+              </el-tooltip>
+            </template>
+          </div>
+        </div>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { classifyProcessList } from '@/api/process/admin/process'
+
+export default {
+  name: 'ApplyProcessList',
+  data() {
+    return {
+      processLists: [],
+      listQuery: {}
+    }
+  },
+  created() {
+    this.getProcessList()
+  },
+  methods: {
+    getProcessList() {
+      classifyProcessList(this.listQuery).then(response => {
+        this.processLists = response.data
+      })
+    },
+    handleQuery() {
+      this.getProcessList()
+    },
+    submitWorkOrder(processId) {
+      this.$router.push({ path: '/process/create-ticket', query: { processId: processId }})
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .workflow-classify-title {
+    border-left: 3px solid rgb(64, 158, 255);
+    padding-left: 5px;
+  }
+
+  .workflow-classify-div {
+    width: 20%;
+    display: inline-block;
+    margin-left: 0;
+    margin-top: 12px;
+  }
+
+  .el-card__body {
+    padding-bottom: 0;
+  }
+
+  .process-button-div {
+    width: 180px;
+    height: 50px;
+  }
+
+  .process-div-icon {
+    float: left;
+    width: 50px;
+    height: 100%;
+    margin-right: 10px;
+  }
+
+  .process-div-el-icon {
+    font-size: 32px;
+    line-height: 50px;
+    color: #606266;
+  }
+
+  .process-div-body {
+    float: left;
+    width: 120px;
+    height: 100%;
+    text-align: left;
+  }
+
+  .process-div-title {
+    font-size: 15px;
+    margin-top: 6px;
+    color: #606266;
+    height: 18px;
+    line-height: 18px;
+  }
+
+  .process-div-remarks {
+    color: #999999;
+    margin-top: 6px;
+    font-size: 12px;
+  }
+
+  .ellipsis {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+</style>

src/views/process/list/create.vue

@@ -1,194 +1,292 @@
-<template>
-  <div class="app-container">
-    <el-card class="box-card">
-      <div slot="header" class="clearfix">
-        <span>公共信息</span>
-      </div>
-      <div class="text item">
-        <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="100px">
-          <el-form-item label="标题:" prop="title" style="margin-bottom: 13px">
-            <el-input v-model="ruleForm.title" size="small" />
-          </el-form-item>
-          <el-form-item label="优先级:" prop="priority" style="margin-bottom: 0">
-            <el-radio-group v-model="ruleForm.priority" size="small">
-              <el-radio :label="1">一般</el-radio>
-              <el-radio :label="2">紧急</el-radio>
-              <el-radio :label="3">非常紧急</el-radio>
-            </el-radio-group>
-          </el-form-item>
-        </el-form>
-      </div>
-    </el-card>
-
-    <el-card class="box-card" style="margin-top: 10px">
-      <div slot="header" class="clearfix">
-        <span>表单信息</span>
-      </div>
-      <div class="text item">
-        <template v-for="(tplItem, tplIndex) in processStructureValue.tpls">
-          <fm-generate-form
-            v-show="currentNode.hideTpls===undefined ||
-              currentNode.hideTpls===null ||
-              currentNode.hideTpls.indexOf(tplItem.id)===-1"
-            :key="tplIndex"
-            :ref="'generateForm-'+tplItem.id"
-            :preview="currentNode.hideTpls===undefined ||
-              currentNode.hideTpls===null ||
-              currentNode.hideTpls.indexOf(tplItem.id)===-1?false:true"
-            :remote="remoteFunc"
-            :data="tplItem.form_structure"
-            :disabled="currentNode.readonlyTpls===undefined ||
-              currentNode.readonlyTpls===null ||
-              currentNode.readonlyTpls.indexOf(tplItem.id)===-1?null:true"
-          />
-        </template>
-      </div>
-      <!-- <hr style="background-color: #d9d9d9; border:0; height:1px;">
-      <div class="text item" style="text-align: center;margin-top:18px">
-        <el-button
-          v-for="(item, index) in processStructureValue.edges"
-          v-show="item.source===processStructureValue.nodes[active].id"
-          :key="index"
-          type="primary"
-          :disabled="submitDisabled"
-          @click="submitAction(item.target)"
-        >
-          {{ item.label }}
-        </el-button>
-      </div> -->
-    </el-card>
-  </div>
-</template>
-
-<script>
-
-import Vue from 'vue'
-import {
-  GenerateForm
-} from '@/components/VueFormMaking'
-import 'form-making/dist/FormMaking.css'
-Vue.component(GenerateForm.name, GenerateForm)
-
-import {
-  processStructure,
-  createWorkOrder
-} from '@/api/process/work-order'
-import { listUser } from '@/api/system/sysuser'
-export default {
-  name: 'Create',
-  data() {
-    return {
-      submitDisabled: false,
-      active: 0,
-      processStructureValue: {},
-      ruleForm: {
-        title: '',
-        priority: 1,
-        process: '',
-        classify: '',
-        state: [],
-        source: '',
-        source_state: '',
-        process_method: '',
-        tpls: {
-          'form_structure': [],
-          'form_data': []
-        },
-        tasks: []
-      },
-      rules: {
-        title: [
-          { required: true, message: '请输入工单标题', trigger: 'blur' }
-        ],
-        priority: [
-          { required: true, message: '请选择工单优先级', trigger: 'blur' }
-        ]
-      },
-      remoteFunc: {
-        // 获取用户列表
-        userList(resolve) {
-          listUser({
-            pageSize: 999999
-          }).then(response => {
-            const options = response.data.list
-            resolve(options)
-          })
-        }
-      }
-    }
-  },
-  created() {
-    this.getProcessNodeList()
-  },
-  methods: {
-    getProcessNodeList() {
-      processStructure({
-        processId: this.$route.query.processId
-      }).then(response => {
-        this.processStructureValue = response.data
-        this.currentNode = this.processStructureValue.nodes[0]
-      })
-    },
-    submitAction(target) {
-      this.$refs['ruleForm'].validate((valid) => {
-        if (valid) {
-          this.submitDisabled = true
-          var stateMap = {}
-          this.ruleForm.process = parseInt(this.$route.query.processId)
-          this.ruleForm.classify = this.processStructureValue.process.classify
-          stateMap['id'] = target
-          this.ruleForm.source_state = this.processStructureValue.nodes[this.active].label
-          for (var v of this.processStructureValue.nodes) {
-            if (v.id === target) {
-              if (v.assignType !== undefined) {
-                stateMap['process_method'] = v.assignType
-              }
-              if (v.assignValue !== undefined) {
-                stateMap['processor'] = Array.from(new Set(v.assignValue))
-              }
-              stateMap['label'] = v.label
-              break
-            }
-          }
-          this.ruleForm.state = [stateMap]
-
-          this.ruleForm.tpls = {
-            'form_structure': [],
-            'form_data': []
-          }
-          // 绑定流程任务
-          this.ruleForm.tasks = this.processStructureValue.process.task === undefined ? [] : this.processStructureValue.process.task
-          // 追加节点任务
-          if (this.processStructureValue.nodes[this.active].task !== undefined && this.processStructureValue.nodes[this.active].task.length > 0) {
-            for (var task of this.processStructureValue.nodes[this.active].task) {
-              if (this.ruleForm.tasks.indexOf(task) === -1) {
-                this.ruleForm.tasks.push(task)
-              }
-            }
-          }
-
-          var promiseList = []
-          for (var tpl of this.processStructureValue.tpls) {
-            tpl.form_structure.id = tpl.id
-            this.ruleForm.tpls.form_structure.push(tpl.form_structure)
-            promiseList.push(this.$refs['generateForm-' + tpl.id][0].getData())
-          }
-          Promise.all(promiseList).then(values => {
-            this.ruleForm.source = this.processStructureValue.nodes[this.active].id
-            this.ruleForm.tpls.form_data = values
-            createWorkOrder(this.ruleForm).then(response => {
-              if (response.code === 200) {
-                this.$router.push({ path: '/process/upcoming' })
-              }
-            }).catch(() => {
-              this.submitDisabled = false
-            })
-          }).catch(() => {
-            this.submitDisabled = false
-          })
-        }
-      })
-    }
-  }
-}
-</script>
+<template>
+  <div class="app-container">
+    <el-card class="box-card">
+      <div slot="header" class="clearfix">
+        <span>公共信息</span>
+      </div>
+      <div class="text item">
+        <el-form
+          ref="ruleForm"
+          :model="ruleForm"
+          :rules="rules"
+          label-width="150px"
+        >
+          <el-form-item
+            label="优先级:"
+            prop="priority"
+            style="margin-bottom: 0"
+          >
+            <el-radio-group v-model="ruleForm.priority" size="small">
+              <el-radio :label="1">一般</el-radio>
+              <el-radio :label="2">紧急</el-radio>
+              <el-radio :label="3">非常紧急</el-radio>
+            </el-radio-group>
+          </el-form-item>
+
+          <el-form-item
+            label="申请部门:"
+            prop="deptId"
+            style="margin-bottom: 0"
+          >
+            <el-select v-model="ruleForm.deptId" size="small" clearable>
+              <el-option v-for="(item, index) in deptList" :label="item.deptName" :value="item.deptId" :key="index"></el-option>
+            </el-select>
+            <span v-if="!socialId && currentNode.id">(未设置社保部门)</span>
+            <span v-if="ruleForm.deptId && socialId != ruleForm.deptId">(该部门非社保部门)</span>
+          </el-form-item>
+        </el-form>
+      </div>
+    </el-card>
+
+    <el-card class="box-card" style="margin-top: 10px">
+      <div slot="header" class="clearfix">
+        <span>表单信息</span>
+      </div>
+      <div class="text item">
+        <template v-for="(tplItem, tplIndex) in processStructureValue.tpls">
+          <fm-generate-form
+            v-show="
+              currentNode.hideTpls === undefined ||
+                currentNode.hideTpls === null ||
+                currentNode.hideTpls.indexOf(tplItem.id) === -1
+            "
+            :key="tplIndex"
+            :ref="'generateForm-' + tplItem.id"
+            :preview="
+              currentNode.hideTpls === undefined || currentNode.hideTpls === null || currentNode.hideTpls.indexOf(tplItem.id) === -1
+                ? false
+                : true
+            "
+            :remote="remoteFunc"
+            :data="tplItem.form_structure"
+            :disabled="
+              currentNode.readonlyTpls === undefined || currentNode.readonlyTpls === null || currentNode.readonlyTpls.indexOf(tplItem.id) === -1
+                ? null
+                : true
+            "
+            :organ-list="organList"
+          />
+        </template>
+      </div>
+      <hr style="background-color: #d9d9d9; border:0; height:1px;" />
+      <div class="text item" style="text-align: center;margin-top:18px">
+        <el-button v-for="(item, index) in btn_group"
+          :key="index"
+          :type="item.className"
+          :disabled="submitDisabled"
+          @click="submitAction(item.target)">提交</el-button>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import Vue from "vue";
+import { GenerateForm } from "@/components/VueFormMaking";
+import "form-making/dist/FormMaking.css";
+Vue.component(GenerateForm.name, GenerateForm);
+
+import { processStructure, createWorkOrder, queryAllOrgan } from "@/api/process/work-order";
+import { listUser } from "@/api/system/sysuser";
+export default {
+  name: "Create",
+  data() {
+    return {
+      submitDisabled: false,
+      active: 0,
+      currentNode: {},
+      organList: [],
+      processStructureValue: {},
+      socialId: null, // 是否是社保分部
+      ruleForm: {
+        priority: 1,
+        deptId: null, // 社保部分
+        process: "",
+        classify: "",
+        state: [],
+        source: "",
+        source_state: "",
+        process_method: "",
+        tpls: {
+          form_structure: [],
+          form_data: []
+        },
+        tasks: []
+      },
+      rules: {
+        deptId: [
+          { required: true, message: "请选择申请部门", trigger: "change" }
+        ],
+        priority: [
+          { required: true, message: "请选择工单优先级", trigger: "blur" }
+        ]
+      },
+      deptList: [], // 分部列表
+      btn_group: [],
+      remoteFunc: {
+        // 获取用户列表
+        userList(resolve) {
+          listUser({
+            pageSize: 999999
+          }).then(response => {
+            const options = response.data.list;
+            resolve(options);
+          });
+        }
+      }
+    };
+  },
+  created() {
+    this.getAllOrgan()
+    this.getProcessNodeList()
+  },
+  methods: {
+    getAllOrgan() { // 获取分部
+      queryAllOrgan().then(res => {
+        if (res.code == 200) {
+          const result = res.data;
+          const filterOrganId = [36, 39, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 52, 54, 55, 56]
+          let tempOrgan = []
+          // 过滤不会显示的分部
+          result.forEach(item => {
+            if (!filterOrganId.includes(item.id)) {
+              tempOrgan.push(item)
+            }
+          })
+          this.organList = tempOrgan
+        }
+      })
+    },
+    getProcessNodeList() {
+      processStructure({
+        processId: this.$route.query.processId
+      }).then(response => {
+        this.processStructureValue = response.data
+        this.currentNode = this.processStructureValue.nodes[0]
+
+        this.deptList = response.data.depts || []
+        const defaultDept = response.data.deptId
+        this.socialId = defaultDept
+        this.deptList.forEach((item, index) => {
+          if (defaultDept) {
+            if (item.deptId == defaultDept) {
+              this.deptName = item.deptName
+              this.ruleForm.deptId = item.deptId
+            }
+          } else {
+            if (index == 0) {
+              this.deptName = item.deptName
+              this.ruleForm.deptId = item.deptId
+            }
+          }
+          item.text = item.deptName
+        })
+
+        const psv = response.data.edges || []
+        const btn_group = []
+        psv.forEach(item => {
+          if (item.source === this.currentNode.id && item.flowProperties == 1) {
+            if (item.flowProperties == 1) {
+              item.className = "primary"
+            } else if (item.flowProperties == 0) {
+              item.className = "danger"
+            } else if (item.flowProperties == 2) {
+              item.className = "primary"
+            }
+            btn_group.push(item)
+          } else {
+            item.className = "primary"
+          }
+        });
+        this.btn_group = btn_group
+        if (!this.socialId && this.deptList.length <= 0) {
+          // this.$dialog.alert({
+          //   message: "您当前暂未设置所属部门，请联系管理员",
+          //   confirmButtonColor: "#01C1B5"
+          // })
+          this.$alert('您当前暂未设置所属部门，请联系管理员', '提示', {
+          confirmButtonText: '确定',
+          callback: action => {}
+        });
+        }
+      })
+    },
+    submitAction(target) {
+      this.$refs["ruleForm"].validate(valid => {
+        if (valid) {
+          this.submitDisabled = true;
+          var stateMap = {};
+          this.ruleForm.process = parseInt(this.$route.query.processId);
+          this.ruleForm.classify = this.processStructureValue.process.classify;
+          stateMap["id"] = target;
+          this.ruleForm.source_state = this.processStructureValue.nodes[
+            this.active
+          ].label;
+          for (var v of this.processStructureValue.nodes) {
+            if (v.id === target) {
+              if (v.assignType !== undefined) {
+                stateMap["process_method"] = v.assignType;
+              }
+              if (v.assignValue !== undefined) {
+                stateMap["processor"] = Array.from(new Set(v.assignValue));
+              }
+              stateMap["label"] = v.label;
+              break;
+            }
+          }
+          this.ruleForm.state = [stateMap];
+
+          this.ruleForm.tpls = {
+            form_structure: [],
+            form_data: []
+          };
+          // 绑定流程任务
+          this.ruleForm.tasks =
+            this.processStructureValue.process.task === undefined
+              ? []
+              : this.processStructureValue.process.task;
+          // 追加节点任务
+          if (
+            this.processStructureValue.nodes[this.active].task !== undefined &&
+            this.processStructureValue.nodes[this.active].task.length > 0
+          ) {
+            for (var task of this.processStructureValue.nodes[this.active]
+              .task) {
+              if (this.ruleForm.tasks.indexOf(task) === -1) {
+                this.ruleForm.tasks.push(task);
+              }
+            }
+          }
+
+          var promiseList = [];
+          for (var tpl of this.processStructureValue.tpls) {
+            tpl.form_structure.id = tpl.id;
+            this.ruleForm.tpls.form_structure.push(tpl.form_structure);
+            promiseList.push(this.$refs["generateForm-" + tpl.id][0].getData());
+          }
+          Promise.all(promiseList)
+            .then(values => {
+              this.ruleForm.source = this.processStructureValue.nodes[
+                this.active
+              ].id;
+              this.ruleForm.tpls.form_data = values;
+              createWorkOrder(this.ruleForm)
+                .then(response => {
+                  if (response.code === 200) {
+                    this.$message.success('工单申请成功')
+                    this.$router.push({ path: "/process/my-create" });
+                  }
+                })
+                .catch(() => {
+                  this.submitDisabled = false;
+                });
+            })
+            .catch(() => {
+              this.submitDisabled = false;
+            });
+        }
+      });
+    }
+  }
+};
+</script>

src/views/process/list/handle.vue

@@ -1,344 +1,362 @@
-<template>
-  <div class="app-container">
-    <div v-if="isLoadingStatus" />
-    <div v-else>
-      <el-card class="box-card">
-        <div class="text item">
-          <el-steps v-if="currentNode.clazz !== undefined && currentNode.clazz !== null && currentNode.clazz !== ''" :active="activeIndex" finish-status="success">
-            <template v-for="(item, index) in nodeStepList">
-              <el-step
-                v-if="item.isHideNode === false ||
-                  item.isHideNode === undefined ||
-                  item.isHideNode == null ||
-                  item.id === processStructureValue.workOrder.current_state"
-                :key="index"
-                :title="item.label"
-              />
-            </template>
-          </el-steps>
-          <div v-else>
-            <el-alert
-              show-icon
-              title="未找到当前工单流程信息，请确认当前工单绑定的流程是否存在。"
-              type="warning"
-            />
-          </div>
-        </div>
-      </el-card>
-
-      <el-alert
-        v-if="activeIndex !== nodeStepList.length && processStructureValue.workOrder.is_end===1"
-        style="margin-top: 15px"
-        :title="alertMessage"
-        type="error"
-        :closable="false"
-      />
-
-      <el-card class="box-card" style="margin-top: 15px">
-        <div slot="header" class="clearfix">
-          <span>公共信息</span>
-        </div>
-        <div class="text item">
-          <el-form label-width="100px">
-            <el-row>
-              <el-col :span="12">
-                <el-form-item label="标题:" style="margin-bottom: 5px">
-                  <span>{{ processStructureValue.workOrder.title }}</span>
-                </el-form-item>
-              </el-col>
-              <el-col :span="12">
-                <el-form-item label="优先级:" style="margin-bottom: 0">
-                  <span v-if="processStructureValue.workOrder.priority===2">
-                    <el-tag type="warning">紧急</el-tag>
-                  </span>
-                  <span v-else-if="processStructureValue.workOrder.priority===3">
-                    <el-tag type="danger">非常紧急</el-tag>
-                  </span>
-                  <span v-else>
-                    <el-tag type="success">一般</el-tag>
-                  </span>
-                </el-form-item>
-              </el-col>
-            </el-row>
-          </el-form>
-        </div>
-      </el-card>
-
-      <el-card class="box-card" style="margin-top: 15px;">
-        <div slot="header" class="clearfix">
-          <span>表单信息</span>
-        </div>
-        <div class="text item">
-          <template v-for="(tplItem, tplIndex) in processStructureValue.tpls">
-            <fm-generate-form
-              v-show="currentNode.hideTpls===undefined ||
-                currentNode.hideTpls===null ||
-                currentNode.hideTpls.indexOf(tplItem.form_structure.id)===-1"
-              :key="tplIndex"
-              :ref="'generateForm-'+tplItem.id"
-              :preview="(currentNode.hideTpls!==undefined &&
-                currentNode.hideTpls!==null &&
-                currentNode.hideTpls.indexOf(tplItem.form_structure.id)!==-1) ||
-                (currentNode.writeTpls===undefined ||
-                currentNode.writeTpls===null ||
-                currentNode.writeTpls.indexOf(tplItem.form_structure.id)===-1)||
-                (isActiveProcessing && currentNode.activeOrder)?true:false"
-              :remote="remoteFunc"
-              :value="tplItem.form_data"
-              :data="tplItem.form_structure"
-              :organ-list="organList"
-            />
-          </template>
-        </div>
-        <div v-if="processStructureValue.userAuthority">
-          <hr style="background-color: #d9d9d9; border:0; height:1px; margin-bottom: 15px">
-          <div>
-            <el-input
-              v-model="remarks"
-              type="textarea"
-              placeholder="请输入备注信息"
-              maxlength="200"
-              :autosize="{ minRows: 3, maxRows: 99}"
-              show-word-limit
-            />
-          </div>
-          <div class="text item" style="text-align: center;margin-top:18px">
-            <div
-              v-if="isActiveProcessing && currentNode.activeOrder"
-            >
-              <el-button
-                v-permisaction="['process:list:handle:active']"
-                type="primary"
-                @click="activeOrderActive"
-              >
-                主动接单
-              </el-button>
-            </div>
-            <div v-else>
-              <template v-for="(item, index) in processStructureValue.edges">
-                <el-button
-                  v-if="processStructureValue.workOrder.is_end===0 && item.source===currentNode.id"
-                  :key="index"
-                  type="primary"
-                  @click="submitAction(item)"
-                >
-                  {{ item.label }}
-                </el-button>
-              </template>
-            </div>
-          </div>
-        </div>
-      </el-card>
-
-      <el-card class="box-card" style="margin-top: 15px">
-        <div slot="header" class="clearfix">
-          <span>工单流转历史</span>
-        </div>
-        <div class="text item">
-          <el-table
-            :data="circulationHistoryList"
-            border
-            style="width: 100%"
-          >
-            <el-table-column
-              prop="state"
-              label="节点"
-            />
-            <el-table-column
-              prop="circulation"
-              label="流转"
-            />
-            <el-table-column
-              prop="processor"
-              label="处理人"
-            />
-            <el-table-column
-              prop="create_time"
-              label="处理时间"
-            />
-            <el-table-column
-              prop="remarks"
-              label="备注"
-            />
-          </el-table>
-        </div>
-      </el-card>
-    </div>
-  </div>
-</template>
-
-<script>
-import Vue from 'vue'
-import {
-  GenerateForm
-} from '@/components/VueFormMaking'
-import 'form-making/dist/FormMaking.css'
-Vue.component(GenerateForm.name, GenerateForm)
-
-import {
-  processStructure,
-  handleWorkOrder,
-  activeOrder,
-  queryAllOrgan
-} from '@/api/process/work-order'
-
-import { listUser } from '@/api/system/sysuser'
-
-import { mapGetters } from 'vuex'
-export default {
-  data() {
-    return {
-      isLoadingStatus: true,
-      currentNode: {
-        hideTpls: null,
-        writeTpls: null
-      },
-      isActiveProcessing: false,
-      tpls: [],
-      organList: [],
-      remarks: '', // 备注信息
-      alertMessage: '',
-      nodeStepList: [],
-      circulationHistoryList: [],
-      activeIndex: 0,
-      processStructureValue: {
-        workOrder: { title: '' }
-      },
-      ruleForm: {
-        title: '',
-        process: '',
-        classify: '',
-        state_id: '',
-        state: '',
-        source_state: '',
-        processor: '',
-        process_method: '',
-        tpls: [],
-        tasks: []
-      },
-      remoteFunc: {
-        // 获取用户列表
-        userList(resolve) {
-          listUser({
-            pageSize: 999999
-          }).then(response => {
-            const options = response.data.list
-            resolve(options)
-          })
-        }
-      }
-    }
-  },
-  computed: {
-    ...mapGetters([
-      'userId'
-    ])
-  },
-  created() {
-    this.getAllOrgan()
-    this.getProcessNodeList()
-  },
-  methods: {
-    getProcessNodeList() {
-      processStructure({
-        processId: this.$route.query.processId,
-        workOrderId: this.$route.query.workOrderId
-      }).then(response => {
-        this.isActiveProcessing = false
-        this.processStructureValue = response.data
-        this.circulationHistoryList = this.processStructureValue.circulationHistory
-        // 获取当前展示节点列表
-        this.nodeStepList = []
-        for (var i = 0; i < this.processStructureValue.nodes.length; i++) {
-          if (this.processStructureValue.nodes[i].id === this.processStructureValue.workOrder.current_state) {
-            // 当前节点
-            this.nodeStepList.push(this.processStructureValue.nodes[i])
-            this.activeIndex = this.nodeStepList.length - 1
-            if (i + 1 === this.processStructureValue.nodes.length) {
-              this.activeIndex = this.nodeStepList.length
-            }
-            this.currentNode = this.processStructureValue.nodes[i]
-          } else if (!this.processStructureValue.nodes[i].isHideNode) {
-            // 非隐藏节点
-            this.nodeStepList.push(this.processStructureValue.nodes[i])
-          }
-        }
-
-        // 如果回退到初始节点则可编辑。
-        if (this.activeIndex === 0 && this.currentNode.clazz === 'start') {
-          this.currentNode.writeTpls = []
-          for (var tplTmp of this.processStructureValue.tpls) {
-            this.currentNode.writeTpls.push(tplTmp.form_structure.id)
-          }
-        }
-
-        // 判断是否需要主动处理
-        for (var stateValue of this.processStructureValue.workOrder.state) {
-          if (this.processStructureValue.workOrder.current_state === stateValue.id && stateValue.processor.length > 1) {
-            this.isActiveProcessing = true
-            break
-          }
-        }
-        this.isLoadingStatus = false
-        this.getAlertMessage()
-      })
-    },
-    submitAction(item) {
-      var promiseList = []
-      this.tpls = []
-      for (var tpl of this.processStructureValue.tpls) {
-        this.tpls.push({
-          tplDataId: tpl.id,
-          tplId: tpl.form_structure.id
-        })
-        promiseList.push(this.$refs['generateForm-' + tpl.id][0].getData())
-      }
-      Promise.all(promiseList).then(values => {
-        for (var tplDataIndex in this.tpls) {
-          this.tpls[tplDataIndex].tplValue = values[tplDataIndex]
-        }
-        handleWorkOrder({
-          tasks: this.processStructureValue.process.task,
-          source_state: this.processStructureValue.workOrder.current_state,
-          target_state: item.target,
-          circulation: item.label,
-          flow_properties: item.flowProperties === undefined ? 2 : parseInt(item.flowProperties),
-          work_order_id: parseInt(this.$route.query.workOrderId),
-          remarks: this.remarks,
-          tpls: this.tpls
-        }).then(response => {
-          if (response.code === 200) {
-          // this.$router.push({ name: 'upcoming' })
-          // window.location.reload()
-            this.getProcessNodeList()
-          }
-        })
-      })
-    },
-    // 获取提示消息
-    getAlertMessage() {
-      if (this.processStructureValue.workOrder.is_end === 1) {
-        this.alertMessage = '当前工单已结束。'
-      }
-    },
-    activeOrderActive() {
-      var jsonData = [{
-        id: this.nodeStepList[this.activeIndex].id,
-        label: this.nodeStepList[this.activeIndex].label,
-        process_method: 'person',
-        processor: [this.userId]
-      }]
-      activeOrder(jsonData, this.$route.query.workOrderId).then(() => {
-        this.getProcessNodeList()
-      })
-    },
-    getAllOrgan() {
-      queryAllOrgan().then(res => {
-        if (res.code == 200) {
-          this.organList = res.data
-        }
-      })
-    }
-  }
-}
-</script>
+<template>
+  <div class="app-container">
+    <div v-if="isLoadingStatus" />
+    <div v-else>
+      <el-card class="box-card">
+        <div class="text item">
+          <el-steps v-if="currentNode.clazz !== undefined && currentNode.clazz !== null && currentNode.clazz !== ''" :active="activeIndex" finish-status="success">
+            <template v-for="(item, index) in nodeStepList">
+              <el-step
+                v-if="item.isHideNode === false ||
+                  item.isHideNode === undefined ||
+                  item.isHideNode == null ||
+                  item.id === processStructureValue.workOrder.current_state"
+                :key="index"
+                :title="item.label"
+              />
+            </template>
+          </el-steps>
+          <div v-else>
+            <el-alert
+              show-icon
+              title="未找到当前工单流程信息，请确认当前工单绑定的流程是否存在。"
+              type="warning"
+            />
+          </div>
+        </div>
+      </el-card>
+
+      <el-alert
+        v-if="activeIndex !== nodeStepList.length && processStructureValue.workOrder.is_end===1"
+        style="margin-top: 15px"
+        :title="alertMessage"
+        type="error"
+        :closable="false"
+      />
+
+      <el-card class="box-card" style="margin-top: 15px">
+        <div slot="header" class="clearfix">
+          <span>公共信息</span>
+        </div>
+        <div class="text item">
+          <el-form label-width="100px">
+            <el-row>
+              <el-col :span="12">
+                <el-form-item label="标题:" style="margin-bottom: 5px">
+                  <span>{{ processStructureValue.workOrder.title }}</span>
+                </el-form-item>
+              </el-col>
+              <el-col :span="12">
+                <el-form-item label="优先级:" style="margin-bottom: 0">
+                  <span v-if="processStructureValue.workOrder.priority===2">
+                    <el-tag type="warning">紧急</el-tag>
+                  </span>
+                  <span v-else-if="processStructureValue.workOrder.priority===3">
+                    <el-tag type="danger">非常紧急</el-tag>
+                  </span>
+                  <span v-else>
+                    <el-tag type="success">一般</el-tag>
+                  </span>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-form>
+        </div>
+      </el-card>
+
+      <el-card class="box-card" style="margin-top: 15px;">
+        <div slot="header" class="clearfix">
+          <span>表单信息</span>
+        </div>
+        <div class="text item">
+          <template v-for="(tplItem, tplIndex) in processStructureValue.tpls">
+            <fm-generate-form
+              v-show="currentNode.hideTpls===undefined ||
+                currentNode.hideTpls===null ||
+                currentNode.hideTpls.indexOf(tplItem.form_structure.id)===-1"
+              :key="tplIndex"
+              :ref="'generateForm-'+tplItem.id"
+              :preview="(currentNode.hideTpls!==undefined &&
+                currentNode.hideTpls!==null &&
+                currentNode.hideTpls.indexOf(tplItem.form_structure.id)!==-1) ||
+                (currentNode.writeTpls===undefined ||
+                currentNode.writeTpls===null ||
+                currentNode.writeTpls.indexOf(tplItem.form_structure.id)===-1)||
+                (isActiveProcessing && currentNode.activeOrder)?true:false"
+              :remote="remoteFunc"
+              :value="tplItem.form_data"
+              :data="tplItem.form_structure"
+              :organ-list="organList"
+            />
+          </template>
+        </div>
+        <div v-if="processStructureValue.userAuthority">
+          <hr style="background-color: #d9d9d9; border:0; height:1px; margin-bottom: 15px">
+          <div>
+            <el-input
+              v-model="remarks"
+              type="textarea"
+              placeholder="请输入备注信息"
+              maxlength="200"
+              :autosize="{ minRows: 3, maxRows: 99}"
+              show-word-limit
+            />
+          </div>
+          <div class="text item" style="text-align: center;margin-top:18px">
+            <div
+              v-if="isActiveProcessing && currentNode.activeOrder"
+            >
+              <el-button
+                v-permisaction="['process:list:handle:active']"
+                type="primary"
+                @click="activeOrderActive"
+              >
+                主动接单
+              </el-button>
+            </div>
+            <div v-else>
+              <template v-for="(item, index) in processStructureValue.edges">
+                <el-button
+                  v-if="processStructureValue.workOrder.is_end===0 && item.source===currentNode.id"
+                  :key="index"
+                  type="primary"
+                  @click="submitAction(item)"
+                >
+                  {{ item.label }}
+                </el-button>
+              </template>
+            </div>
+          </div>
+        </div>
+      </el-card>
+
+      <el-card class="box-card" style="margin-top: 15px">
+        <div slot="header" class="clearfix">
+          <span>工单流转历史</span>
+        </div>
+        <div class="text item">
+          <el-table
+            :data="circulationHistoryList"
+            border
+            style="width: 100%"
+          >
+            <el-table-column
+              prop="state"
+              label="节点"
+            />
+            <el-table-column
+              prop="circulation"
+              label="流转"
+            />
+            <el-table-column
+              prop="processor"
+              label="处理人"
+            />
+            <el-table-column
+              prop="create_time"
+              label="处理时间"
+            />
+            <el-table-column
+              prop="remarks"
+              label="备注"
+            />
+          </el-table>
+        </div>
+      </el-card>
+    </div>
+  </div>
+</template>
+
+<script>
+import Vue from 'vue'
+import {
+  GenerateForm
+} from '@/components/VueFormMaking'
+import 'form-making/dist/FormMaking.css'
+Vue.component(GenerateForm.name, GenerateForm)
+
+import {
+  processStructure,
+  handleWorkOrder,
+  activeOrder,
+  queryAllOrgan
+} from '@/api/process/work-order'
+
+import { listUser } from '@/api/system/sysuser'
+
+import { mapGetters } from 'vuex'
+export default {
+  data() {
+    return {
+      isLoadingStatus: true,
+      currentNode: {
+        hideTpls: null,
+        writeTpls: null
+      },
+      isActiveProcessing: false,
+      tpls: [],
+      organList: [],
+      remarks: '', // 备注信息
+      alertMessage: '',
+      nodeStepList: [],
+      circulationHistoryList: [],
+      activeIndex: 0,
+      processStructureValue: {
+        workOrder: { title: '' }
+      },
+      ruleForm: {
+        title: '',
+        process: '',
+        classify: '',
+        state_id: '',
+        state: '',
+        source_state: '',
+        processor: '',
+        process_method: '',
+        tpls: [],
+        tasks: []
+      },
+      remoteFunc: {
+        // 获取用户列表
+        userList(resolve) {
+          listUser({
+            pageSize: 999999
+          }).then(response => {
+            const options = response.data.list
+            resolve(options)
+          })
+        }
+      }
+    }
+  },
+  computed: {
+    ...mapGetters([
+      'userId'
+    ])
+  },
+  created() {
+    this.getAllOrgan()
+    this.getProcessNodeList()
+  },
+  methods: {
+    getProcessNodeList() {
+      processStructure({
+        processId: this.$route.query.processId,
+        workOrderId: this.$route.query.workOrderId
+      }).then(response => {
+        this.isActiveProcessing = false
+        this.processStructureValue = response.data
+        this.circulationHistoryList = this.processStructureValue.circulationHistory
+        // 获取当前展示节点列表
+        this.nodeStepList = []
+        for (var i = 0; i < this.processStructureValue.nodes.length; i++) {
+          if (this.processStructureValue.nodes[i].id === this.processStructureValue.workOrder.current_state) {
+            // 当前节点
+            this.nodeStepList.push(this.processStructureValue.nodes[i])
+            this.activeIndex = this.nodeStepList.length - 1
+            if (i + 1 === this.processStructureValue.nodes.length) {
+              this.activeIndex = this.nodeStepList.length
+            }
+            this.currentNode = this.processStructureValue.nodes[i]
+          } else if (!this.processStructureValue.nodes[i].isHideNode) {
+            // 非隐藏节点
+            this.nodeStepList.push(this.processStructureValue.nodes[i])
+          }
+        }
+
+        // 如果回退到初始节点则可编辑。
+        if (this.activeIndex === 0 && this.currentNode.clazz === 'start') {
+          this.currentNode.writeTpls = []
+          for (var tplTmp of this.processStructureValue.tpls) {
+            this.currentNode.writeTpls.push(tplTmp.form_structure.id)
+          }
+        }
+
+        // 判断是否需要主动处理
+        for (var stateValue of this.processStructureValue.workOrder.state) {
+          if (this.processStructureValue.workOrder.current_state === stateValue.id && stateValue.processor.length > 1) {
+            this.isActiveProcessing = true
+            break
+          }
+        }
+        this.isLoadingStatus = false
+        this.getAlertMessage()
+      })
+    },
+    submitAction(item) {
+      var promiseList = []
+      this.tpls = []
+      for (var tpl of this.processStructureValue.tpls) {
+        this.tpls.push({
+          tplDataId: tpl.id,
+          tplId: tpl.form_structure.id
+        })
+        promiseList.push(this.$refs['generateForm-' + tpl.id][0].getData())
+      }
+      Promise.all(promiseList).then(values => {
+        for (var tplDataIndex in this.tpls) {
+          this.tpls[tplDataIndex].tplValue = values[tplDataIndex]
+        }
+        handleWorkOrder({
+          tasks: this.processStructureValue.process.task,
+          source_state: this.processStructureValue.workOrder.current_state,
+          target_state: item.target,
+          circulation: item.label,
+          flow_properties: item.flowProperties === undefined ? 2 : parseInt(item.flowProperties),
+          work_order_id: parseInt(this.$route.query.workOrderId),
+          remarks: this.remarks,
+          tpls: this.tpls
+        }).then(response => {
+          if (response.code === 200) {
+          // this.$router.push({ name: 'upcoming' })
+          // window.location.reload()
+            this.getProcessNodeList()
+          }
+        })
+      })
+    },
+    // 获取提示消息
+    getAlertMessage() {
+      if (this.processStructureValue.workOrder.is_end === 1) {
+        this.alertMessage = '当前工单已结束。'
+      }
+    },
+    activeOrderActive() {
+      var jsonData = [{
+        id: this.nodeStepList[this.activeIndex].id,
+        label: this.nodeStepList[this.activeIndex].label,
+        process_method: 'person',
+        processor: [this.userId]
+      }]
+      activeOrder(jsonData, this.$route.query.workOrderId).then(() => {
+        this.getProcessNodeList()
+      })
+    },
+    getAllOrgan() {
+      queryAllOrgan().then(res => {
+        if (res.code == 200) {
+          const result = res.data;
+          const filterOrganId = [36, 39, 41, 42, 43, 44, 45, 46, 47, 48, 49, 50, 52, 54, 55, 56]
+          let tempOrgan = []
+          // 过滤不会显示的分部
+          result.forEach(item => {
+            if (!filterOrganId.includes(item.id)) {
+              tempOrgan.push(item)
+            }
+          })
+          this.organList = tempOrgan
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+/deep/ .el-step__title {
+  font-size: 14px;
+  line-height: 1.3;
+  width: 80%;
+  padding-top: 10px;
+}
+</style>

src/views/process/list/template-manager.vue

@@ -0,0 +1,44 @@
+<template>
+  <div class="app-container">
+    <el-card class="box-card">
+      <el-table border :data="dataList">
+        <el-table-column label="ID" prop="id" width="120" />
+        <el-table-column label="模板名称" prop="title" />
+        <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="180">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="text"
+              icon="el-icon-download"
+              @click="handleView(scope.row)"
+            >下载</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      dataList: [{
+        id: 1,
+        title: '乐团退费模板',
+        url: 'https://daya.ks3-cn-beijing.ksyun.com/202203/T14lYae.xls'
+      }]
+    }
+  },
+  methods: {
+    // 下载模板
+    handleView(row) {
+      window.location.href = row.url
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

vue.config.js

@@ -1,187 +1,187 @@
-'use strict'
-const path = require('path')
-const defaultSettings = require('./src/settings.js')
-
-function resolve(dir) {
-  return path.join(__dirname, dir)
-}
-
-const name = defaultSettings.title || 'ferry' // page title
-
-// If your port is set to 80,
-// use administrator privileges to execute the command line.
-// For example, Mac: sudo npm run
-// You can change the port by the following method:
-// port = 9527 npm run dev OR npm run dev --port = 9527
-const port = process.env.port || process.env.npm_config_port || 9527 // dev port
-
-const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin')
-let target = 'http://mandev.dayaedu.com'
-// All configuration item explanations can be find in https://cli.vuejs.org/config/
-module.exports = {
-  /**
-   * You will need to set publicPath if you plan to deploy your site under a sub path,
-   * for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/,
-   * then publicPath should be set to "/bar/".
-   * In most cases please use '/' !!!
-   * Detail: https://cli.vuejs.org/config/#publicpath
-   */
-  publicPath: '/',
-  outputDir: 'web',
-  assetsDir: 'static/web',
-  lintOnSave: false, // process.env.NODE_ENV === 'development',
-  productionSourceMap: false,
-  devServer: {
-    port: port,
-    open: true,
-    overlay: {
-      warnings: false,
-      errors: true
-    },
-    proxy: {
-      // change xxx-api/login => mock/login
-      // detail: https://cli.vuejs.org/config/#devserver-proxy
-      // http://47.99.212.176:8000
-      // http://192.168.3.28:8000
-      // http://192.168.3.134
-      // http://47.114.176.40:8000
-      // let target = 'http://dev.dayaedu.com'
-      // 'http://dev.dayaedu.com'
-      '/api-auth': {
-        target: target,
-        // target : target,
-        changeOrigin: true,
-        pathRewrite: {
-          '^api-auth': ''
-        }
-      },
-      '/api-task': {
-        target: target,
-        changeOrigin: true,
-        pathRewrite: {
-          '^api-task': ''
-        }
-      },
-      '/api-oa': {
-        target: target,
-        changeOrigin: true,
-        pathRewrite: {
-          '^api-task': ''
-        }
-      },
-      '/api-web': {
-        target: target,
-        changeOrigin: true,
-        pathRewrite: {
-          '^api-web': ''
-        }
-      },
-      '/api-cms': {
-        target: target,
-        changeOrigin: true,
-        pathRewrite: {
-          '^api-cms': ''
-        }
-      },
-      '/api-teacher': {
-        target: target,
-        changeOrigin: true,
-        pathRewrite: {
-          '^api-teacher': ''
-        }
-      },
-      '/jiari': {
-        target: 'http://tool.bitefu.net',
-        changeOrigin: true,
-      },
-    },
-  },
-  configureWebpack: {
-    plugins: [
-      new MonacoWebpackPlugin()
-    ],
-    name: name,
-    resolve: {
-      alias: {
-        '@': resolve('src')
-      }
-    }
-  },
-  chainWebpack(config) {
-    config.plugins.delete('preload') // TODO: need test
-    config.plugins.delete('prefetch') // TODO: need test
-
-    // set svg-sprite-loader
-    config.module
-      .rule('svg')
-      .exclude.add(resolve('src/icons'))
-      .end()
-    config.module
-      .rule('icons')
-      .test(/\.svg$/)
-      .include.add(resolve('src/icons'))
-      .end()
-      .use('svg-sprite-loader')
-      .loader('svg-sprite-loader')
-      .options({
-        symbolId: 'icon-[name]'
-      })
-      .end()
-
-    // set preserveWhitespace
-    config.module
-      .rule('vue')
-      .use('vue-loader')
-      .loader('vue-loader')
-      .tap(options => {
-        options.compilerOptions.preserveWhitespace = true
-        return options
-      })
-      .end()
-
-    config
-      // https://webpack.js.org/configuration/devtool/#development
-      .when(process.env.NODE_ENV === 'development',
-        config => config.devtool('cheap-source-map')
-      )
-
-    config
-      .when(process.env.NODE_ENV !== 'development',
-        config => {
-          config
-            .plugin('ScriptExtHtmlWebpackPlugin')
-            .after('html')
-            .use('script-ext-html-webpack-plugin', [{
-            // `runtime` must same as runtimeChunk name. default is `runtime`
-              inline: /runtime\..*\.js$/
-            }])
-            .end()
-          config
-            .optimization.splitChunks({
-              chunks: 'all',
-              cacheGroups: {
-                libs: {
-                  name: 'chunk-libs',
-                  test: /[\\/]node_modules[\\/]/,
-                  priority: 10,
-                  chunks: 'initial' // only package third parties that are initially dependent
-                },
-                elementUI: {
-                  name: 'chunk-elementUI', // split elementUI into a single package
-                  priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
-                  test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
-                },
-                commons: {
-                  name: 'chunk-commons',
-                  test: resolve('src/components'), // can customize your rules
-                  minChunks: 3, //  minimum common number
-                  priority: 5,
-                  reuseExistingChunk: true
-                }
-              }
-            })
-          config.optimization.runtimeChunk('single')
-        }
-      )
-  }
-}
+'use strict'
+const path = require('path')
+const defaultSettings = require('./src/settings.js')
+
+function resolve(dir) {
+  return path.join(__dirname, dir)
+}
+
+const name = defaultSettings.title || 'ferry' // page title
+
+// If your port is set to 80,
+// use administrator privileges to execute the command line.
+// For example, Mac: sudo npm run
+// You can change the port by the following method:
+// port = 9527 npm run dev OR npm run dev --port = 9527
+const port = process.env.port || process.env.npm_config_port || 9527 // dev port
+
+const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin')
+const target = 'https://mantest.dayaedu.com'
+// All configuration item explanations can be find in https://cli.vuejs.org/config/
+module.exports = {
+  /**
+   * You will need to set publicPath if you plan to deploy your site under a sub path,
+   * for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/,
+   * then publicPath should be set to "/bar/".
+   * In most cases please use '/' !!!
+   * Detail: https://cli.vuejs.org/config/#publicpath
+   */
+  publicPath: '/',
+  outputDir: 'web',
+  assetsDir: 'static/web',
+  lintOnSave: false, // process.env.NODE_ENV === 'development',
+  productionSourceMap: false,
+  devServer: {
+    port: port,
+    open: true,
+    overlay: {
+      warnings: false,
+      errors: true
+    },
+    proxy: {
+      // change xxx-api/login => mock/login
+      // detail: https://cli.vuejs.org/config/#devserver-proxy
+      // http://47.99.212.176:8000
+      // http://192.168.3.28:8000
+      // http://192.168.3.134
+      // http://47.114.176.40:8000
+      // let target = 'http://dev.dayaedu.com'
+      // 'http://dev.dayaedu.com'
+      '/api-auth': {
+        target: target,
+        // target : target,
+        changeOrigin: true,
+        pathRewrite: {
+          '^api-auth': ''
+        }
+      },
+      '/api-task': {
+        target: target,
+        changeOrigin: true,
+        pathRewrite: {
+          '^api-task': ''
+        }
+      },
+      '/api-oa': {
+        target: target,
+        changeOrigin: true,
+        pathRewrite: {
+          '^api-task': ''
+        }
+      },
+      '/api-web': {
+        target: target,
+        changeOrigin: true,
+        pathRewrite: {
+          '^api-web': ''
+        }
+      },
+      '/api-cms': {
+        target: target,
+        changeOrigin: true,
+        pathRewrite: {
+          '^api-cms': ''
+        }
+      },
+      '/api-teacher': {
+        target: target,
+        changeOrigin: true,
+        pathRewrite: {
+          '^api-teacher': ''
+        }
+      },
+      '/jiari': {
+        target: 'http://tool.bitefu.net',
+        changeOrigin: true
+      },
+    },
+  },
+  configureWebpack: {
+    plugins: [
+      new MonacoWebpackPlugin()
+    ],
+    name: name,
+    resolve: {
+      alias: {
+        '@': resolve('src')
+      }
+    }
+  },
+  chainWebpack(config) {
+    config.plugins.delete('preload') // TODO: need test
+    config.plugins.delete('prefetch') // TODO: need test
+
+    // set svg-sprite-loader
+    config.module
+      .rule('svg')
+      .exclude.add(resolve('src/icons'))
+      .end()
+    config.module
+      .rule('icons')
+      .test(/\.svg$/)
+      .include.add(resolve('src/icons'))
+      .end()
+      .use('svg-sprite-loader')
+      .loader('svg-sprite-loader')
+      .options({
+        symbolId: 'icon-[name]'
+      })
+      .end()
+
+    // set preserveWhitespace
+    config.module
+      .rule('vue')
+      .use('vue-loader')
+      .loader('vue-loader')
+      .tap(options => {
+        options.compilerOptions.preserveWhitespace = true
+        return options
+      })
+      .end()
+
+    config
+      // https://webpack.js.org/configuration/devtool/#development
+      .when(process.env.NODE_ENV === 'development',
+        config => config.devtool('cheap-source-map')
+      )
+
+    config
+      .when(process.env.NODE_ENV !== 'development',
+        config => {
+          config
+            .plugin('ScriptExtHtmlWebpackPlugin')
+            .after('html')
+            .use('script-ext-html-webpack-plugin', [{
+            // `runtime` must same as runtimeChunk name. default is `runtime`
+              inline: /runtime\..*\.js$/
+            }])
+            .end()
+          config
+            .optimization.splitChunks({
+              chunks: 'all',
+              cacheGroups: {
+                libs: {
+                  name: 'chunk-libs',
+                  test: /[\\/]node_modules[\\/]/,
+                  priority: 10,
+                  chunks: 'initial' // only package third parties that are initially dependent
+                },
+                elementUI: {
+                  name: 'chunk-elementUI', // split elementUI into a single package
+                  priority: 20, // the weight needs to be larger than libs and app or it will be packaged into libs or app
+                  test: /[\\/]node_modules[\\/]_?element-ui(.*)/ // in order to adapt to cnpm
+                },
+                commons: {
+                  name: 'chunk-commons',
+                  test: resolve('src/components'), // can customize your rules
+                  minChunks: 3, //  minimum common number
+                  priority: 5,
+                  reuseExistingChunk: true
+                }
+              }
+            })
+          config.optimization.runtimeChunk('single')
+        }
+      )
+  }
+}