| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | module.exports = { |
|---|
| | | root: true, |
|---|
| | | env: { |
|---|
| | | node: true |
|---|
| | | }, |
|---|
| | | 'extends': [ |
|---|
| | | 'plugin:vue/vue3-essential', |
|---|
| | | 'eslint:recommended' |
|---|
| | | ], |
|---|
| | | parserOptions: { |
|---|
| | | parser: 'babel-eslint' |
|---|
| | | }, |
|---|
| | | rules: { |
|---|
| | | 'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off', |
|---|
| | | 'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off' |
|---|
| | | }, |
|---|
| | | overrides: [ |
|---|
| | | { |
|---|
| | | files: [ |
|---|
| | | '**/__tests__/*.{j,t}s?(x)', |
|---|
| | | '**/tests/unit/**/*.spec.{j,t}s?(x)' |
|---|
| | | ], |
|---|
| | | env: { |
|---|
| | | mocha: true |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | .DS_Store |
|---|
| | | node_modules |
|---|
| | | /dist |
|---|
| | | |
|---|
| | | |
|---|
| | | # local env files |
|---|
| | | .env.local |
|---|
| | | .env.*.local |
|---|
| | | |
|---|
| | | # Log files |
|---|
| | | npm-debug.log* |
|---|
| | | yarn-debug.log* |
|---|
| | | yarn-error.log* |
|---|
| | | pnpm-debug.log* |
|---|
| | | |
|---|
| | | # Editor directories and files |
|---|
| | | .idea |
|---|
| | | .vscode |
|---|
| | | *.suo |
|---|
| | | *.ntvs* |
|---|
| | | *.njsproj |
|---|
| | | *.sln |
|---|
| | | *.sw? |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | # vol.vue3 |
|---|
| | | |
|---|
| | | ## Project setup |
|---|
| | | ``` |
|---|
| | | npm install |
|---|
| | | ``` |
|---|
| | | |
|---|
| | | ### Compiles and hot-reloads for development |
|---|
| | | ``` |
|---|
| | | npm run serve |
|---|
| | | ``` |
|---|
| | | |
|---|
| | | ### Compiles and minifies for production |
|---|
| | | ``` |
|---|
| | | npm run build |
|---|
| | | ``` |
|---|
| | | |
|---|
| | | ### Run your unit tests |
|---|
| | | ``` |
|---|
| | | npm run test:unit |
|---|
| | | ``` |
|---|
| | | |
|---|
| | | ### Lints and fixes files |
|---|
| | | ``` |
|---|
| | | npm run lint |
|---|
| | | ``` |
|---|
| | | |
|---|
| | | ### Customize configuration |
|---|
| | | See [Configuration Reference](https://cli.vuejs.org/config/). |
|---|
| | | |
|---|
| | | |
|---|
| | | ### npm run serveå¯å¨å¼å¸¸ï¼ |
|---|
| | | 使ç¨cmdè¾å
¥node -væ¥ççæ¬ï¼å¦ææ¯18.+çæ¬,请å°package.jsonä¸ç¬¬äºè¡scriptsä¸çå
容æ¿æ¢ä¸ºï¼ |
|---|
| | | |
|---|
| | | "scripts": { |
|---|
| | | "serve": " SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve", |
|---|
| | | "build": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service build", |
|---|
| | | "test:unit": "vue-cli-service test:unit", |
|---|
| | | "lint": "vue-cli-service lint" |
|---|
| | | } |
|---|
| | | |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | module.exports = { |
|---|
| | | presets: [ |
|---|
| | | '@vue/cli-plugin-babel/preset' |
|---|
| | | ] |
|---|
| | | } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | |
|---|
| | | let buttons = [{ |
|---|
| | | name: "æ¥ è¯¢", |
|---|
| | | value: 'Search', |
|---|
| | | icon: 'el-icon-search', |
|---|
| | | class: '', |
|---|
| | | type: 'primary', |
|---|
| | | onClick: function () { |
|---|
| | | this.search(); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | name: "æ° å»º", |
|---|
| | | icon: 'el-icon-plus', |
|---|
| | | value: 'Add', |
|---|
| | | class: '', |
|---|
| | | // plain:true, |
|---|
| | | type: 'success', |
|---|
| | | // plain:true, |
|---|
| | | onClick: function () { |
|---|
| | | this.add(); |
|---|
| | | } |
|---|
| | | }, { |
|---|
| | | name: "ç¼ è¾", |
|---|
| | | icon: 'el-icon-edit', |
|---|
| | | value: 'Update', |
|---|
| | | // plain:true, |
|---|
| | | class: '', |
|---|
| | | type: 'primary', |
|---|
| | | onClick: function () { |
|---|
| | | this.edit(); |
|---|
| | | } |
|---|
| | | }, { |
|---|
| | | name: "å é¤", |
|---|
| | | icon: 'el-icon-delete', |
|---|
| | | class: '', |
|---|
| | | value: 'Delete', |
|---|
| | | type: 'danger', |
|---|
| | | onClick: function () { |
|---|
| | | this.del(); |
|---|
| | | } |
|---|
| | | }, { |
|---|
| | | name: "审 æ ¸", |
|---|
| | | icon: 'el-icon-check', |
|---|
| | | class: '', |
|---|
| | | value: 'Audit', |
|---|
| | | plain: true, |
|---|
| | | type: 'primary', |
|---|
| | | onClick: function () { |
|---|
| | | this.audit(); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | name: "导 å
¥", |
|---|
| | | icon: 'el-icon-bottom', |
|---|
| | | class: '', |
|---|
| | | type: 'success', |
|---|
| | | plain: true, |
|---|
| | | value: 'Import', |
|---|
| | | onClick: function () { |
|---|
| | | this.import(); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | name: "导 åº", |
|---|
| | | icon: 'el-icon-top', |
|---|
| | | type: 'success', |
|---|
| | | plain: true, |
|---|
| | | value: 'Export', |
|---|
| | | onClick: function () { |
|---|
| | | this.export(); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | name: "ä¸ä¼ ", |
|---|
| | | icon: 'el-icon-top', |
|---|
| | | type: 'success', |
|---|
| | | plain: true, |
|---|
| | | value: 'Upload', |
|---|
| | | onClick: function () { |
|---|
| | | this.Upload(); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | // , { |
|---|
| | | // name: "æ°æ®ç»æ", |
|---|
| | | // icon: 'ios-cog', |
|---|
| | | // class: '', |
|---|
| | | // value: '', |
|---|
| | | // onClick: function () { |
|---|
| | | // this.openViewColumns(); |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | ] |
|---|
| | | |
|---|
| | | export default buttons |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | { |
|---|
| | | "name": "WIDESEA.vue3", |
|---|
| | | "version": "0.1.0", |
|---|
| | | "private": true, |
|---|
| | | "scripts": { |
|---|
| | | "serve": "vue-cli-service serve", |
|---|
| | | "build": "vue-cli-service build", |
|---|
| | | "test:unit": "vue-cli-service test:unit", |
|---|
| | | "lint": "vue-cli-service lint" |
|---|
| | | }, |
|---|
| | | "dependencies": { |
|---|
| | | "@element-plus/icons-vue": "^2.1.0", |
|---|
| | | "@microsoft/signalr": "^6.0.4", |
|---|
| | | "ali-oss": "^6.17.1", |
|---|
| | | "axios": "^0.21.1", |
|---|
| | | "core-js": "^3.6.5", |
|---|
| | | "echarts": "^5.0.2", |
|---|
| | | "element-plus": "^2.2.14", |
|---|
| | | "less": "^4.1.1", |
|---|
| | | "vue": "^3.2.37", |
|---|
| | | "vue-draggable-next": "^2.0.1", |
|---|
| | | "vue-router": "^4.0.0-0", |
|---|
| | | "vuex": "^4.0.0-0", |
|---|
| | | "wangeditor": "^4.7.6" |
|---|
| | | }, |
|---|
| | | "devDependencies": { |
|---|
| | | "@babel/plugin-syntax-dynamic-import": "^7.8.3", |
|---|
| | | "@vue/cli-plugin-babel": "~4.5.0", |
|---|
| | | "@vue/cli-plugin-eslint": "~4.5.0", |
|---|
| | | "@vue/cli-plugin-router": "~4.5.0", |
|---|
| | | "@vue/cli-plugin-unit-mocha": "~4.5.0", |
|---|
| | | "@vue/cli-plugin-vuex": "~4.5.0", |
|---|
| | | "@vue/cli-service": "~4.5.0", |
|---|
| | | "@vue/compiler-sfc": "^3.0.0", |
|---|
| | | "@vue/test-utils": "^2.0.0-0", |
|---|
| | | "babel-eslint": "^10.1.0", |
|---|
| | | "chai": "^4.1.2", |
|---|
| | | "cross-env": "^7.0.3", |
|---|
| | | "less": "^4.1.1", |
|---|
| | | "less-loader": "^7.3.0", |
|---|
| | | "stylus": "^0.54.7", |
|---|
| | | "stylus-loader": "^3.0.2" |
|---|
| | | }, |
|---|
| | | "eslintConfig": { |
|---|
| | | "root": true, |
|---|
| | | "env": { |
|---|
| | | "node": true |
|---|
| | | }, |
|---|
| | | "extends": [ |
|---|
| | | "plugin:vue/essential", |
|---|
| | | "@vue/standard" |
|---|
| | | ], |
|---|
| | | "rules": { |
|---|
| | | "indent": [ |
|---|
| | | 1, |
|---|
| | | 4 |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | "parserOptions": { |
|---|
| | | "parser": "babel-eslint" |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | "eslintIgnore": [ |
|---|
| | | "*" |
|---|
| | | ] |
|---|
| | | } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <!DOCTYPE html> |
|---|
| | | <html lang=""> |
|---|
| | | |
|---|
| | | <head> |
|---|
| | | <meta charset="utf-8"> |
|---|
| | | <meta http-equiv="X-UA-Compatible" content="IE=edge"> |
|---|
| | | <meta name="viewport" content="width=device-width,initial-scale=1.0"> |
|---|
| | | <meta name="keywords" content=".netccore,dotnet core,vue,element,element plus,vue3" /> |
|---|
| | | <meta name="description" content="" /> |
|---|
| | | <link rel="icon" href="<%= BASE_URL %>wms_d.png"> |
|---|
| | | <title><%= htmlWebpackPlugin.options.title %></title> |
|---|
| | | </head> |
|---|
| | | |
|---|
| | | <body> |
|---|
| | | <noscript> |
|---|
| | | <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. |
|---|
| | | Please enable it to continue.</strong> |
|---|
| | | </noscript> |
|---|
| | | <div id="app"></div> |
|---|
| | | <!-- built files will be auto injected --> |
|---|
| | | </body> |
|---|
| | | |
|---|
| | | </html> |
|---|
| | | <style> |
|---|
| | | html, |
|---|
| | | body { |
|---|
| | | margin: 0; |
|---|
| | | padding: 0; |
|---|
| | | height: 100%; |
|---|
| | | width: 100%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | * { |
|---|
| | | box-sizing: border-box; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-loading { |
|---|
| | | z-index: 999999; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-table th { |
|---|
| | | display: table-cell !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-loading .el-loading-spinner { |
|---|
| | | padding: 7px; |
|---|
| | | background: #ececec; |
|---|
| | | width: 200px; |
|---|
| | | color: red; |
|---|
| | | left: 0; |
|---|
| | | right: 0; |
|---|
| | | margin: 0 auto; |
|---|
| | | border-radius: 5px; |
|---|
| | | border: 1px solid #a0a0a0; |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | h1, |
|---|
| | | h2, |
|---|
| | | h3, |
|---|
| | | h4 { |
|---|
| | | margin: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .v-dialog { |
|---|
| | | border-radius: 5px; |
|---|
| | | top: 50%; |
|---|
| | | /* margin-top: -220px !important; */ |
|---|
| | | } |
|---|
| | | |
|---|
| | | .v-dialog .el-dialog__header { |
|---|
| | | border-top-left-radius: 4px; |
|---|
| | | border-top-right-radius: 4px; |
|---|
| | | padding: 0px 13px; |
|---|
| | | line-height: 53px; |
|---|
| | | border-bottom: 1px solid #e2e2e2; |
|---|
| | | height: 50px; |
|---|
| | | color: white; |
|---|
| | | font-weight: bold; |
|---|
| | | font-size: 14px; |
|---|
| | | background-image: linear-gradient(135deg, #0cd7bd 10%, #50c3f7); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .v-dialog .el-dialog__header .el-dialog__headerbtn { |
|---|
| | | top: 3px; |
|---|
| | | right: 0px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .v-dialog .el-dialog__header .el-dialog__headerbtn .el-dialog__close { |
|---|
| | | font-size: 19px; |
|---|
| | | color: white; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .v-dialog .el-dialog__body { |
|---|
| | | padding: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-message { |
|---|
| | | z-index: 3500 !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .v-date-range .el-input__inner { |
|---|
| | | padding: 0 15px 0 8px |
|---|
| | | } |
|---|
| | | |
|---|
| | | .v-date-range .el-input__suffix .el-input__icon { |
|---|
| | | display: table-caption; |
|---|
| | | background: white; |
|---|
| | | margin: 1px; |
|---|
| | | height: auto; |
|---|
| | | margin-right: -4px; |
|---|
| | | height: 33px; |
|---|
| | | width: 19px; |
|---|
| | | font-size: 13px; |
|---|
| | | border-top-right-radius: 3px; |
|---|
| | | border-bottom-right-radius: 3px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .v-date-range .el-icon-circle-check { |
|---|
| | | display: none !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .v-dialog .el-dialog__header { |
|---|
| | | margin-right: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-button { |
|---|
| | | font-size: 12px !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-button--small { |
|---|
| | | padding: 0px 15px !important; |
|---|
| | | height: 32px; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div id="nav"></div> |
|---|
| | | <el-config-provider :locale="locale"> |
|---|
| | | <router-view /> |
|---|
| | | </el-config-provider> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import { ElConfigProvider } from "element-plus"; |
|---|
| | | import zhCn from "element-plus/lib/locale/lang/zh-cn"; |
|---|
| | | export default { |
|---|
| | | name: "vol_app", |
|---|
| | | components: { |
|---|
| | | [ElConfigProvider.name]: ElConfigProvider, //æ·»å ç»ä»¶ |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | locale: zhCn, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | <style lang="stylus"> |
|---|
| | | #app { |
|---|
| | | font-family: Avenir, Helvetica, Arial, sans-serif; |
|---|
| | | -webkit-font-smoothing: antialiased; |
|---|
| | | -moz-osx-font-smoothing: grayscale; |
|---|
| | | height: 100%; |
|---|
| | | width: 100%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-alert--error.is-light { |
|---|
| | | border: 1px solid #ffe0e0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-alert--error.is-light { |
|---|
| | | color: #f74444 !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-alert--warning.is-light { |
|---|
| | | border: 1px solid #ffe6c1; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-alert--info.is-light { |
|---|
| | | border: 1px solid #e6e5e5; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-alert--info .el-alert__description { |
|---|
| | | color: #6b6b6b !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-alert--warning.is-light { |
|---|
| | | background-color: #fdf6ec; |
|---|
| | | color: #d68409 !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-alert--success.is-light { |
|---|
| | | border: 1px solid #cdf7b8; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-alert--success.is-light .el-alert__description { |
|---|
| | | color: #3baf02 !important; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | import axios from 'axios' |
|---|
| | | import store from '../store/index' |
|---|
| | | // import {getCurrentInstance} from 'vue' |
|---|
| | | import { useRouter, useRoute } from 'vue-router' |
|---|
| | | const router = useRouter(); |
|---|
| | | axios.defaults.timeout = 50000; |
|---|
| | | axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8'; |
|---|
| | | |
|---|
| | | import { ElLoading as Loading, ElMessage as Message } from 'element-plus'; |
|---|
| | | |
|---|
| | | |
|---|
| | | let loadingInstance; |
|---|
| | | let loadingStatus = false; |
|---|
| | | if (process.env.NODE_ENV == 'development') { |
|---|
| | | axios.defaults.baseURL = 'http://127.0.0.1:8098/'; |
|---|
| | | } |
|---|
| | | else if (process.env.NODE_ENV == 'debug') { |
|---|
| | | axios.defaults.baseURL = 'http://127.0.0.1:8098/'; |
|---|
| | | } |
|---|
| | | |
|---|
| | | else if (process.env.NODE_ENV == 'production') { |
|---|
| | | axios.defaults.baseURL = 'http://127.0.0.1:8098/'; |
|---|
| | | } |
|---|
| | | if (!axios.defaults.baseURL.endsWith('/')) { |
|---|
| | | axios.defaults.baseURL+="/"; |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | let ipAddress = axios.defaults.baseURL; |
|---|
| | | axios.interceptors.request.use((config) => { |
|---|
| | | return config; |
|---|
| | | }, (error) => { |
|---|
| | | return Promise.reject(error); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | axios.interceptors.response.use((res) => { |
|---|
| | | |
|---|
| | | closeLoading(); |
|---|
| | | |
|---|
| | | checkResponse(res); |
|---|
| | | |
|---|
| | | return Promise.resolve(res); |
|---|
| | | }, (error) => { |
|---|
| | | closeLoading(); |
|---|
| | | let httpMessage = ''; |
|---|
| | | if (error.response) { |
|---|
| | | if (error.response.status == '401') { |
|---|
| | | if (error.response.data && error.response.data.code == 401) { |
|---|
| | | if (!localStorage.getItem('user')) { |
|---|
| | | Message.error({ |
|---|
| | | showClose: true, |
|---|
| | | message: 'ç»éå·²è¿æ', |
|---|
| | | type: 'error' |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | toLogin(); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | if (error.response.status == '404') { |
|---|
| | | httpMessage = "æªæ¾å°è¯·æ±å°å"; |
|---|
| | | } |
|---|
| | | else if (error.response.data && error.response.data.message) { |
|---|
| | | httpMessage = error.response.data.message; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | else { |
|---|
| | | httpMessage = 'æå¡å¨å¤çå¼å¸¸' |
|---|
| | | } |
|---|
| | | redirect(httpMessage); |
|---|
| | | return Promise.reject(error.response || {}, httpMessage); |
|---|
| | | }); |
|---|
| | | function closeLoading () { |
|---|
| | | if (loadingInstance) { |
|---|
| | | loadingInstance.close(); |
|---|
| | | } |
|---|
| | | if (loadingStatus) { |
|---|
| | | loadingStatus = false; |
|---|
| | | if (loadingInstance) { |
|---|
| | | loadingInstance.close(); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | function checkResponse (res) { |
|---|
| | | //å·æ°token |
|---|
| | | if (!res.headers) { |
|---|
| | | if (res.getResponseHeader("vol_exp") == "1") { |
|---|
| | | replaceToken(); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | else if (res.headers.vol_exp == "1") { |
|---|
| | | replaceToken(); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | const _Authorization = 'Authorization'; |
|---|
| | | |
|---|
| | | function showLoading (loading) { |
|---|
| | | if (!loading || loadingStatus) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | loadingInstance = Loading.service({ |
|---|
| | | lock: true, |
|---|
| | | text: 'Loading', |
|---|
| | | customClass:"http-loading", |
|---|
| | | background: typeof loading == "string" ? loading : 'æ£å¨å¤ç.....', |
|---|
| | | background: 'rgba(58, 61, 63, 0.32)' |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | |
|---|
| | | function getToken () { |
|---|
| | | return store.getters.getToken(); |
|---|
| | | } |
|---|
| | | |
|---|
| | | /* |
|---|
| | | url |
|---|
| | | params请æ±åå°çåæ°,å¦ï¼{name:123,values:['a','b','c']} |
|---|
| | | loadingæ¯å¦æ¾ç¤ºé®ç½©å±,å¯ä»¥ä¼ å
¥true.false.åæ示ææ¬ |
|---|
| | | configé
置信æ¯,å¦{timeout:3000,headers:{token:123}} |
|---|
| | | */ |
|---|
| | | function post (url, params, loading, config) { |
|---|
| | | showLoading(loading); |
|---|
| | | axios.defaults.headers[_Authorization] = getToken(); |
|---|
| | | return new Promise((resolve, reject) => { |
|---|
| | | axios.post(url, params, config) |
|---|
| | | .then(response => { |
|---|
| | | resolve(response.data); |
|---|
| | | }, err => { |
|---|
| | | reject(err && err.data && err.data.message ? err.data.message : 'æå¡å¨å¤çå¼å¸¸'); |
|---|
| | | }) |
|---|
| | | .catch((error) => { |
|---|
| | | reject(error) |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | |
|---|
| | | //=trueå¼æ¥è¯·æ±æ¶ä¼æ¾ç¤ºé®ç½©å±,=å符串ï¼å¼æ¥è¯·æ±æ¶é®ç½©å±æ¾ç¤ºå½åå符串 |
|---|
| | | function get (url, param, loading, config) { |
|---|
| | | showLoading(loading); |
|---|
| | | axios.defaults.headers[_Authorization] = getToken(); |
|---|
| | | return new Promise((resolve, reject) => { |
|---|
| | | axios.get(url, config) |
|---|
| | | .then(response => { |
|---|
| | | resolve(response.data) |
|---|
| | | }, err => { |
|---|
| | | reject(err) |
|---|
| | | }) |
|---|
| | | .catch((error) => { |
|---|
| | | reject(error) |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | |
|---|
| | | //url:urlå°å |
|---|
| | | //params:请æ±åæ° |
|---|
| | | //fileName:ä¸è½½çæ件å |
|---|
| | | //loading:æ¯å¦æ¾ç¤ºå è½½ç¶æ |
|---|
| | | function download (url, params, fileName, loading,callback) { |
|---|
| | | fileName = fileName.replace(">", "ï¼").replace("<", "ï¼"); |
|---|
| | | post(url, params, loading, { responseType: 'blob' }).then(content => { |
|---|
| | | const blob = new Blob([content]) |
|---|
| | | if ('download' in document.createElement('a')) { // éIEä¸è½½ |
|---|
| | | const elink = document.createElement('a') |
|---|
| | | elink.download = fileName |
|---|
| | | elink.style.display = 'none' |
|---|
| | | elink.href = URL.createObjectURL(blob) |
|---|
| | | document.body.appendChild(elink) |
|---|
| | | elink.click() |
|---|
| | | URL.revokeObjectURL(elink.href) // éæ¾URL 对象 |
|---|
| | | document.body.removeChild(elink) |
|---|
| | | } else { // IE10+ä¸è½½ |
|---|
| | | navigator.msSaveBlob(blob, fileName) |
|---|
| | | } |
|---|
| | | callback&&callback(); |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | function createXHR () { |
|---|
| | | if (XMLHttpRequest) { |
|---|
| | | return new XMLHttpRequest(); |
|---|
| | | } |
|---|
| | | if (ActiveXObject) { |
|---|
| | | if (typeof arguments.callee.activeXString != "string") { |
|---|
| | | var versions = [ |
|---|
| | | "MSXML2.XMLHttp.6.0", |
|---|
| | | "MSXML2.XMLHttp", |
|---|
| | | "MSXML2.XMLHttp.3.0" |
|---|
| | | ]; |
|---|
| | | for (var i = 0; i < versions.length; i++) { |
|---|
| | | try { |
|---|
| | | new ActiveXObject(versions[i]); |
|---|
| | | arguments.callee.activeXString = versions[i]; |
|---|
| | | break; |
|---|
| | | } catch (e) { |
|---|
| | | console.log(e); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | return new ActiveXObject(arguments.callee.activeXString); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | function redirect (responseText, message) { |
|---|
| | | try { |
|---|
| | | let responseData = typeof responseText == 'string' ? JSON.parse(responseText) : responseText; |
|---|
| | | if ((responseData.hasOwnProperty('code') && responseData.code == 401) |
|---|
| | | || (responseData.data && responseData.data.code == 401)) { |
|---|
| | | closeLoading(); |
|---|
| | | toLogin(); |
|---|
| | | } else { |
|---|
| | | if (message) { |
|---|
| | | Message.error({ |
|---|
| | | showClose: true, |
|---|
| | | message: message, |
|---|
| | | type: 'error' |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } catch (error) { |
|---|
| | | console.log(error); |
|---|
| | | Message.error({ |
|---|
| | | showClose: true, |
|---|
| | | message: responseText, |
|---|
| | | type: 'error' |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | function toLogin () { |
|---|
| | | // const vueinstance= getCurrentInstance(); |
|---|
| | | if (window.location.hash) { |
|---|
| | | window.location.href = window.location.origin + '/#/login' |
|---|
| | | return |
|---|
| | | } |
|---|
| | | window.location.href = window.location.origin + '/login' |
|---|
| | | // router.push({ path: '/login', params: { r: Math.random() } }); |
|---|
| | | } |
|---|
| | | //å¨æå·æ°token |
|---|
| | | function replaceToken () { |
|---|
| | | ajax({ |
|---|
| | | url: "/api/User/replaceToken", |
|---|
| | | param: {}, |
|---|
| | | json: true, |
|---|
| | | success: function (x) { |
|---|
| | | if (x.status) { |
|---|
| | | let userInfo = store.getters.getUserInfo(); |
|---|
| | | userInfo.token = x.data; |
|---|
| | | store.commit('setUserInfo', userInfo); |
|---|
| | | } else { |
|---|
| | | console.log(x.message); |
|---|
| | | toLogin(); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | errror: function (ex) { |
|---|
| | | console.log(ex); |
|---|
| | | toLogin(); |
|---|
| | | }, |
|---|
| | | type: "post", |
|---|
| | | async: false |
|---|
| | | }); |
|---|
| | | |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | function ajax (param) { |
|---|
| | | let httpParam = |
|---|
| | | Object.assign({ |
|---|
| | | url: '', headers: {}, |
|---|
| | | param: {}, json: true, |
|---|
| | | success: function () { }, |
|---|
| | | errror: function () { }, |
|---|
| | | type: 'post', async: true |
|---|
| | | }, param); |
|---|
| | | |
|---|
| | | httpParam.url = axios.defaults.baseURL + httpParam.url.replace(/\/?/, ''); |
|---|
| | | httpParam.headers[_Authorization] = getToken(); |
|---|
| | | var xhr = createXHR(); |
|---|
| | | xhr.onreadystatechange = function () { |
|---|
| | | if (xhr.status == 403 || xhr.status == 401) { |
|---|
| | | redirect(xhr.responseText); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | checkResponse(xhr); |
|---|
| | | if (xhr.readyState == 4 && xhr.status == 200) { |
|---|
| | | httpParam.success(httpParam.json ? JSON.parse(xhr.responseText) : xhr.responseText); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | if (xhr.status != 0 && xhr.readyState != 1) { |
|---|
| | | httpParam.errror(xhr); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | //åå§åè¯·æ± |
|---|
| | | xhr.open( |
|---|
| | | httpParam.type, |
|---|
| | | httpParam.url, |
|---|
| | | httpParam.async |
|---|
| | | ); |
|---|
| | | xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); |
|---|
| | | for (const key in httpParam.headers) { |
|---|
| | | xhr.setRequestHeader(key, httpParam.headers[key]); |
|---|
| | | } |
|---|
| | | let dataStr = ''; |
|---|
| | | for (const key in httpParam.param) { |
|---|
| | | dataStr += key + "=" + httpParam.param[key]; |
|---|
| | | } |
|---|
| | | try { |
|---|
| | | xhr.send(dataStr); |
|---|
| | | } catch (error) { |
|---|
| | | toLogin(); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | ajax.post = function (url, param, success, errror) { |
|---|
| | | ajax({ url: url, param: param, success: success, error: errror, type: 'post' }) |
|---|
| | | } |
|---|
| | | ajax.get = function (url, param, success, errror) { |
|---|
| | | ajax({ url: url, param: param, success: success, error: errror, type: 'get' }) |
|---|
| | | } |
|---|
| | | export default { post, get,download, ajax, ipAddress } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | |
|---|
| | | import http from '@/../src/api/http.js' |
|---|
| | | import buttons from '@/../config/buttons.js' |
|---|
| | | import store from '../store/index' |
|---|
| | | import { useRouter } from 'vue-router' |
|---|
| | | let permission = { |
|---|
| | | getMenu() { |
|---|
| | | return http.get("/api/getTreeMenu"); |
|---|
| | | }, getButtons(path, extra, table, tableName) {//extraèªå®é¢å¤æé® |
|---|
| | | //extraèªå®é¢å¤æé® |
|---|
| | | //tableè·åæå®è¡¨çæé |
|---|
| | | if (table) { |
|---|
| | | table = '/' + table; |
|---|
| | | } |
|---|
| | | let permission = store.getters.getPermission(table || path); |
|---|
| | | if (!permission) { |
|---|
| | | permission = store.getters.getPermission(path.substring(1)); |
|---|
| | | if (!permission) { |
|---|
| | | if ((tableName || '').indexOf('/') != -1) { |
|---|
| | | let arr = tableName.split('/'); |
|---|
| | | tableName = arr[arr.length - 1]; |
|---|
| | | } |
|---|
| | | permission = store.getters.getPermission('/' + tableName); |
|---|
| | | if (!permission) { |
|---|
| | | permission = (store.state.permission||[]).find(x => x.tableName ==tableName); |
|---|
| | | if (!permission) { |
|---|
| | | to401(); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | let permissions = permission.permission; //.split(','); |
|---|
| | | let gridButtons = buttons.filter((item) => { |
|---|
| | | return !item.value || permissions.indexOf(item.value) != -1; |
|---|
| | | }); |
|---|
| | | if (extra && extra instanceof Array) { |
|---|
| | | gridButtons.push(...extra); |
|---|
| | | } |
|---|
| | | return gridButtons; |
|---|
| | | }, to401() { |
|---|
| | | to401(); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | function to401() { |
|---|
| | | const router = useRouter(); |
|---|
| | | router.push({ |
|---|
| | | path: '/401' |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | |
|---|
| | | export default permission; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | const tipxx = { |
|---|
| | | install: function (vue) { |
|---|
| | | alert(1); |
|---|
| | | vue.prototype.$tip = function () { |
|---|
| | | alert('æµè¯use') |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | export default { tipxx } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | *{ |
|---|
| | | box-sizing:border-box; |
|---|
| | | -moz-box-sizing:border-box; /* Firefox */ |
|---|
| | | -webkit-box-sizing:border-box; /* Safari */ |
|---|
| | | } |
|---|
| | | .el-pager li{ |
|---|
| | | font-weight: 100; |
|---|
| | | margin-right: 9px; |
|---|
| | | border: 1px solid #eee; |
|---|
| | | border-radius: 3px; |
|---|
| | | min-width: 28px; |
|---|
| | | } |
|---|
| | | .el-pager li.active,.el-pager li:hover{ |
|---|
| | | background: #ed4014; |
|---|
| | | color: white; |
|---|
| | | } |
|---|
| | | .el-pagination__editor.el-input .el-input__inner{ |
|---|
| | | height: 23px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | .animated { |
|---|
| | | -webkit-animation-duration: 0.5s; |
|---|
| | | animation-duration: 0.5s; |
|---|
| | | -webkit-animation-fill-mode: both; |
|---|
| | | animation-fill-mode: both; |
|---|
| | | } |
|---|
| | | |
|---|
| | | @media (print), (prefers-reduced-motion) { |
|---|
| | | .animated { |
|---|
| | | -webkit-animation: unset !important; |
|---|
| | | animation: unset !important; |
|---|
| | | -webkit-transition: none !important; |
|---|
| | | transition: none !important; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | @-webkit-keyframes fadeInDown { |
|---|
| | | from { |
|---|
| | | opacity: 1; |
|---|
| | | -webkit-transform: translate3d(0, -100%, 0); |
|---|
| | | transform: translate3d(0, -100%, 0); |
|---|
| | | } |
|---|
| | | |
|---|
| | | to { |
|---|
| | | opacity: 1; |
|---|
| | | -webkit-transform: translate3d(0, 0, 0); |
|---|
| | | transform: translate3d(0, 0, 0); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | @keyframes fadeInDown { |
|---|
| | | from { |
|---|
| | | opacity: 0; |
|---|
| | | -webkit-transform: translate3d(0, -100%, 0); |
|---|
| | | transform: translate3d(0, -100%, 0); |
|---|
| | | } |
|---|
| | | |
|---|
| | | to { |
|---|
| | | opacity: 1; |
|---|
| | | -webkit-transform: translate3d(0, 0, 0); |
|---|
| | | transform: translate3d(0, 0, 0); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .fadeInDown { |
|---|
| | | -webkit-animation-name: fadeInDown; |
|---|
| | | animation-name: fadeInDown; |
|---|
| | | } |
|---|
| | | .ivu-message{ |
|---|
| | | z-index: 999999999 !important; |
|---|
| | | } |
|---|
| | | .ivu-form-item-content{ |
|---|
| | | text-align: left; |
|---|
| | | } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | @font-face{font-family:element-icons;src:url(fonts/element-icons.woff) format("woff"),url(fonts/element-icons.ttf) format("truetype");font-weight:400;font-display:"auto";font-style:normal}[class*=" el-icon-"],[class^=el-icon-]{font-family:element-icons!important;speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;vertical-align:baseline;display:inline-block;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.el-icon-ice-cream-round:before{content:"\e6a0"}.el-icon-ice-cream-square:before{content:"\e6a3"}.el-icon-lollipop:before{content:"\e6a4"}.el-icon-potato-strips:before{content:"\e6a5"}.el-icon-milk-tea:before{content:"\e6a6"}.el-icon-ice-drink:before{content:"\e6a7"}.el-icon-ice-tea:before{content:"\e6a9"}.el-icon-coffee:before{content:"\e6aa"}.el-icon-orange:before{content:"\e6ab"}.el-icon-pear:before{content:"\e6ac"}.el-icon-apple:before{content:"\e6ad"}.el-icon-cherry:before{content:"\e6ae"}.el-icon-watermelon:before{content:"\e6af"}.el-icon-grape:before{content:"\e6b0"}.el-icon-refrigerator:before{content:"\e6b1"}.el-icon-goblet-square-full:before{content:"\e6b2"}.el-icon-goblet-square:before{content:"\e6b3"}.el-icon-goblet-full:before{content:"\e6b4"}.el-icon-goblet:before{content:"\e6b5"}.el-icon-cold-drink:before{content:"\e6b6"}.el-icon-coffee-cup:before{content:"\e6b8"}.el-icon-water-cup:before{content:"\e6b9"}.el-icon-hot-water:before{content:"\e6ba"}.el-icon-ice-cream:before{content:"\e6bb"}.el-icon-dessert:before{content:"\e6bc"}.el-icon-sugar:before{content:"\e6bd"}.el-icon-tableware:before{content:"\e6be"}.el-icon-burger:before{content:"\e6bf"}.el-icon-knife-fork:before{content:"\e6c1"}.el-icon-fork-spoon:before{content:"\e6c2"}.el-icon-chicken:before{content:"\e6c3"}.el-icon-food:before{content:"\e6c4"}.el-icon-dish-1:before{content:"\e6c5"}.el-icon-dish:before{content:"\e6c6"}.el-icon-moon-night:before{content:"\e6ee"}.el-icon-moon:before{content:"\e6f0"}.el-icon-cloudy-and-sunny:before{content:"\e6f1"}.el-icon-partly-cloudy:before{content:"\e6f2"}.el-icon-cloudy:before{content:"\e6f3"}.el-icon-sunny:before{content:"\e6f6"}.el-icon-sunset:before{content:"\e6f7"}.el-icon-sunrise-1:before{content:"\e6f8"}.el-icon-sunrise:before{content:"\e6f9"}.el-icon-heavy-rain:before{content:"\e6fa"}.el-icon-lightning:before{content:"\e6fb"}.el-icon-light-rain:before{content:"\e6fc"}.el-icon-wind-power:before{content:"\e6fd"}.el-icon-baseball:before{content:"\e712"}.el-icon-soccer:before{content:"\e713"}.el-icon-football:before{content:"\e715"}.el-icon-basketball:before{content:"\e716"}.el-icon-ship:before{content:"\e73f"}.el-icon-truck:before{content:"\e740"}.el-icon-bicycle:before{content:"\e741"}.el-icon-mobile-phone:before{content:"\e6d3"}.el-icon-service:before{content:"\e6d4"}.el-icon-key:before{content:"\e6e2"}.el-icon-unlock:before{content:"\e6e4"}.el-icon-lock:before{content:"\e6e5"}.el-icon-watch:before{content:"\e6fe"}.el-icon-watch-1:before{content:"\e6ff"}.el-icon-timer:before{content:"\e702"}.el-icon-alarm-clock:before{content:"\e703"}.el-icon-map-location:before{content:"\e704"}.el-icon-delete-location:before{content:"\e705"}.el-icon-add-location:before{content:"\e706"}.el-icon-location-information:before{content:"\e707"}.el-icon-location-outline:before{content:"\e708"}.el-icon-location:before{content:"\e79e"}.el-icon-place:before{content:"\e709"}.el-icon-discover:before{content:"\e70a"}.el-icon-first-aid-kit:before{content:"\e70b"}.el-icon-trophy-1:before{content:"\e70c"}.el-icon-trophy:before{content:"\e70d"}.el-icon-medal:before{content:"\e70e"}.el-icon-medal-1:before{content:"\e70f"}.el-icon-stopwatch:before{content:"\e710"}.el-icon-mic:before{content:"\e711"}.el-icon-copy-document:before{content:"\e718"}.el-icon-full-screen:before{content:"\e719"}.el-icon-switch-button:before{content:"\e71b"}.el-icon-aim:before{content:"\e71c"}.el-icon-crop:before{content:"\e71d"}.el-icon-odometer:before{content:"\e71e"}.el-icon-time:before{content:"\e71f"}.el-icon-bangzhu:before{content:"\e724"}.el-icon-close-notification:before{content:"\e726"}.el-icon-microphone:before{content:"\e727"}.el-icon-turn-off-microphone:before{content:"\e728"}.el-icon-position:before{content:"\e729"}.el-icon-postcard:before{content:"\e72a"}.el-icon-message:before{content:"\e72b"}.el-icon-chat-line-square:before{content:"\e72d"}.el-icon-chat-dot-square:before{content:"\e72e"}.el-icon-chat-dot-round:before{content:"\e72f"}.el-icon-chat-square:before{content:"\e730"}.el-icon-chat-line-round:before{content:"\e731"}.el-icon-chat-round:before{content:"\e732"}.el-icon-set-up:before{content:"\e733"}.el-icon-turn-off:before{content:"\e734"}.el-icon-open:before{content:"\e735"}.el-icon-connection:before{content:"\e736"}.el-icon-link:before{content:"\e737"}.el-icon-cpu:before{content:"\e738"}.el-icon-thumb:before{content:"\e739"}.el-icon-female:before{content:"\e73a"}.el-icon-male:before{content:"\e73b"}.el-icon-guide:before{content:"\e73c"}.el-icon-news:before{content:"\e73e"}.el-icon-price-tag:before{content:"\e744"}.el-icon-discount:before{content:"\e745"}.el-icon-wallet:before{content:"\e747"}.el-icon-coin:before{content:"\e748"}.el-icon-money:before{content:"\e749"}.el-icon-bank-card:before{content:"\e74a"}.el-icon-box:before{content:"\e74b"}.el-icon-present:before{content:"\e74c"}.el-icon-sell:before{content:"\e6d5"}.el-icon-sold-out:before{content:"\e6d6"}.el-icon-shopping-bag-2:before{content:"\e74d"}.el-icon-shopping-bag-1:before{content:"\e74e"}.el-icon-shopping-cart-2:before{content:"\e74f"}.el-icon-shopping-cart-1:before{content:"\e750"}.el-icon-shopping-cart-full:before{content:"\e751"}.el-icon-smoking:before{content:"\e752"}.el-icon-no-smoking:before{content:"\e753"}.el-icon-house:before{content:"\e754"}.el-icon-table-lamp:before{content:"\e755"}.el-icon-school:before{content:"\e756"}.el-icon-office-building:before{content:"\e757"}.el-icon-toilet-paper:before{content:"\e758"}.el-icon-notebook-2:before{content:"\e759"}.el-icon-notebook-1:before{content:"\e75a"}.el-icon-files:before{content:"\e75b"}.el-icon-collection:before{content:"\e75c"}.el-icon-receiving:before{content:"\e75d"}.el-icon-suitcase-1:before{content:"\e760"}.el-icon-suitcase:before{content:"\e761"}.el-icon-film:before{content:"\e763"}.el-icon-collection-tag:before{content:"\e765"}.el-icon-data-analysis:before{content:"\e766"}.el-icon-pie-chart:before{content:"\e767"}.el-icon-data-board:before{content:"\e768"}.el-icon-data-line:before{content:"\e76d"}.el-icon-reading:before{content:"\e769"}.el-icon-magic-stick:before{content:"\e76a"}.el-icon-coordinate:before{content:"\e76b"}.el-icon-mouse:before{content:"\e76c"}.el-icon-brush:before{content:"\e76e"}.el-icon-headset:before{content:"\e76f"}.el-icon-umbrella:before{content:"\e770"}.el-icon-scissors:before{content:"\e771"}.el-icon-mobile:before{content:"\e773"}.el-icon-attract:before{content:"\e774"}.el-icon-monitor:before{content:"\e775"}.el-icon-search:before{content:"\e778"}.el-icon-takeaway-box:before{content:"\e77a"}.el-icon-paperclip:before{content:"\e77d"}.el-icon-printer:before{content:"\e77e"}.el-icon-document-add:before{content:"\e782"}.el-icon-document:before{content:"\e785"}.el-icon-document-checked:before{content:"\e786"}.el-icon-document-copy:before{content:"\e787"}.el-icon-document-delete:before{content:"\e788"}.el-icon-document-remove:before{content:"\e789"}.el-icon-tickets:before{content:"\e78b"}.el-icon-folder-checked:before{content:"\e77f"}.el-icon-folder-delete:before{content:"\e780"}.el-icon-folder-remove:before{content:"\e781"}.el-icon-folder-add:before{content:"\e783"}.el-icon-folder-opened:before{content:"\e784"}.el-icon-folder:before{content:"\e78a"}.el-icon-edit-outline:before{content:"\e764"}.el-icon-edit:before{content:"\e78c"}.el-icon-date:before{content:"\e78e"}.el-icon-c-scale-to-original:before{content:"\e7c6"}.el-icon-view:before{content:"\e6ce"}.el-icon-loading:before{content:"\e6cf"}.el-icon-rank:before{content:"\e6d1"}.el-icon-sort-down:before{content:"\e7c4"}.el-icon-sort-up:before{content:"\e7c5"}.el-icon-sort:before{content:"\e6d2"}.el-icon-finished:before{content:"\e6cd"}.el-icon-refresh-left:before{content:"\e6c7"}.el-icon-refresh-right:before{content:"\e6c8"}.el-icon-refresh:before{content:"\e6d0"}.el-icon-video-play:before{content:"\e7c0"}.el-icon-video-pause:before{content:"\e7c1"}.el-icon-d-arrow-right:before{content:"\e6dc"}.el-icon-d-arrow-left:before{content:"\e6dd"}.el-icon-arrow-up:before{content:"\e6e1"}.el-icon-arrow-down:before{content:"\e6df"}.el-icon-arrow-right:before{content:"\e6e0"}.el-icon-arrow-left:before{content:"\e6de"}.el-icon-top-right:before{content:"\e6e7"}.el-icon-top-left:before{content:"\e6e8"}.el-icon-top:before{content:"\e6e6"}.el-icon-bottom:before{content:"\e6eb"}.el-icon-right:before{content:"\e6e9"}.el-icon-back:before{content:"\e6ea"}.el-icon-bottom-right:before{content:"\e6ec"}.el-icon-bottom-left:before{content:"\e6ed"}.el-icon-caret-top:before{content:"\e78f"}.el-icon-caret-bottom:before{content:"\e790"}.el-icon-caret-right:before{content:"\e791"}.el-icon-caret-left:before{content:"\e792"}.el-icon-d-caret:before{content:"\e79a"}.el-icon-share:before{content:"\e793"}.el-icon-menu:before{content:"\e798"}.el-icon-s-grid:before{content:"\e7a6"}.el-icon-s-check:before{content:"\e7a7"}.el-icon-s-data:before{content:"\e7a8"}.el-icon-s-opportunity:before{content:"\e7aa"}.el-icon-s-custom:before{content:"\e7ab"}.el-icon-s-claim:before{content:"\e7ad"}.el-icon-s-finance:before{content:"\e7ae"}.el-icon-s-comment:before{content:"\e7af"}.el-icon-s-flag:before{content:"\e7b0"}.el-icon-s-marketing:before{content:"\e7b1"}.el-icon-s-shop:before{content:"\e7b4"}.el-icon-s-open:before{content:"\e7b5"}.el-icon-s-management:before{content:"\e7b6"}.el-icon-s-ticket:before{content:"\e7b7"}.el-icon-s-release:before{content:"\e7b8"}.el-icon-s-home:before{content:"\e7b9"}.el-icon-s-promotion:before{content:"\e7ba"}.el-icon-s-operation:before{content:"\e7bb"}.el-icon-s-unfold:before{content:"\e7bc"}.el-icon-s-fold:before{content:"\e7a9"}.el-icon-s-platform:before{content:"\e7bd"}.el-icon-s-order:before{content:"\e7be"}.el-icon-s-cooperation:before{content:"\e7bf"}.el-icon-bell:before{content:"\e725"}.el-icon-message-solid:before{content:"\e799"}.el-icon-video-camera:before{content:"\e772"}.el-icon-video-camera-solid:before{content:"\e796"}.el-icon-camera:before{content:"\e779"}.el-icon-camera-solid:before{content:"\e79b"}.el-icon-download:before{content:"\e77c"}.el-icon-upload2:before{content:"\e77b"}.el-icon-upload:before{content:"\e7c3"}.el-icon-picture-outline-round:before{content:"\e75f"}.el-icon-picture-outline:before{content:"\e75e"}.el-icon-picture:before{content:"\e79f"}.el-icon-close:before{content:"\e6db"}.el-icon-check:before{content:"\e6da"}.el-icon-plus:before{content:"\e6d9"}.el-icon-minus:before{content:"\e6d8"}.el-icon-help:before{content:"\e73d"}.el-icon-s-help:before{content:"\e7b3"}.el-icon-circle-close:before{content:"\e78d"}.el-icon-circle-check:before{content:"\e720"}.el-icon-circle-plus-outline:before{content:"\e723"}.el-icon-remove-outline:before{content:"\e722"}.el-icon-zoom-out:before{content:"\e776"}.el-icon-zoom-in:before{content:"\e777"}.el-icon-error:before{content:"\e79d"}.el-icon-success:before{content:"\e79c"}.el-icon-circle-plus:before{content:"\e7a0"}.el-icon-remove:before{content:"\e7a2"}.el-icon-info:before{content:"\e7a1"}.el-icon-question:before{content:"\e7a4"}.el-icon-warning-outline:before{content:"\e6c9"}.el-icon-warning:before{content:"\e7a3"}.el-icon-goods:before{content:"\e7c2"}.el-icon-s-goods:before{content:"\e7b2"}.el-icon-star-off:before{content:"\e717"}.el-icon-star-on:before{content:"\e797"}.el-icon-more-outline:before{content:"\e6cc"}.el-icon-more:before{content:"\e794"}.el-icon-phone-outline:before{content:"\e6cb"}.el-icon-phone:before{content:"\e795"}.el-icon-user:before{content:"\e6e3"}.el-icon-user-solid:before{content:"\e7a5"}.el-icon-setting:before{content:"\e6ca"}.el-icon-s-tools:before{content:"\e7ac"}.el-icon-delete:before{content:"\e6d7"}.el-icon-delete-solid:before{content:"\e7c9"}.el-icon-eleme:before{content:"\e7c7"}.el-icon-platform-eleme:before{content:"\e7ca"}.el-icon-loading{-webkit-animation:rotating 2s linear infinite;animation:rotating 2s linear infinite}.el-icon--right{margin-left:5px}.el-icon--left{margin-right:5px}@-webkit-keyframes rotating{0%{-webkit-transform:rotateZ(0);transform:rotateZ(0)}100%{-webkit-transform:rotateZ(360deg);transform:rotateZ(360deg)}}@keyframes rotating{0%{-webkit-transform:rotateZ(0);transform:rotateZ(0)}100%{-webkit-transform:rotateZ(360deg);transform:rotateZ(360deg)}} |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | var test1 = function () { alert(11) } |
|---|
| | | export { test1 } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | //对vueåæ°è¿è¡æ©å± |
|---|
| | | var extend = function (param) { |
|---|
| | | console.log(param) |
|---|
| | | } |
|---|
| | | export { extend } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | //对vueåæ°è¿è¡æ©å± |
|---|
| | | var extend = function ($vueParam) { |
|---|
| | | $vueParam.methods.volBoxFrom = function () { |
|---|
| | | this.$Message.info("æ©å±js,å¢å å¼¹åºæ¶æ¯"); |
|---|
| | | this.$refs.volBoxFrom.show(); |
|---|
| | | } |
|---|
| | | //ä¿®æ¹dataå±æ§: |
|---|
| | | let data = $vueParam.data(); |
|---|
| | | data.formFileds['extend'] = "å¨ææ©å±å段"; |
|---|
| | | data.formOptions.splice(0,0,{ filed: "extend", title: "å¨æå¢å å段", type: "text", required: true }); |
|---|
| | | $vueParam.data = function () { |
|---|
| | | return data; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | export { extend } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div style="text-align: center;font-size: 16px;padding: 20px;">æ£å¨å è½½èµæº...</div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | export default { |
|---|
| | | created() { |
|---|
| | | // console.log('loading') |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <el-alert |
|---|
| | | :title="'å½åéä¸' + auditParam.rows + 'æ¡è®°å½å¾
å®¡æ ¸..'" |
|---|
| | | type="success" |
|---|
| | | :closable="false" |
|---|
| | | > |
|---|
| | | </el-alert> |
|---|
| | | <div class="item"> |
|---|
| | | <label>å®¡æ ¸ç»æï¼</label> |
|---|
| | | <el-radio-group v-model="auditParam.status"> |
|---|
| | | <el-radio |
|---|
| | | v-for="item in auditParam.data" |
|---|
| | | :key="item.status" |
|---|
| | | :label="item.status" |
|---|
| | | > |
|---|
| | | <span>{{ item.text }}</span> |
|---|
| | | </el-radio> |
|---|
| | | </el-radio-group> |
|---|
| | | </div> |
|---|
| | | <div class="item"> |
|---|
| | | <label style="margin-right: 13px;">å¤ æ³¨ï¼</label> |
|---|
| | | <el-input |
|---|
| | | v-model="auditParam.reason" |
|---|
| | | type="textarea" |
|---|
| | | style="margin-right: 13px;" |
|---|
| | | :autosize="{ minRows: 4, maxRows: 10 }" |
|---|
| | | placeholder="å®¡æ ¸å¤æ³¨..." |
|---|
| | | ></el-input> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | export default { |
|---|
| | | props: { |
|---|
| | | auditParam: { |
|---|
| | | type: Object, |
|---|
| | | default: () => { |
|---|
| | | return { |
|---|
| | | auditParam: { |
|---|
| | | rows: 0, |
|---|
| | | model: false, |
|---|
| | | status: -1, |
|---|
| | | reason: "", |
|---|
| | | data: [], //[{ text: "éè¿", status: 1 }, { text: "æç»", status: 2 }] |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .item{ |
|---|
| | | margin-top: 20px; |
|---|
| | | display: flex; |
|---|
| | | > label{ |
|---|
| | | width: 86px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div></div> |
|---|
| | | </template> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div id="test"></div> |
|---|
| | | </template> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div data-v-394040b0 class="icons"> |
|---|
| | | <div |
|---|
| | | @click="select(index)" |
|---|
| | | v-for="(item, index) in icons" |
|---|
| | | :key="index" |
|---|
| | | class="icons-item" |
|---|
| | | > |
|---|
| | | <i |
|---|
| | | :class="[item, selectIndex == index ? 'active' : '']" |
|---|
| | | style="font-size: 32px" |
|---|
| | | ></i> |
|---|
| | | <p>{{ item }}</p> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | export default { |
|---|
| | | props: { |
|---|
| | | onSelect: { |
|---|
| | | type: Function, |
|---|
| | | default: () => { |
|---|
| | | return ""; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | select(index) { |
|---|
| | | this.selectIndex = index; |
|---|
| | | this.onSelect(index < 0 ? "" : this.icons[index]); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | selectIndex: -1, |
|---|
| | | icons: [ |
|---|
| | | //ivu-icon ivu-icon-ios-add |
|---|
| | | "el-icon-platform-eleme", |
|---|
| | | "el-icon-eleme", |
|---|
| | | "el-icon-delete-solid", |
|---|
| | | "el-icon-delete", |
|---|
| | | "el-icon-s-tools", |
|---|
| | | "el-icon-setting", |
|---|
| | | "el-icon-user-solid", |
|---|
| | | "el-icon-user", |
|---|
| | | "el-icon-phone", |
|---|
| | | "el-icon-phone-outline", |
|---|
| | | "el-icon-more", |
|---|
| | | "el-icon-more-outline", |
|---|
| | | "el-icon-star-on", |
|---|
| | | "el-icon-star-off", |
|---|
| | | "el-icon-s-goods", |
|---|
| | | "el-icon-goods", |
|---|
| | | "el-icon-warning", |
|---|
| | | "el-icon-warning-outline", |
|---|
| | | "el-icon-question", |
|---|
| | | "el-icon-info", |
|---|
| | | "el-icon-remove", |
|---|
| | | "el-icon-circle-plus", |
|---|
| | | "el-icon-success", |
|---|
| | | "el-icon-error", |
|---|
| | | "el-icon-zoom-in", |
|---|
| | | "el-icon-zoom-out", |
|---|
| | | "el-icon-remove-outline", |
|---|
| | | "el-icon-circle-plus-outline", |
|---|
| | | "el-icon-circle-check", |
|---|
| | | "el-icon-circle-close", |
|---|
| | | "el-icon-s-help", |
|---|
| | | "el-icon-help", |
|---|
| | | "el-icon-minus", |
|---|
| | | "el-icon-plus", |
|---|
| | | "el-icon-check", |
|---|
| | | "el-icon-close", |
|---|
| | | "el-icon-picture", |
|---|
| | | "el-icon-picture-outline", |
|---|
| | | "el-icon-picture-outline-round", |
|---|
| | | "el-icon-upload", |
|---|
| | | "el-icon-upload2", |
|---|
| | | "el-icon-download", |
|---|
| | | "el-icon-camera-solid", |
|---|
| | | "el-icon-camera", |
|---|
| | | "el-icon-video-camera-solid", |
|---|
| | | "el-icon-video-camera", |
|---|
| | | "el-icon-message-solid", |
|---|
| | | "el-icon-bell", |
|---|
| | | "el-icon-s-cooperation", |
|---|
| | | "el-icon-s-order", |
|---|
| | | "el-icon-s-platform", |
|---|
| | | "el-icon-s-fold", |
|---|
| | | "el-icon-s-unfold", |
|---|
| | | "el-icon-s-operation", |
|---|
| | | "el-icon-s-promotion", |
|---|
| | | "el-icon-s-home", |
|---|
| | | "el-icon-s-release", |
|---|
| | | "el-icon-s-ticket", |
|---|
| | | "el-icon-s-management", |
|---|
| | | "el-icon-s-open", |
|---|
| | | "el-icon-s-shop", |
|---|
| | | "el-icon-s-marketing", |
|---|
| | | "el-icon-s-flag", |
|---|
| | | "el-icon-s-comment", |
|---|
| | | "el-icon-s-finance", |
|---|
| | | "el-icon-s-claim", |
|---|
| | | "el-icon-s-custom", |
|---|
| | | "el-icon-s-opportunity", |
|---|
| | | "el-icon-s-data", |
|---|
| | | "el-icon-s-check", |
|---|
| | | "el-icon-s-grid", |
|---|
| | | "el-icon-menu", |
|---|
| | | "el-icon-share", |
|---|
| | | "el-icon-d-caret", |
|---|
| | | "el-icon-caret-left", |
|---|
| | | "el-icon-caret-right", |
|---|
| | | "el-icon-caret-bottom", |
|---|
| | | "el-icon-caret-top", |
|---|
| | | "el-icon-bottom-left", |
|---|
| | | "el-icon-bottom-right", |
|---|
| | | "el-icon-back", |
|---|
| | | "el-icon-right", |
|---|
| | | "el-icon-bottom", |
|---|
| | | "el-icon-top", |
|---|
| | | "el-icon-top-left", |
|---|
| | | "el-icon-top-right", |
|---|
| | | "el-icon-arrow-left", |
|---|
| | | "el-icon-arrow-right", |
|---|
| | | "el-icon-arrow-down", |
|---|
| | | "el-icon-arrow-up", |
|---|
| | | "el-icon-d-arrow-left", |
|---|
| | | "el-icon-d-arrow-right", |
|---|
| | | "el-icon-video-pause", |
|---|
| | | "el-icon-video-play", |
|---|
| | | "el-icon-refresh", |
|---|
| | | "el-icon-refresh-right", |
|---|
| | | "el-icon-refresh-left", |
|---|
| | | "el-icon-finished", |
|---|
| | | "el-icon-sort", |
|---|
| | | "el-icon-sort-up", |
|---|
| | | "el-icon-sort-down", |
|---|
| | | "el-icon-rank", |
|---|
| | | "el-icon-loading", |
|---|
| | | "el-icon-view", |
|---|
| | | "el-icon-c-scale-to-original", |
|---|
| | | "el-icon-date", |
|---|
| | | "el-icon-edit", |
|---|
| | | "el-icon-edit-outline", |
|---|
| | | "el-icon-folder", |
|---|
| | | "el-icon-folder-opened", |
|---|
| | | "el-icon-folder-add", |
|---|
| | | "el-icon-folder-remove", |
|---|
| | | "el-icon-folder-delete", |
|---|
| | | "el-icon-folder-checked", |
|---|
| | | "el-icon-tickets", |
|---|
| | | "el-icon-document-remove", |
|---|
| | | "el-icon-document-delete", |
|---|
| | | "el-icon-document-copy", |
|---|
| | | "el-icon-document-checked", |
|---|
| | | "el-icon-document", |
|---|
| | | "el-icon-document-add", |
|---|
| | | "el-icon-printer", |
|---|
| | | "el-icon-paperclip", |
|---|
| | | "el-icon-takeaway-box", |
|---|
| | | "el-icon-search", |
|---|
| | | "el-icon-monitor", |
|---|
| | | "el-icon-attract", |
|---|
| | | "el-icon-mobile", |
|---|
| | | "el-icon-scissors", |
|---|
| | | "el-icon-umbrella", |
|---|
| | | "el-icon-headset", |
|---|
| | | "el-icon-brush", |
|---|
| | | "el-icon-mouse", |
|---|
| | | "el-icon-coordinate", |
|---|
| | | "el-icon-magic-stick", |
|---|
| | | "el-icon-reading", |
|---|
| | | "el-icon-data-line", |
|---|
| | | "el-icon-data-board", |
|---|
| | | "el-icon-pie-chart", |
|---|
| | | "el-icon-data-analysis", |
|---|
| | | "el-icon-collection-tag", |
|---|
| | | "el-icon-film", |
|---|
| | | "el-icon-suitcase", |
|---|
| | | "el-icon-suitcase-1", |
|---|
| | | "el-icon-receiving", |
|---|
| | | "el-icon-collection", |
|---|
| | | "el-icon-files", |
|---|
| | | "el-icon-notebook-1", |
|---|
| | | "el-icon-notebook-2", |
|---|
| | | "el-icon-toilet-paper", |
|---|
| | | "el-icon-office-building", |
|---|
| | | "el-icon-school", |
|---|
| | | "el-icon-table-lamp", |
|---|
| | | "el-icon-house", |
|---|
| | | "el-icon-no-smoking", |
|---|
| | | "el-icon-smoking", |
|---|
| | | "el-icon-shopping-cart-full", |
|---|
| | | "el-icon-shopping-cart-1", |
|---|
| | | "el-icon-shopping-cart-2", |
|---|
| | | "el-icon-shopping-bag-1", |
|---|
| | | "el-icon-shopping-bag-2", |
|---|
| | | "el-icon-sold-out", |
|---|
| | | "el-icon-sell", |
|---|
| | | "el-icon-present", |
|---|
| | | "el-icon-box", |
|---|
| | | "el-icon-bank-card", |
|---|
| | | "el-icon-money", |
|---|
| | | "el-icon-coin", |
|---|
| | | "el-icon-wallet", |
|---|
| | | "el-icon-discount", |
|---|
| | | "el-icon-price-tag", |
|---|
| | | "el-icon-news", |
|---|
| | | "el-icon-guide", |
|---|
| | | "el-icon-male", |
|---|
| | | "el-icon-female", |
|---|
| | | "el-icon-thumb", |
|---|
| | | "el-icon-cpu", |
|---|
| | | "el-icon-link", |
|---|
| | | "el-icon-connection", |
|---|
| | | "el-icon-open", |
|---|
| | | "el-icon-turn-off", |
|---|
| | | "el-icon-set-up", |
|---|
| | | "el-icon-chat-round", |
|---|
| | | "el-icon-chat-line-round", |
|---|
| | | "el-icon-chat-square", |
|---|
| | | "el-icon-chat-dot-round", |
|---|
| | | "el-icon-chat-dot-square", |
|---|
| | | "el-icon-chat-line-square", |
|---|
| | | "el-icon-message", |
|---|
| | | "el-icon-postcard", |
|---|
| | | "el-icon-position", |
|---|
| | | "el-icon-turn-off-microphone", |
|---|
| | | "el-icon-microphone", |
|---|
| | | "el-icon-close-notification", |
|---|
| | | "el-icon-bangzhu", |
|---|
| | | "el-icon-time", |
|---|
| | | "el-icon-odometer", |
|---|
| | | "el-icon-crop", |
|---|
| | | "el-icon-aim", |
|---|
| | | "el-icon-switch-button", |
|---|
| | | "el-icon-full-screen", |
|---|
| | | "el-icon-copy-document", |
|---|
| | | "el-icon-mic", |
|---|
| | | "el-icon-stopwatch", |
|---|
| | | "el-icon-medal-1", |
|---|
| | | "el-icon-medal", |
|---|
| | | "el-icon-trophy", |
|---|
| | | "el-icon-trophy-1", |
|---|
| | | "el-icon-first-aid-kit", |
|---|
| | | "el-icon-discover", |
|---|
| | | "el-icon-place", |
|---|
| | | "el-icon-location", |
|---|
| | | "el-icon-location-outline", |
|---|
| | | "el-icon-location-information", |
|---|
| | | "el-icon-add-location", |
|---|
| | | "el-icon-delete-location", |
|---|
| | | "el-icon-map-location", |
|---|
| | | "el-icon-alarm-clock", |
|---|
| | | "el-icon-timer", |
|---|
| | | "el-icon-watch-1", |
|---|
| | | "el-icon-watch", |
|---|
| | | "el-icon-lock", |
|---|
| | | "el-icon-unlock", |
|---|
| | | "el-icon-key", |
|---|
| | | "el-icon-service", |
|---|
| | | "el-icon-mobile-phone", |
|---|
| | | "el-icon-bicycle", |
|---|
| | | "el-icon-truck", |
|---|
| | | "el-icon-ship", |
|---|
| | | "el-icon-basketball", |
|---|
| | | "el-icon-football", |
|---|
| | | "el-icon-soccer", |
|---|
| | | "el-icon-baseball", |
|---|
| | | "el-icon-wind-power", |
|---|
| | | "el-icon-light-rain", |
|---|
| | | "el-icon-lightning", |
|---|
| | | "el-icon-heavy-rain", |
|---|
| | | "el-icon-sunrise", |
|---|
| | | "el-icon-sunrise-1", |
|---|
| | | "el-icon-sunset", |
|---|
| | | "el-icon-sunny", |
|---|
| | | "el-icon-cloudy", |
|---|
| | | "el-icon-partly-cloudy", |
|---|
| | | "el-icon-cloudy-and-sunny", |
|---|
| | | "el-icon-moon", |
|---|
| | | "el-icon-moon-night", |
|---|
| | | "el-icon-dish", |
|---|
| | | "el-icon-dish-1", |
|---|
| | | "el-icon-food", |
|---|
| | | "el-icon-chicken", |
|---|
| | | "el-icon-fork-spoon", |
|---|
| | | "el-icon-knife-fork", |
|---|
| | | "el-icon-burger", |
|---|
| | | "el-icon-tableware", |
|---|
| | | "el-icon-sugar", |
|---|
| | | "el-icon-dessert", |
|---|
| | | "el-icon-ice-cream", |
|---|
| | | "el-icon-hot-water", |
|---|
| | | "el-icon-water-cup", |
|---|
| | | "el-icon-coffee-cup", |
|---|
| | | "el-icon-cold-drink", |
|---|
| | | "el-icon-goblet", |
|---|
| | | "el-icon-goblet-full", |
|---|
| | | "el-icon-goblet-square", |
|---|
| | | "el-icon-goblet-square-full", |
|---|
| | | "el-icon-refrigerator", |
|---|
| | | "el-icon-grape", |
|---|
| | | "el-icon-watermelon", |
|---|
| | | "el-icon-cherry", |
|---|
| | | "el-icon-apple", |
|---|
| | | "el-icon-pear", |
|---|
| | | "el-icon-orange", |
|---|
| | | "el-icon-coffee", |
|---|
| | | "el-icon-ice-tea", |
|---|
| | | "el-icon-ice-drink", |
|---|
| | | "el-icon-milk-tea", |
|---|
| | | "el-icon-potato-strips", |
|---|
| | | "el-icon-lollipop", |
|---|
| | | "el-icon-ice-cream-square", |
|---|
| | | "el-icon-ice-cream-round", |
|---|
| | | ], |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .icons-item { |
|---|
| | | float: left; |
|---|
| | | margin: 6px 6px 6px 0; |
|---|
| | | width: 115px; |
|---|
| | | text-align: center; |
|---|
| | | list-style: none; |
|---|
| | | cursor: pointer; |
|---|
| | | height: 100px; |
|---|
| | | color: #5c6b77; |
|---|
| | | transition: all 0.2s ease; |
|---|
| | | position: relative; |
|---|
| | | padding-top: 10px; |
|---|
| | | } |
|---|
| | | .active { |
|---|
| | | border: 1px solid; |
|---|
| | | background: #f44336; |
|---|
| | | color: white; |
|---|
| | | font-size: 32px; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div> |
|---|
| | | <el-select |
|---|
| | | style="width: 150px" |
|---|
| | | v-if="['select', 'selectList'].indexOf(singleSearch.type) != -1" |
|---|
| | | v-model="searchFormFields[singleSearch.field]" |
|---|
| | | :filterable=" |
|---|
| | | singleSearch.filter || singleSearch.data.length > 10 ? true : false |
|---|
| | | " |
|---|
| | | :placeholder="'请éæ©' + singleSearch.title" |
|---|
| | | clearable |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="item in singleSearch.data" |
|---|
| | | :key="item.key" |
|---|
| | | :label="item.value" |
|---|
| | | :value="item.key" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | <div |
|---|
| | | class="date-range" |
|---|
| | | v-else-if="['date', 'datetime'].indexOf(singleSearch.type) != -1" |
|---|
| | | > |
|---|
| | | <el-date-picker |
|---|
| | | style="width: 210px" |
|---|
| | | :clearable="false" |
|---|
| | | unlink-panels |
|---|
| | | v-model="searchFormFields[singleSearch.field]" |
|---|
| | | type="daterange" |
|---|
| | | :value-format="getDateFormat(singleSearch)" |
|---|
| | | :placeholder="singleSearch.title" |
|---|
| | | > |
|---|
| | | </el-date-picker> |
|---|
| | | <i |
|---|
| | | class="el-icon-circle-close" |
|---|
| | | @click="dateRangeClear(singleSearch.field)" |
|---|
| | | ></i> |
|---|
| | | </div> |
|---|
| | | <el-cascader |
|---|
| | | style="width: 210px" |
|---|
| | | clearable |
|---|
| | | v-model="searchFormFields[singleSearch.field]" |
|---|
| | | v-else-if="singleSearch.type == 'cascader'" |
|---|
| | | :options="singleSearch.data" |
|---|
| | | :props="{ checkStrictly: true }" |
|---|
| | | > |
|---|
| | | </el-cascader> |
|---|
| | | <el-input |
|---|
| | | clearable |
|---|
| | | v-else |
|---|
| | | style="width: 150px" |
|---|
| | | size="default" |
|---|
| | | v-model="searchFormFields[singleSearch.field]" |
|---|
| | | :placeholder="singleSearch.title" |
|---|
| | | @keypress="tiggerPress" |
|---|
| | | /> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | export default { |
|---|
| | | props: { |
|---|
| | | singleSearch: { |
|---|
| | | type: Object, |
|---|
| | | default: {}, |
|---|
| | | }, |
|---|
| | | searchFormFields: { |
|---|
| | | type: Object, |
|---|
| | | default: () => { |
|---|
| | | return {}; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | tiggerPress: { |
|---|
| | | type: Function, |
|---|
| | | default: () => {}, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | compareDate(date1, date2) { |
|---|
| | | if (!date2) { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | return ( |
|---|
| | | date1.valueOf() < |
|---|
| | | (typeof date2 == "number" ? date2 : new Date(date2).valueOf()) |
|---|
| | | ); |
|---|
| | | }, |
|---|
| | | getDateFormat(item) { |
|---|
| | | //è§https://day.js.org/docs/zh-CN/display/format |
|---|
| | | return item.type == "date" ? "YYYY-MM-DD" : "YYYY-MM-DD HH:mm:ss"; |
|---|
| | | }, |
|---|
| | | getDateOptions(date, item) { |
|---|
| | | if ((!item.min && !item.max) || !date) { |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | if (item.min && item.min.indexOf(" ") == -1) { |
|---|
| | | //ä¸è®¾ç½®æ¶åç§ï¼åé¢ä¼èªå¨å ä¸ 08:00 |
|---|
| | | item.min = item.min + " 00:00:000"; |
|---|
| | | } |
|---|
| | | return ( |
|---|
| | | this.compareDate(date, item.min) || !this.compareDate(date, item.max) |
|---|
| | | ); |
|---|
| | | }, |
|---|
| | | dateRangeClear(field) { |
|---|
| | | this.searchFormFields[field]=[undefined,undefined]; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | created() { |
|---|
| | | this.singleSearch.dateType = this.singleSearch.type + "range"; |
|---|
| | | if ( |
|---|
| | | this.singleSearch.type == "date" || |
|---|
| | | this.singleSearch.type == "datetime" |
|---|
| | | ) { |
|---|
| | | var _dateVal = this.searchFormFields[this.singleSearch.field]; |
|---|
| | | if ( |
|---|
| | | typeof this.singleSearch.range == "boolean" && |
|---|
| | | !this.singleSearch.range |
|---|
| | | ) { |
|---|
| | | this.searchFormFields[this.singleSearch.field] = ""; |
|---|
| | | this.singleSearch.dateType = this.singleSearch.type; |
|---|
| | | return this.singleSearch.dateType; |
|---|
| | | } else if (!(_dateVal instanceof Array)) { |
|---|
| | | this.searchFormFields[this.singleSearch.field] = ["", ""]; |
|---|
| | | } else if (_dateVal.length != 2) { |
|---|
| | | _dateVal.splice(0); |
|---|
| | | _dateVal.push(...["", ""]); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .date-range{ |
|---|
| | | position: relative; |
|---|
| | | > i{ |
|---|
| | | display: none; |
|---|
| | | height: 27px; |
|---|
| | | line-height: 27px; |
|---|
| | | right: 1px; |
|---|
| | | top: 3px; |
|---|
| | | font-size: 13px; |
|---|
| | | color: #b4adad; |
|---|
| | | position: absolute; |
|---|
| | | padding: 0 6px 0 3px; |
|---|
| | | background: #ffff; |
|---|
| | | cursor: pointer; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .date-range:hover > i{ |
|---|
| | | display: inline-block; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="router-loading" style="background: #eeeeee5c;"> |
|---|
| | | <div class="spanner"> |
|---|
| | | <span></span> |
|---|
| | | <span></span> |
|---|
| | | <span></span> |
|---|
| | | <span></span> |
|---|
| | | <span></span> |
|---|
| | | <span></span> |
|---|
| | | <span></span> |
|---|
| | | <span></span> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | export default { |
|---|
| | | data() { |
|---|
| | | return {}; |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | <style scoped> |
|---|
| | | .router-loading { |
|---|
| | | position: absolute; |
|---|
| | | top: 0; |
|---|
| | | left: 0; |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | font-size: 100px; |
|---|
| | | text-align: center; |
|---|
| | | padding-top: 200px; |
|---|
| | | color: #808080; |
|---|
| | | z-index: 9999; |
|---|
| | | } |
|---|
| | | .spanner { |
|---|
| | | width: 100px; |
|---|
| | | height: 100px; |
|---|
| | | position: relative; |
|---|
| | | margin: 0 auto; |
|---|
| | | } |
|---|
| | | .router-loading span { |
|---|
| | | display: inline-block; |
|---|
| | | width: 20px; |
|---|
| | | height: 20px; |
|---|
| | | border-radius: 50%; |
|---|
| | | background: #66b1ff; |
|---|
| | | position: absolute; |
|---|
| | | animation: r_load 1.04s ease infinite; |
|---|
| | | } |
|---|
| | | @keyframes r_load { |
|---|
| | | 0% { |
|---|
| | | transform: scale(1.2); |
|---|
| | | opacity: 1; |
|---|
| | | } |
|---|
| | | 100% { |
|---|
| | | transform: scale(0.3); |
|---|
| | | opacity: 0.5; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .router-loading span:nth-child(1) { |
|---|
| | | left: 0; |
|---|
| | | top: 50%; |
|---|
| | | margin-top: -10px; |
|---|
| | | animation-delay: 0.13s; |
|---|
| | | } |
|---|
| | | .router-loading span:nth-child(2) { |
|---|
| | | left: 14px; |
|---|
| | | top: 14px; |
|---|
| | | animation-delay: 0.26s; |
|---|
| | | } |
|---|
| | | .router-loading span:nth-child(3) { |
|---|
| | | left: 50%; |
|---|
| | | top: 0; |
|---|
| | | margin-left: -10px; |
|---|
| | | animation-delay: 0.39s; |
|---|
| | | } |
|---|
| | | .router-loading span:nth-child(4) { |
|---|
| | | top: 14px; |
|---|
| | | right: 14px; |
|---|
| | | animation-delay: 0.52s; |
|---|
| | | } |
|---|
| | | .router-loading span:nth-child(5) { |
|---|
| | | right: 0; |
|---|
| | | top: 50%; |
|---|
| | | margin-top: -10px; |
|---|
| | | animation-delay: 0.65s; |
|---|
| | | } |
|---|
| | | .router-loading span:nth-child(6) { |
|---|
| | | right: 14px; |
|---|
| | | bottom: 14px; |
|---|
| | | animation-delay: 0.78s; |
|---|
| | | } |
|---|
| | | .router-loading span:nth-child(7) { |
|---|
| | | bottom: 0; |
|---|
| | | left: 50%; |
|---|
| | | margin-left: -10px; |
|---|
| | | animation-delay: 0.91s; |
|---|
| | | } |
|---|
| | | .router-loading span:nth-child(8) { |
|---|
| | | bottom: 14px; |
|---|
| | | left: 14px; |
|---|
| | | animation-delay: 1.04s; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="upload-container"> |
|---|
| | | <a :href="template.url" ref="template"></a> |
|---|
| | | <div class="button-group"> |
|---|
| | | <el-upload |
|---|
| | | style="float: left" |
|---|
| | | ref="uploadFile" |
|---|
| | | :max-size="maxSize" |
|---|
| | | :on-change="clearMsg" |
|---|
| | | :before-upload="beforeUpload" |
|---|
| | | :action="url" |
|---|
| | | > |
|---|
| | | <el-button size="small" |
|---|
| | | ><i class="el-icon-folder-opened"></i>éæ©æ件</el-button |
|---|
| | | > |
|---|
| | | </el-upload> |
|---|
| | | <el-button |
|---|
| | | v-if="template.url" |
|---|
| | | style="margin-left: 10px" |
|---|
| | | type="primary" |
|---|
| | | size="small" |
|---|
| | | @click="dowloadTemplate" |
|---|
| | | :loading="loadingStatus" |
|---|
| | | > |
|---|
| | | <i class="el-icon-bottom"></i> |
|---|
| | | ä¸è½½æ¨¡æ¿</el-button |
|---|
| | | > |
|---|
| | | <el-button |
|---|
| | | type="success" |
|---|
| | | size="small" |
|---|
| | | @click="upload" |
|---|
| | | :loading="loadingStatus" |
|---|
| | | > |
|---|
| | | <i class="el-icon-top"></i> |
|---|
| | | ä¸ä¼ æ件</el-button |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | <div class="alert"> |
|---|
| | | <el-alert title="ä¸ä¼ 说æ" type="warning" :closable="false" show-icon |
|---|
| | | >åªè½ä¸ä¼ excelæ件,æ件大å°ä¸è¶
è¿{{ maxSize }}M</el-alert |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div v-if="file"> |
|---|
| | | <h3>æ件å表</h3> |
|---|
| | | <div class="file-info"> |
|---|
| | | <span>æ件åï¼{{ file.name }}</span> |
|---|
| | | <span>大å°{{ (file.size / 1024).toFixed(2) }}KB</span> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div v-show="message" class="v-r-message"> |
|---|
| | | <h3 class="title">ä¸ä¼ ç»æ</h3> |
|---|
| | | <div class="text" :class="resultClass" v-html="message"></div> |
|---|
| | | </div> |
|---|
| | | <slot></slot> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | //ç®ååªæ¯æå个Excelä¸ä¼ ï¼å
¶ä»åè½å¼åä¸... |
|---|
| | | export default { |
|---|
| | | components: {}, |
|---|
| | | props: { |
|---|
| | | url: { |
|---|
| | | type: String, |
|---|
| | | default: '' |
|---|
| | | }, |
|---|
| | | template: { |
|---|
| | | //ä¸è½½æ¨¡æ¿é
ç½® |
|---|
| | | type: Object, |
|---|
| | | default: () => { |
|---|
| | | return { |
|---|
| | | url: '', //模æ¿ä¸è½½è·¯å¾ï¼å¦æ没æ模æ¿è·¯å¾ï¼åä¸æ¾ç¤ºä¸è½½æ¨¡æ¿åè½ |
|---|
| | | fileName: 'æªå®ä¹æ件å' //ä¸è½½æ¨¡æ¿çæ件å |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | importExcelBefore: { |
|---|
| | | type: Function, |
|---|
| | | default: (file) => { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | maxSize: 100, |
|---|
| | | model: true, |
|---|
| | | file: null, |
|---|
| | | loadingStatus: false, |
|---|
| | | message: '', |
|---|
| | | resultClass: '' |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | clearMsg() { |
|---|
| | | this.message = ''; |
|---|
| | | }, |
|---|
| | | reset() { |
|---|
| | | this.file = null; |
|---|
| | | this.message = ''; |
|---|
| | | this.resultClass = ''; |
|---|
| | | }, |
|---|
| | | getFileType() { |
|---|
| | | let fileName = |
|---|
| | | this.file.name |
|---|
| | | .split('.') |
|---|
| | | .pop() |
|---|
| | | .toLocaleLowerCase() || ''; |
|---|
| | | if (['numbers', 'csv', 'xls', 'xlsx'].indexOf(fileName) == -1) { |
|---|
| | | this.$Message.error('åªè½éæ©excelæ件'); |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | beforeUpload(file) { |
|---|
| | | this.file = file; |
|---|
| | | if (!this.getFileType()) { |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | return false; |
|---|
| | | }, |
|---|
| | | upload() { |
|---|
| | | let _url = this.url; |
|---|
| | | if (!_url) { |
|---|
| | | return this.$Message.error('没æé
置好Url'); |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (!this.file) { |
|---|
| | | return this.$Message.error('请éæ©æ件'); |
|---|
| | | } |
|---|
| | | var formData = new FormData(); |
|---|
| | | formData.append('fileInput', this.file); |
|---|
| | | if (!this.importExcelBefore(formData)) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | this.loadingStatus = true; |
|---|
| | | this.http.post(_url, formData).then( |
|---|
| | | (x) => { |
|---|
| | | // this.$refs.uploadFile.clearFiles(); |
|---|
| | | this.loadingStatus = false; |
|---|
| | | this.file = null; |
|---|
| | | if (x.status) { |
|---|
| | | this.$emit('importExcelAfter', x); |
|---|
| | | } |
|---|
| | | |
|---|
| | | this.message = x.message; |
|---|
| | | this.resultClass = x.status ? 'v-r-success' : 'v-r-error'; |
|---|
| | | }, |
|---|
| | | (error) => { |
|---|
| | | this.loadingStatus = false; |
|---|
| | | } |
|---|
| | | ); |
|---|
| | | }, |
|---|
| | | dowloadTemplate() { |
|---|
| | | let url = this.template.url; |
|---|
| | | let xmlResquest = new XMLHttpRequest(); |
|---|
| | | xmlResquest.open('GET', url, true); |
|---|
| | | xmlResquest.setRequestHeader('Content-type', 'application/json'); |
|---|
| | | xmlResquest.setRequestHeader( |
|---|
| | | 'Authorization', |
|---|
| | | this.$store.getters.getToken() |
|---|
| | | ); |
|---|
| | | let fileName = this.template.fileName + '.xlsx'; |
|---|
| | | let elink = this.$refs.template; |
|---|
| | | xmlResquest.responseType = 'blob'; |
|---|
| | | let $_vue = this; |
|---|
| | | this.loadingStatus = true; |
|---|
| | | xmlResquest.onload = function(oEvent) { |
|---|
| | | $_vue.loadingStatus = false; |
|---|
| | | if (xmlResquest.response.type == 'application/json') { |
|---|
| | | return $_vue.message.error('æªæ¾å°ä¸è½½æ件'); |
|---|
| | | } |
|---|
| | | let content = xmlResquest.response; |
|---|
| | | elink.download = fileName; |
|---|
| | | let blob = new Blob([content]); |
|---|
| | | elink.href = URL.createObjectURL(blob); |
|---|
| | | elink.click(); |
|---|
| | | }; |
|---|
| | | xmlResquest.send(); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .upload-container { |
|---|
| | | min-height: 270px !important; |
|---|
| | | display: inline-block; |
|---|
| | | width: 100%; |
|---|
| | | padding: 10px; |
|---|
| | | border: 1px dashed #989898; |
|---|
| | | min-height: 250px; |
|---|
| | | border-radius: 5px; |
|---|
| | | .alert { |
|---|
| | | margin-top: 12px; |
|---|
| | | } |
|---|
| | | .el-button-group > * { |
|---|
| | | display: flex; |
|---|
| | | } |
|---|
| | | h3 { |
|---|
| | | margin: 9px 0px; |
|---|
| | | } |
|---|
| | | .file-info > span { |
|---|
| | | margin-right: 20px; |
|---|
| | | } |
|---|
| | | .v-r-message { |
|---|
| | | margin-top: 10px; |
|---|
| | | .title { |
|---|
| | | margin-bottom: 2px; |
|---|
| | | } |
|---|
| | | > .text { |
|---|
| | | font-size: 13px; |
|---|
| | | } |
|---|
| | | .v-r-success { |
|---|
| | | color: #02b702; |
|---|
| | | } |
|---|
| | | .v-r-error { |
|---|
| | | color: #dc0909; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <vol-table |
|---|
| | | :tableData="tableData" |
|---|
| | | :columns="columns" |
|---|
| | | :height="411" |
|---|
| | | :pagination-hide="true" |
|---|
| | | :load-key="false" |
|---|
| | | :text-inline="false" |
|---|
| | | :ck="false" |
|---|
| | | ></vol-table> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import VolTable from '@/components/basic/VolTable.vue'; |
|---|
| | | import { |
|---|
| | | defineComponent, |
|---|
| | | ref, |
|---|
| | | reactive, |
|---|
| | | toRefs, |
|---|
| | | getCurrentInstance |
|---|
| | | } from 'vue'; |
|---|
| | | export default defineComponent({ |
|---|
| | | components: { |
|---|
| | | VolTable |
|---|
| | | }, |
|---|
| | | props: { |
|---|
| | | tableData: { |
|---|
| | | type: Array, |
|---|
| | | default: () => { |
|---|
| | | return []; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | setup() { |
|---|
| | | const columns = reactive([ |
|---|
| | | { title: 'èç¹', field: 'stepName' }, |
|---|
| | | { title: '审æ¹äºº', field: 'auditor' }, |
|---|
| | | { title: '审æ¹ç»æ', field: 'auditStatus' }, |
|---|
| | | { title: '审æ¹æ¶é´', field: 'auditDate',width:150 }, |
|---|
| | | { title: 'å¤æ³¨', field: 'remark' } |
|---|
| | | ]); |
|---|
| | | return { |
|---|
| | | columns |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | .view-container { |
|---|
| | | // padding: 15px; |
|---|
| | | background: white; |
|---|
| | | .grid-search { |
|---|
| | | padding-top: 15px; |
|---|
| | | //padding: 15px 15px 0 15px; |
|---|
| | | } |
|---|
| | | .grid-container, |
|---|
| | | .grid-body { |
|---|
| | | padding: 0 15px; |
|---|
| | | } |
|---|
| | | .view-header { |
|---|
| | | padding-left: 15px; |
|---|
| | | padding-right: 15px; |
|---|
| | | } |
|---|
| | | .fs-line { |
|---|
| | | height: 9px; |
|---|
| | | background: #f1f1f1; |
|---|
| | | margin-top: -10px; |
|---|
| | | margin-bottom: 10px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .view-header { |
|---|
| | | height: 45px; |
|---|
| | | position: relative; |
|---|
| | | padding-bottom: 11px; |
|---|
| | | display: flex; |
|---|
| | | .search-line { |
|---|
| | | min-width: 150px; |
|---|
| | | } |
|---|
| | | .search-line > div { |
|---|
| | | margin-left: 5px; |
|---|
| | | margin-right: 10px; |
|---|
| | | } |
|---|
| | | .search-line > div > div { |
|---|
| | | width: 200px; |
|---|
| | | text-align: left; |
|---|
| | | } |
|---|
| | | .search-line > div:first-child { |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | .search-line > div .ivu-select-dropdown { |
|---|
| | | max-height: 300px; |
|---|
| | | } |
|---|
| | | .btn-group { |
|---|
| | | white-space: nowrap; |
|---|
| | | button { |
|---|
| | | margin-left: 10px; |
|---|
| | | // padding: 5px 16px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .btn-group .ivu-dropdown-item { |
|---|
| | | text-align: left !important; |
|---|
| | | } |
|---|
| | | .btn-group .ivu-dropdown-item:not(:last-child) { |
|---|
| | | border-bottom: 1px dotted #eee; |
|---|
| | | } |
|---|
| | | .desc-text { |
|---|
| | | margin-top: 5px; |
|---|
| | | font-weight: bold; |
|---|
| | | margin-bottom: 3px; |
|---|
| | | font-size: 14px; |
|---|
| | | color: #313131; |
|---|
| | | white-space: nowrap; |
|---|
| | | border-bottom: 2px solid #646565; |
|---|
| | | i { |
|---|
| | | font-size: 16px; |
|---|
| | | position: relative; |
|---|
| | | top: 1px; |
|---|
| | | margin-right: 2px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .search-box { |
|---|
| | | background: #fefefe; |
|---|
| | | margin-top: 45px; |
|---|
| | | border: 1px solid #ececec; |
|---|
| | | position: absolute; |
|---|
| | | z-index: 999; |
|---|
| | | left: 0; |
|---|
| | | right: 0; |
|---|
| | | padding: 25px 40px; |
|---|
| | | padding-bottom: 0; |
|---|
| | | box-shadow: 0px 7px 18px -12px #bdc0bb; |
|---|
| | | } |
|---|
| | | .notice { |
|---|
| | | font-size: 13px; |
|---|
| | | color: #6b6b6b; |
|---|
| | | overflow: hidden; |
|---|
| | | text-overflow: ellipsis; |
|---|
| | | white-space: nowrap; |
|---|
| | | position: relative; |
|---|
| | | top: 12px; |
|---|
| | | flex: 1; |
|---|
| | | left: 10px; |
|---|
| | | margin-right: 20px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .table-info-cell-title { |
|---|
| | | background-color: #f5f5f5 !important; |
|---|
| | | } |
|---|
| | | .box-com { |
|---|
| | | > div.item { |
|---|
| | | // margin-bottom: 10px; |
|---|
| | | padding: 15px 17px 0 8px; |
|---|
| | | margin-bottom: 12px; |
|---|
| | | background: white; |
|---|
| | | } |
|---|
| | | > div.form-item { |
|---|
| | | padding: 19px 16px 0px 5px; |
|---|
| | | //box-shadow: 0 1px 7px rgb(199, 199, 199); |
|---|
| | | } |
|---|
| | | > div.table-item { |
|---|
| | | padding: 0 10px; |
|---|
| | | border-top: 1.5px solid #eaeaea; |
|---|
| | | } |
|---|
| | | .v-text { |
|---|
| | | line-height: 27px; |
|---|
| | | } |
|---|
| | | .form-text { |
|---|
| | | position: relative; |
|---|
| | | border-bottom: 1px solid #eee; |
|---|
| | | font-size: 14px; |
|---|
| | | margin-bottom: 14px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .form-closex { |
|---|
| | | text-align: right; |
|---|
| | | padding-bottom: 24px; |
|---|
| | | } |
|---|
| | | .form-closex button { |
|---|
| | | margin-left: 10px; |
|---|
| | | padding: 4px 13px; |
|---|
| | | } |
|---|
| | | .toolbar { |
|---|
| | | padding: 3px 0px; |
|---|
| | | width: 100%; |
|---|
| | | display: flex; |
|---|
| | | .title { |
|---|
| | | line-height: 29px; |
|---|
| | | border-bottom: none; |
|---|
| | | font-size: 13px; |
|---|
| | | font-weight: bolder; |
|---|
| | | margin-bottom: 0; |
|---|
| | | color: #5d5c5c; |
|---|
| | | .icon { |
|---|
| | | color: #009688; |
|---|
| | | font-size: 18px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | i { |
|---|
| | | line-height: 29px; |
|---|
| | | border-bottom: none; |
|---|
| | | font-weight: bolder; |
|---|
| | | margin-bottom: 0; |
|---|
| | | color: #5d5c5c; |
|---|
| | | position: relative; |
|---|
| | | margin-top: -4px; |
|---|
| | | font-size: 14px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .btns { |
|---|
| | | line-height: 28px; |
|---|
| | | flex: 1; |
|---|
| | | text-align: right; |
|---|
| | | button { |
|---|
| | | // border: none; |
|---|
| | | // margin-left:15px; |
|---|
| | | border: 0px; |
|---|
| | | padding: 0px 9px; |
|---|
| | | color: #292929; |
|---|
| | | } |
|---|
| | | button:hover{ |
|---|
| | | color: #0089f6; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="layout-container"> |
|---|
| | | <a :href="exportHref" ref="export"></a> |
|---|
| | | <!--å¼å¯æå è½½2020.12.06 --> |
|---|
| | | <vol-box |
|---|
| | | :on-model-close="closeCustomModel" |
|---|
| | | v-model="viewModel" |
|---|
| | | :height="520" |
|---|
| | | :width="500" |
|---|
| | | :padding="0" |
|---|
| | | :lazy="true" |
|---|
| | | title="设置" |
|---|
| | | > |
|---|
| | | <template #content> |
|---|
| | | <custom-column :view-columns="viewColumns"></custom-column> |
|---|
| | | </template> |
|---|
| | | <template #footer> |
|---|
| | | <div style="text-align: center"> |
|---|
| | | <el-button type="default" size="small" @click="closeCustomModel" |
|---|
| | | ><i class="el-icon-close"></i>åæ¶</el-button |
|---|
| | | > |
|---|
| | | <el-button type="success" size="small" @click="initViewColumns(true)" |
|---|
| | | ><i class="el-icon-refresh"></i>éç½®</el-button |
|---|
| | | > |
|---|
| | | <el-button type="primary" size="small" @click="saveColumnConfig" |
|---|
| | | ><i class="el-icon-check"></i>ç¡®å®</el-button |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </vol-box> |
|---|
| | | <ViewGridAudit @auditClick="saveAudit" :option="table" ref="audit"> |
|---|
| | | |
|---|
| | | </ViewGridAudit> |
|---|
| | | <!--å¼å¯æå è½½2020.12.06 --> |
|---|
| | | <!--å®¡æ ¸(å¼æ¥ç¹å»æé®æ¶æå è½½å¾
å®)--> |
|---|
| | | <!-- <vol-box |
|---|
| | | v-model="auditParam.model" |
|---|
| | | :height="auditParam.height" |
|---|
| | | :width="750" |
|---|
| | | :lazy="true" |
|---|
| | | :padding="0" |
|---|
| | | title="审æ¹" |
|---|
| | | > |
|---|
| | | <template #content> |
|---|
| | | <el-tabs type="card"> |
|---|
| | | <el-tab-pane label="å½å审æ¹"> |
|---|
| | | <div class="v-steps"> |
|---|
| | | <div |
|---|
| | | :class="{ 'step-current': item.isCurrent }" |
|---|
| | | class="step-item" |
|---|
| | | v-for="(item, index) in workFlowSteps" |
|---|
| | | :key="index" |
|---|
| | | > |
|---|
| | | <div class="left-item"> |
|---|
| | | <div>审æ¹æ¶é´</div> |
|---|
| | | <div class="left-date">{{ item.auditDate || 'å¾
审æ¹' }}</div> |
|---|
| | | </div> |
|---|
| | | <div class="right-item"> |
|---|
| | | <div class="step-line"></div> |
|---|
| | | <i class="step-circle"></i> |
|---|
| | | <div class="step-title"> |
|---|
| | | {{ item.stepName }} |
|---|
| | | </div> |
|---|
| | | <div class="step-text">审æ¹äººï¼{{ item.auditor }}</div> |
|---|
| | | <div class="step-text"> |
|---|
| | | ç¶ æï¼ {{ getAuditStatus(item.auditStatus) }} |
|---|
| | | </div> |
|---|
| | | <div class="step-text">å¤ æ³¨ï¼ {{ item.remark || '-' }}</div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div |
|---|
| | | :style="{ |
|---|
| | | 'margin-top': workFlowSteps.length ? '20px' : '-17px' |
|---|
| | | }" |
|---|
| | | class="audit-content" |
|---|
| | | v-show="auditParam.showAction" |
|---|
| | | > |
|---|
| | | <div style="margin-bottom:10px;"> |
|---|
| | | 审æ¹ï¼ |
|---|
| | | <el-radio-group |
|---|
| | | style="margin-left:15px" |
|---|
| | | v-model="auditParam.value" |
|---|
| | | > |
|---|
| | | <el-radio |
|---|
| | | v-for="item in auditParam.data" |
|---|
| | | :key="item.value" |
|---|
| | | :label="item.value" |
|---|
| | | > |
|---|
| | | <span>{{ item.text }}</span> |
|---|
| | | </el-radio> |
|---|
| | | </el-radio-group> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <el-input |
|---|
| | | v-model="auditParam.reason" |
|---|
| | | type="textarea" |
|---|
| | | style="margin-right: 13px;" |
|---|
| | | :autosize="{ minRows: 4, maxRows: 10 }" |
|---|
| | | placeholder="请è¾å
¥å¤æ³¨..." |
|---|
| | | ></el-input> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </el-tab-pane> |
|---|
| | | <el-tab-pane v-if="workFlowSteps.length" label="审æ¹è®°å½"> |
|---|
| | | <audit-his :table-data="auditParam.auditHis"></audit-his> |
|---|
| | | </el-tab-pane> |
|---|
| | | </el-tabs> |
|---|
| | | </template> |
|---|
| | | <template #footer> |
|---|
| | | <div style="text-align: center;"> |
|---|
| | | <el-button size="small" @click="auditParam.model = false" |
|---|
| | | ><i class="el-icon-close"></i>å
³é</el-button |
|---|
| | | > |
|---|
| | | <el-button |
|---|
| | | type="primary" |
|---|
| | | v-show="auditParam.showAction" |
|---|
| | | size="small" |
|---|
| | | @click="saveAudit" |
|---|
| | | ><i class="el-icon-check"></i>å®¡æ ¸</el-button |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </vol-box> --> |
|---|
| | | |
|---|
| | | <!--导å
¥excelåè½--> |
|---|
| | | <!--2020.10.31æ·»å 导å
¥åçæ¹æ³--> |
|---|
| | | <!--å¼å¯æå è½½2020.12.06 --> |
|---|
| | | <!-- 2022.01.08å¢å æç»è¡¨å¯¼å
¥å¤æ --> |
|---|
| | | <vol-box |
|---|
| | | v-if="upload.url" |
|---|
| | | v-model="upload.excel" |
|---|
| | | :height="350" |
|---|
| | | :width="600" |
|---|
| | | :lazy="true" |
|---|
| | | :title="(boxModel ? detailOptions.cnName : table.cnName) + '-导å
¥'" |
|---|
| | | > |
|---|
| | | <UploadExcel |
|---|
| | | ref="upload_excel" |
|---|
| | | @importExcelAfter="importExcelAfter" |
|---|
| | | :importExcelBefore="importExcelBefore" |
|---|
| | | :url="upload.url" |
|---|
| | | :template="upload.template" |
|---|
| | | ></UploadExcel> |
|---|
| | | </vol-box> |
|---|
| | | <!--头é¨èªå®ä¹ç»ä»¶--> |
|---|
| | | <component |
|---|
| | | :is="dynamicComponent.gridHeader" |
|---|
| | | ref="gridHeader" |
|---|
| | | @parentCall="parentCall" |
|---|
| | | ></component> |
|---|
| | | <!--主çé¢æ¥è¯¢ä¸table表åå¸å±--> |
|---|
| | | <div class="view-container"> |
|---|
| | | <!-- 2020.09.11å¢å åºå®æ¥è¯¢è¡¨å --> |
|---|
| | | <!--æ¥è¯¢æ¡ä»¶--> |
|---|
| | | <div class="grid-search"> |
|---|
| | | <div |
|---|
| | | :class="[fiexdSearchForm ? 'fiexd-search-box' : 'search-box']" |
|---|
| | | v-show="searchBoxShow" |
|---|
| | | > |
|---|
| | | <!-- 2020.09.13å¢å formFiledsæ¼åé误å
¼å®¹å¤ç --> |
|---|
| | | <vol-form |
|---|
| | | ref="searchForm" |
|---|
| | | :load-key="false" |
|---|
| | | style="padding: 0 15px" |
|---|
| | | :label-width="labelWidth" |
|---|
| | | :formRules="searchFormOptions" |
|---|
| | | :formFields="searchFormFields" |
|---|
| | | :select2Count="select2Count" |
|---|
| | | > |
|---|
| | | <template #footer> |
|---|
| | | <div v-if="!fiexdSearchForm" class="form-closex"> |
|---|
| | | <el-button size="small" type="primary" plain @click="search"> |
|---|
| | | <i class="el-icon-search" />æ¥è¯¢ |
|---|
| | | </el-button> |
|---|
| | | |
|---|
| | | <el-button |
|---|
| | | size="small" |
|---|
| | | type="success" |
|---|
| | | plain |
|---|
| | | @click="resetSearch" |
|---|
| | | > |
|---|
| | | <i class="el-icon-refresh-right" />éç½® |
|---|
| | | </el-button> |
|---|
| | | <el-button |
|---|
| | | size="small" |
|---|
| | | plain |
|---|
| | | @click="searchBoxShow = !searchBoxShow" |
|---|
| | | > |
|---|
| | | <i class="el-icon-switch-button" />å
³é |
|---|
| | | </el-button> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </vol-form> |
|---|
| | | <div v-if="fiexdSearchForm" class="fs-line"></div> |
|---|
| | | </div> |
|---|
| | | <div class="view-header"> |
|---|
| | | <div class="desc-text"> |
|---|
| | | <i class="el-icon-s-grid" /> |
|---|
| | | <span>{{ table.cnName }}</span> |
|---|
| | | </div> |
|---|
| | | <div class="notice"> |
|---|
| | | <a class="text" :title="extend.text">{{ extend.text }}</a> |
|---|
| | | </div> |
|---|
| | | <!--å¿«éæ¥è¯¢å段--> |
|---|
| | | <div class="search-line" v-if="!fiexdSearchForm"> |
|---|
| | | <QuickSearch |
|---|
| | | v-if="singleSearch" |
|---|
| | | :singleSearch="singleSearch" |
|---|
| | | :searchFormFields="searchFormFields" |
|---|
| | | :tiggerPress="quickSearchKeyPress" |
|---|
| | | ></QuickSearch> |
|---|
| | | </div> |
|---|
| | | <!--æä½æé®ç»--> |
|---|
| | | <!-- 2020.11.29å¢å æ¥è¯¢çé¢hiddenå±æ§ --> |
|---|
| | | |
|---|
| | | <div class="btn-group"> |
|---|
| | | <template |
|---|
| | | :key="bIndex" |
|---|
| | | v-for="(btn, bIndex) in buttons.slice(0, maxBtnLength)" |
|---|
| | | > |
|---|
| | | <el-dropdown size="small" v-if="btn.data" :split-button="false"> |
|---|
| | | <el-button |
|---|
| | | :color="btn.color" |
|---|
| | | :dark="false" |
|---|
| | | :type="btn.type" |
|---|
| | | :plain="btn.plain" |
|---|
| | | > |
|---|
| | | {{ btn.name }}<i class="el-icon-arrow-down el-icon--right"></i |
|---|
| | | ></el-button> |
|---|
| | | <template #dropdown> |
|---|
| | | <el-dropdown-menu> |
|---|
| | | <el-dropdown-item |
|---|
| | | v-for="(item, index) in btn.data" |
|---|
| | | :key="index" |
|---|
| | | > |
|---|
| | | <div @click="onClick(item.onClick)"> |
|---|
| | | <i :class="item.icon"></i> |
|---|
| | | {{ item.name }} |
|---|
| | | </div> |
|---|
| | | </el-dropdown-item> |
|---|
| | | </el-dropdown-menu> |
|---|
| | | </template> |
|---|
| | | </el-dropdown> |
|---|
| | | <el-button |
|---|
| | | v-else |
|---|
| | | :type="btn.type" |
|---|
| | | size="small" |
|---|
| | | :color="btn.color" |
|---|
| | | :dark="false" |
|---|
| | | :class="btn.class" |
|---|
| | | :plain="btn.plain" |
|---|
| | | v-show="!btn.hidden" |
|---|
| | | @click="onClick(btn.onClick)" |
|---|
| | | > |
|---|
| | | <i :class="btn.icon"></i> {{ btn.name }} |
|---|
| | | </el-button> |
|---|
| | | </template> |
|---|
| | | <!-- 设置åæé® --> |
|---|
| | | <!-- <el-button |
|---|
| | | type="default" |
|---|
| | | style="padding: 0px 10px" |
|---|
| | | size="small" |
|---|
| | | :plain="true" |
|---|
| | | v-if="showCustom" |
|---|
| | | @click="showCustomModel" |
|---|
| | | > |
|---|
| | | <i class="el-icon-s-grid"></i> |
|---|
| | | </el-button> --> |
|---|
| | | <el-dropdown |
|---|
| | | size="small" |
|---|
| | | @click="changeDropdown" |
|---|
| | | v-if="buttons.length > maxBtnLength" |
|---|
| | | > |
|---|
| | | <el-button type="primary" plain size="small"> |
|---|
| | | æ´å¤<i class="el-icon-arrow-down el-icon--right"></i> |
|---|
| | | </el-button> |
|---|
| | | <template #dropdown> |
|---|
| | | <el-dropdown-menu> |
|---|
| | | <el-dropdown-item |
|---|
| | | @click="changeDropdown(item.name)" |
|---|
| | | :name="item.name" |
|---|
| | | v-show="!item.hidden" |
|---|
| | | v-for="(item, dIndex) in buttons.slice( |
|---|
| | | maxBtnLength, |
|---|
| | | buttons.length |
|---|
| | | )" |
|---|
| | | :key="dIndex" |
|---|
| | | > |
|---|
| | | <i :class="item.icon"></i> {{ item.name }}</el-dropdown-item |
|---|
| | | > |
|---|
| | | </el-dropdown-menu> |
|---|
| | | </template> |
|---|
| | | </el-dropdown> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <!-- åå²ä½ç½® --> |
|---|
| | | <vol-box |
|---|
| | | v-if="boxInit" |
|---|
| | | v-model="boxModel" |
|---|
| | | :title="boxOptions.title" |
|---|
| | | :width="boxOptions.width" |
|---|
| | | :height="boxOptions.height" |
|---|
| | | :modal="boxOptions.modal" |
|---|
| | | :draggable="boxOptions.draggable" |
|---|
| | | :padding="0" |
|---|
| | | :on-model-close="onGridModelClose" |
|---|
| | | @fullscreen="fullscreen" |
|---|
| | | > |
|---|
| | | <!--æç»å¤´é¨èªå®ä¹ç»ä»¶--> |
|---|
| | | <template #content> |
|---|
| | | <div class="box-com"> |
|---|
| | | <component |
|---|
| | | :is="dynamicComponent.modelHeader" |
|---|
| | | ref="modelHeader" |
|---|
| | | @parentCall="parentCall" |
|---|
| | | ></component> |
|---|
| | | <!-- <div v-show="isBoxAudit" class="flow-step"> |
|---|
| | | <div v-for="(item, index) in workFlowSteps" :key="index"> |
|---|
| | | {{ item.stepName }} |
|---|
| | | </div> |
|---|
| | | </div> --> |
|---|
| | | <div class="item form-item"> |
|---|
| | | <vol-form |
|---|
| | | ref="form" |
|---|
| | | :editor="editor" |
|---|
| | | :load-key="false" |
|---|
| | | :label-width="boxOptions.labelWidth" |
|---|
| | | :formRules="editFormOptions" |
|---|
| | | :formFields="editFormFields" |
|---|
| | | :select2Count="select2Count" |
|---|
| | | ></vol-form> |
|---|
| | | </div> |
|---|
| | | <!--æç»bodyèªå®ä¹ç»ä»¶--> |
|---|
| | | <component |
|---|
| | | :is="dynamicComponent.modelBody" |
|---|
| | | ref="modelBody" |
|---|
| | | @parentCall="parentCall" |
|---|
| | | ></component> |
|---|
| | | <div |
|---|
| | | v-show="hasDetail" |
|---|
| | | v-if="detail.columns && detail.columns.length > 0" |
|---|
| | | class="grid-detail table-item item" |
|---|
| | | > |
|---|
| | | <div class="toolbar"> |
|---|
| | | <div class="title form-text"> |
|---|
| | | <span> |
|---|
| | | <i class="el-icon-menu" /> |
|---|
| | | {{ detail.cnName }} |
|---|
| | | </span> |
|---|
| | | </div> |
|---|
| | | <!--æç»è¡¨æ ¼æé®--> |
|---|
| | | <div class="btns" v-show="!isBoxAudit"> |
|---|
| | | <el-button |
|---|
| | | v-for="(btn, bIndex) in detailOptions.buttons" |
|---|
| | | :key="bIndex" |
|---|
| | | :plain="btn.plain" |
|---|
| | | v-show="!(typeof btn.hidden == 'boolean' && btn.hidden)" |
|---|
| | | @click="onClick(btn.onClick)" |
|---|
| | | size="small" |
|---|
| | | ><i :class="btn.icon"></i>{{ btn.name }}</el-button |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <vol-table |
|---|
| | | ref="detail" |
|---|
| | | @loadBefore="loadInternalDetailTableBefore" |
|---|
| | | @loadAfter="loadDetailTableAfter" |
|---|
| | | @rowChange="detailRowOnChange" |
|---|
| | | @rowClick="detailRowOnClick" |
|---|
| | | :url="detailOptions.url" |
|---|
| | | :load-key="false" |
|---|
| | | :index="true" |
|---|
| | | :tableData="detailOptions.data" |
|---|
| | | :columns="detailOptions.columns" |
|---|
| | | :pagination="detailOptions.pagination" |
|---|
| | | :height="detailOptions.height" |
|---|
| | | :single="detailOptions.single" |
|---|
| | | :pagination-hide="false" |
|---|
| | | :defaultLoadPage="detailOptions.load" |
|---|
| | | :beginEdit="detailOptions.beginEdit" |
|---|
| | | :endEditBefore="detailOptions.endEditBefore" |
|---|
| | | :endEditAfter="detailOptions.endEditAfter" |
|---|
| | | :summary="detailOptions.summary" |
|---|
| | | :click-edit="detailOptions.clickEdit" |
|---|
| | | :double-edit="detailOptions.doubleEdit" |
|---|
| | | :column-index="detailOptions.columnIndex" |
|---|
| | | :ck="detailOptions.ck" |
|---|
| | | :text-inline="detailOptions.textInline" |
|---|
| | | :select2Count="select2Count" |
|---|
| | | :selectable="detailSelectable" |
|---|
| | | ></vol-table> |
|---|
| | | </div> |
|---|
| | | <!--æç»footerèªå®ä¹ç»ä»¶--> |
|---|
| | | <component |
|---|
| | | :is="dynamicComponent.modelFooter" |
|---|
| | | ref="modelFooter" |
|---|
| | | @parentCall="parentCall" |
|---|
| | | ></component> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <template #footer> |
|---|
| | | <div style="text-align: center;" v-show="isBoxAudit"> |
|---|
| | | <el-button |
|---|
| | | size="small" |
|---|
| | | type="primary" |
|---|
| | | plain |
|---|
| | | @click="onGridModelClose(false)" |
|---|
| | | > |
|---|
| | | <i class="el-icon-close">å
³é</i> |
|---|
| | | </el-button> |
|---|
| | | <el-button |
|---|
| | | size="small" |
|---|
| | | type="primary" |
|---|
| | | v-show="auditParam.showViewButton" |
|---|
| | | @click="auditParam.model = true" |
|---|
| | | > |
|---|
| | | <i class="el-icon-view">审æ¹</i> |
|---|
| | | </el-button> |
|---|
| | | </div> |
|---|
| | | <div v-show="!isBoxAudit"> |
|---|
| | | <el-button |
|---|
| | | v-for="(btn, bIndex) in boxButtons" |
|---|
| | | :key="bIndex" |
|---|
| | | :type="btn.type" |
|---|
| | | size="small" |
|---|
| | | :plain="btn.plain" |
|---|
| | | v-show="!(typeof btn.hidden == 'boolean' && btn.hidden)" |
|---|
| | | :disabled="btn.hasOwnProperty('disabled') && !!btn.disabled" |
|---|
| | | @click="onClick(btn.onClick)" |
|---|
| | | > |
|---|
| | | <i :class="btn.icon"> {{ btn.name }}</i> |
|---|
| | | </el-button> |
|---|
| | | <el-button |
|---|
| | | size="small" |
|---|
| | | type="primary" |
|---|
| | | plain |
|---|
| | | @click="onGridModelClose(false)" |
|---|
| | | > |
|---|
| | | <i class="el-icon-close">å
³é</i> |
|---|
| | | </el-button> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </vol-box> |
|---|
| | | </div> |
|---|
| | | <!--bodyèªå®ä¹ç»ä»¶--> |
|---|
| | | <div class="grid-body"> |
|---|
| | | <component |
|---|
| | | :is="dynamicComponent.gridBody" |
|---|
| | | ref="gridBody" |
|---|
| | | @parentCall="parentCall" |
|---|
| | | ></component> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <!--tableè¡¨æ ¼--> |
|---|
| | | <div class="grid-container"> |
|---|
| | | <!-- 2021.05.02å¢å æ å½¢ç»æ rowKey --> |
|---|
| | | <vol-table |
|---|
| | | ref="table" |
|---|
| | | :single="single" |
|---|
| | | :rowKey="rowKey" |
|---|
| | | :loadTreeChildren="loadTreeTableChildren" |
|---|
| | | @loadBefore="loadTableBefore" |
|---|
| | | @loadAfter="loadTableAfter" |
|---|
| | | @rowChange="rowOnChange" |
|---|
| | | @rowClick="rowOnClick" |
|---|
| | | @rowDbClick="rowOnDbClick" |
|---|
| | | :tableData="[]" |
|---|
| | | :linkView="linkData" |
|---|
| | | :columns="columns" |
|---|
| | | :pagination="pagination" |
|---|
| | | :height="height" |
|---|
| | | :max-height="tableMaxHeight" |
|---|
| | | :pagination-hide="false" |
|---|
| | | :url="url" |
|---|
| | | :load-key="false" |
|---|
| | | :defaultLoadPage="load" |
|---|
| | | :summary="summary" |
|---|
| | | :double-edit="doubleEdit" |
|---|
| | | :index="doubleEdit" |
|---|
| | | :beginEdit="tableBeginEdit" |
|---|
| | | :endEditBefore="tableEndEditBefore" |
|---|
| | | :click-edit="true" |
|---|
| | | :column-index="columnIndex" |
|---|
| | | :text-inline="textInline" |
|---|
| | | :ck="ck" |
|---|
| | | :select2Count="select2Count" |
|---|
| | | :selectable="selectable" |
|---|
| | | ></vol-table> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <!--footerèªå®ä¹ç»ä»¶--> |
|---|
| | | <component |
|---|
| | | :is="dynamicComponent.gridFooter" |
|---|
| | | ref="gridFooter" |
|---|
| | | @parentCall="parentCall" |
|---|
| | | ></component> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | const _const = { |
|---|
| | | EDIT: 'update', |
|---|
| | | ADD: 'Add', |
|---|
| | | VIEW: 'view', |
|---|
| | | PAGE: 'getPageData', |
|---|
| | | AUDIT: 'audit', |
|---|
| | | DEL: 'del', |
|---|
| | | EXPORT: 'Export', //导åºæä½è¿åå å¯åçè·¯å¾ |
|---|
| | | DOWNLOAD: 'DownLoadFile', //导åºæ件 |
|---|
| | | DOWNLOADTEMPLATE: 'DownLoadTemplate', //ä¸è½½å¯¼å
¥æ¨¡æ¿ |
|---|
| | | IMPORT: 'Import', //导å
¥(导å
¥è¡¨çExcelåè½) |
|---|
| | | UPLOAD: 'Upload' //ä¸ä¼ æ件 |
|---|
| | | }; |
|---|
| | | import Empty from '@/components/basic/Empty.vue'; |
|---|
| | | |
|---|
| | | import VolTable from '@/components/basic/VolTable.vue'; |
|---|
| | | import VolForm from '@/components/basic/VolForm.vue'; |
|---|
| | | import { |
|---|
| | | defineAsyncComponent, |
|---|
| | | defineComponent, |
|---|
| | | ref, |
|---|
| | | shallowRef, |
|---|
| | | toRaw |
|---|
| | | } from 'vue'; |
|---|
| | | var vueParam = { |
|---|
| | | components: { |
|---|
| | | 'vol-form': VolForm, |
|---|
| | | 'vol-table': VolTable, |
|---|
| | | VolBox: defineAsyncComponent(() => import('@/components/basic/VolBox.vue')), |
|---|
| | | QuickSearch: defineAsyncComponent(() => |
|---|
| | | import('@/components/basic/QuickSearch.vue') |
|---|
| | | ), |
|---|
| | | Audit: defineAsyncComponent(() => import('@/components/basic/Audit.vue')), |
|---|
| | | UploadExcel: defineAsyncComponent(() => |
|---|
| | | import('@/components/basic/UploadExcel.vue') |
|---|
| | | ), |
|---|
| | | 'custom-column': defineAsyncComponent(() => |
|---|
| | | import('./ViewGridCustomColumn.vue') |
|---|
| | | ), |
|---|
| | | 'vol-header': defineAsyncComponent(() => import('./../VolHeader.vue')), |
|---|
| | | ViewGridAudit: defineAsyncComponent(() => import('./ViewGridAudit.vue')) |
|---|
| | | }, |
|---|
| | | props: {}, |
|---|
| | | setup(props) { |
|---|
| | | //2021.07.17è°æ´æ©å±ç»ä»¶ç»ä»¶ |
|---|
| | | const dynamicCom = { |
|---|
| | | gridHeader: Empty, |
|---|
| | | gridBody: Empty, |
|---|
| | | gridFooter: Empty, |
|---|
| | | modelHeader: Empty, |
|---|
| | | modelBody: Empty, |
|---|
| | | modelFooter: Empty |
|---|
| | | }; |
|---|
| | | //å并æ©å±ç»ä»¶ |
|---|
| | | if (props.extend.components) { |
|---|
| | | for (const key in props.extend.components) { |
|---|
| | | if (props.extend.components[key]) { |
|---|
| | | dynamicCom[key] = toRaw(props.extend.components[key]); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | const dynamicComponent = shallowRef(dynamicCom); |
|---|
| | | return { dynamicComponent }; |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | isBoxAudit: false, |
|---|
| | | formFieldsType: [], |
|---|
| | | workFlowSteps: [], |
|---|
| | | //æ å½¢ç»æç主é®å段ï¼å¦æ设置å¼é»è®¤ä¼å¼å¯æ å½¢tableï¼æ³¨ærowKeyå段çå¼å¿
é¡»æ¯å¯ä¸ï¼2021.05.02ï¼ |
|---|
| | | rowKey: undefined, |
|---|
| | | fiexdSearchForm: false, //2020.09.011æ¯å¦åºå®æ¥è¯¢è¡¨åï¼trueæ¥è¯¢è¡¨åå°åºå®æ¾ç¤ºå¨è¡¨åçæä¸é¢ |
|---|
| | | _inited: false, |
|---|
| | | doubleEdit: false, //2021.03.19æ¯å¦å¼å¯æ¥è¯¢çé¢è¡¨æ ¼åå»ç¼è¾ |
|---|
| | | single: false, //表æ¯å¦åé |
|---|
| | | const: _const, //å¢å æ¹æ¥å¯¼å
¥å¯¼åºç对åºçaction |
|---|
| | | boxInit: false, //æ°å»ºæç¼è¾çå¼¹åºæ¡ååç¶æï¼é»è®¤ä¸ååå§åï¼ç¹å»æ°å»ºæç¼è¾æåå§åå¼¹åºæ¡ |
|---|
| | | searchBoxShow: false, //é«çº§æ¥è¯¢(çé¢æ¥è¯¢åçä¸ææ¡ç¹å»è§¦å) |
|---|
| | | singleSearch: {}, //å¿«éæ¥è¯¢å段 |
|---|
| | | exportHref: '', |
|---|
| | | currentAction: _const.ADD, //å½æ°å»ºæç¼è¾æ¶ï¼è®°å½å½åçç¶æ:å¦å½åæä½æ¯æ°å»º |
|---|
| | | currentRow: {}, //å½åç¼è¾ææ¥çæ°æ®çè¡ |
|---|
| | | closable: false, |
|---|
| | | boxModel: false, //å¼¹åºæ°å»ºãç¼è¾æ¡ |
|---|
| | | width: 700, //å¼¹åºæ¡æ¥ç表æ°æ®ç»æ |
|---|
| | | labelWidth: 100, //é«çº§æ¥è¯¢çæ ç¾å®½åº¦ |
|---|
| | | viewModel: false, //æ¥ç表ç»æçå¼¹åºæ¡ |
|---|
| | | viewColumns: [], //æ¥ç表ç»æçåæ°æ® |
|---|
| | | viewColumnsClone: [], |
|---|
| | | showCustom: true, //æ¯å¦æ¾ç¤ºèªå®ä¹é
ç½®åæé®2022.05.27 |
|---|
| | | // viewData: [], //æ¥ç表ç»æä¿¡æ¯ |
|---|
| | | maxBtnLength: 8, //çé¢æé®æå¤æ¾ç¤ºç个æ°ï¼è¶
è¿çæ°éé½æ¾ç¤ºå¨æ´å¤ä¸ |
|---|
| | | buttons: [], //æ¥è¯¢çé¢æé® å¦éè¦å
¶ä»æä½æé®ï¼å¯å¨è¡¨å¯¹åºç.jsä¸æ·»å (å¦:Sys_User.jsä¸buttonsæ·»å å
¶ä»æé®) |
|---|
| | | splitButtons: [], |
|---|
| | | uploadfiled: [], //ä¸ä¼ æ件å¾ççå段 |
|---|
| | | boxButtons: [], //å¼¹åºæ¡æé® å¦éè¦å
¶ä»æä½æé®ï¼å¯å¨è¡¨å¯¹åºç.jsä¸æ·»å |
|---|
| | | dicKeys: [], //å½åçé¢ææçä¸ææ¡åå
¸ç¼å·åæ°æ®æº |
|---|
| | | hasKeyField: [], //æåå
¸æ°æ®æºçå段 |
|---|
| | | keyValueType: { _dinit: false }, |
|---|
| | | url: '', //çé¢è¡¨æ¥è¯¢çæ°æ®æºçurl |
|---|
| | | hasDetail: false, //æ¯å¦æä»è¡¨(æç»)è¡¨æ ¼æ°æ® |
|---|
| | | initActivated: false, |
|---|
| | | load: true, //æ¯å¦é»è®¤å 载表æ°æ® |
|---|
| | | activatedLoad: false, //页é¢è§¦åactivedæ¶æ¯å¦å·æ°é¡µé¢æ°æ® |
|---|
| | | summary: false, //æ¥è¯¢çé¢tableæ¯å¦æ¾ç¤ºå计 |
|---|
| | | //éè¦ä»è¿ç¨ç»å®æ°æ®æºçåå
¸ç¼å·,å¦æåå
¸æ°æ®æºçæ¥è¯¢ç»æè¾å¤ï¼è¯·å¨onInitä¸å°åå
¸ç¼å·æ·»å è¿æ¥ |
|---|
| | | //åªå¯¹èªå®sqlææ |
|---|
| | | remoteKeys: [], |
|---|
| | | columnIndex: false, //2020.11.01æ¯å¦æ¾ç¤ºè¡å· |
|---|
| | | ck: true, //2020.11.01æ¯å¦æ¾ç¤ºcheckbox |
|---|
| | | continueAdd: false, //2021.04.11æ°å»ºæ¶æ¯å¦å¯ä»¥è¿ç»æ°å»ºæä½ |
|---|
| | | continueAddName: 'ä¿åå继ç»æ·»å ', //2021.04.11æé®å称 |
|---|
| | | // detailUrl: "", |
|---|
| | | detailOptions: { |
|---|
| | | //å¼¹åºæ¡ä»è¡¨(æç»)对象 |
|---|
| | | //ä»è¡¨é
ç½® |
|---|
| | | buttons: [], //å¼¹åºæ¡ä»è¡¨è¡¨æ ¼æä½æé®,ç®åæå é¤è¡ï¼æ·»å è¡ï¼å·æ°æä½ï¼å¦éè¦å
¶ä»æä½æé®ï¼å¯å¨è¡¨å¯¹åºç.jsä¸æ·»å |
|---|
| | | cnName: '', //ä»è¡¨å称 |
|---|
| | | key: '', //ä»è¡¨ä¸»é®å |
|---|
| | | data: [], //æ°æ®æº |
|---|
| | | columns: [], //ä»è¡¨åä¿¡æ¯ |
|---|
| | | edit: true, //æç»æ¯å¦å¯ä»¥ç¼è¾ |
|---|
| | | single: false, //æç»è¡¨æ¯å¦åé |
|---|
| | | load: false, // |
|---|
| | | delKeys: [], //å½ç¼è¾æ¶å é¤å½åæç»çè¡ä¸»é®å¼ |
|---|
| | | url: '', //ä»è¡¨å è½½æ°æ®çurl |
|---|
| | | pagination: { total: 0, size: 100, sortName: '' }, //ä»è¡¨å页é
ç½®æ°æ® |
|---|
| | | height: 0, //é»è®¤ä»è¡¨é«åº¦ |
|---|
| | | textInline: true, //æç»è¡¨è¡å
容æ¾ç¤ºå¨ä¸è¡ä¸ï¼å¦æéè¦æ¢è¡æ¾ç¤ºï¼è¯·è®¾ç½®ä¸ºfalse |
|---|
| | | doubleEdit: true, //使ç¨åå»ç¼è¾ |
|---|
| | | clickEdit: false, //æ¯å¦å¼å¯ç¹å»åå
æ ¼ç¼è¾ï¼ç¹å»å
¶ä»è¡æ¶ç»æç¼è¾ |
|---|
| | | currentReadonly: false, //å½åç¨æ·æ²¡æç¼è¾ææ°å»ºæéæ¶ï¼è¡¨ååªè¯»(å¯ç¨äºå¤æç¨æ·æ¯å¦æç¼è¾ææ°å»ºæé) |
|---|
| | | //å¼å¯ç¼è¾æ¶ |
|---|
| | | beginEdit: (row, column, index) => { |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | //ç»æç¼è¾å |
|---|
| | | endEditBefore: (row, column, index) => { |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | //ç»æç¼è¾å |
|---|
| | | endEditAfter: (row, column, index) => { |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | columnIndex: false, //2020.11.01æç»æ¯å¦æ¾ç¤ºè¡å· |
|---|
| | | ck: true //2020.11.01æç»æ¯å¦æ¾ç¤ºcheckbox |
|---|
| | | }, |
|---|
| | | auditParam: { |
|---|
| | | //å®¡æ ¸å¯¹è±¡ |
|---|
| | | rows: 0, //å½åéä¸å®¡æ ¸çè¡æ° |
|---|
| | | model: false, //å®¡æ ¸å¼¹åºæ¡ |
|---|
| | | value: -1, //å®¡æ ¸ç»æ |
|---|
| | | status: -1, |
|---|
| | | reason: '', //å®¡æ ¸åå |
|---|
| | | height: 500, |
|---|
| | | showViewButton: true, |
|---|
| | | auditHis: [], |
|---|
| | | showAction: false, //æ¯å¦æ¾ç¤ºå®¡æ¹æä½(å½åèç¹ä¸ºç¨æ·å®¡æ¹æ¶æ¾ç¤º) |
|---|
| | | //å®¡æ ¸é项(å¯èªè¡åæ·»å ) |
|---|
| | | data: [ |
|---|
| | | { text: 'éè¿', value: 1 }, |
|---|
| | | { text: 'æç»', value: 2 }, |
|---|
| | | { text: '驳å', value: 3 } |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | upload: { |
|---|
| | | //导å
¥ä¸ä¼ excel对象 |
|---|
| | | excel: false, //导å
¥çå¼¹åºæ¡æ¯å¦æ¾ç¤º |
|---|
| | | url: '', //导å
¥çè·¯å¾,å¦æ没æå¼ï¼åä¸æ¸²æ导å
¥åè½ |
|---|
| | | template: { |
|---|
| | | //ä¸è½½æ¨¡æ¿å¯¹è±¡ |
|---|
| | | url: '', //ä¸è½½æ¨¡æ¿è·¯å¾ |
|---|
| | | fileName: '' //模æ¿ä¸è½½çä¸æå |
|---|
| | | }, |
|---|
| | | init: false //æ¯å¦æ导å
¥æéï¼ææ渲æ导å
¥ç»ä»¶ |
|---|
| | | }, |
|---|
| | | height: 0, //表é«åº¦ |
|---|
| | | tableHeight: 0, //æ¥è¯¢é¡µé¢tableçé«åº¦ |
|---|
| | | tableMaxHeight: 0, //æ¥è¯¢é¡µé¢tableçæ大é«åº¦ |
|---|
| | | textInline: true, //tableå
容è¶
åºåæ¯å¦ä¸æ¢è¡2020.01.16 |
|---|
| | | pagination: { total: 0, size: 30, sortName: '' }, //ä»å页é
ç½®æ°æ® |
|---|
| | | boxOptions: { |
|---|
| | | title: '', //å¼¹åºæ¡æ¾ç¤ºçæ é¢2022.08.01 |
|---|
| | | saveClose: true, |
|---|
| | | labelWidth: 100, |
|---|
| | | height: 0, |
|---|
| | | width: 0, |
|---|
| | | summary: false, //å¼¹åºæ¡æç»tableæ¯å¦æ¾ç¤ºå计 |
|---|
| | | draggable: false, //2022.09.12å¼¹åºæ¡æå¨åè½ |
|---|
| | | modal: true //2022.09.12å¼¹åºæ¡èæ¯é®ç½©å± |
|---|
| | | }, //saveCloseæ°å»ºæç¼è¾æååæ¯å¦å
³éå¼¹åºæ¡//å¼¹åºæ¡çæ ç¾å®½åº¦labelWidth |
|---|
| | | editor: { |
|---|
| | | uploadImgUrl: '', //ä¸ä¼ è·¯å¾ |
|---|
| | | upload: null //ä¸ä¼ æ¹æ³ |
|---|
| | | }, |
|---|
| | | numberFields: [], |
|---|
| | | //2022.09.26å¢å èªå®ä¹å¯¼åºæ件å |
|---|
| | | downloadFileName: null, |
|---|
| | | select2Count: 500 //è¶
åº500æ°éæ¾ç¤ºselect2ç»ä»¶ |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: {}, |
|---|
| | | activated() { |
|---|
| | | this.initFlowQuery(); |
|---|
| | | //2020.06.25å¢å activatedæ¹æ³ |
|---|
| | | this.onActivated && this.onActivated(); |
|---|
| | | if (!this._inited) { |
|---|
| | | this._inited = true; |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | if (this.activatedLoad) { |
|---|
| | | this.refresh(); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | | this.mounted(); |
|---|
| | | // this.$refs.searchForm.forEach() |
|---|
| | | }, |
|---|
| | | unmounted() { |
|---|
| | | this.destroyed(); |
|---|
| | | }, |
|---|
| | | created: function() { |
|---|
| | | //å并èªå®ä¹ä¸å¡æ©å±æ¹æ³ |
|---|
| | | Object.assign(this, this.extend.methods); |
|---|
| | | //å¦æ没ææå®æåºå段ï¼åç¨ä¸»é®ä½ä¸ºé»è®¤æåºå段 |
|---|
| | | this.pagination.sortName = this.table.sortName || this.table.key; |
|---|
| | | this.initBoxButtons(); //åå§åå¼¹åºæ¡ä¸æç»è¡¨æ ¼æé® |
|---|
| | | this.initAuditColumn(); |
|---|
| | | this.onInit(); //åå§ååï¼å¦æéè¦åå
¶ä»å¤çå¨æ©å±æ¹æ³ä¸è¦çæ¤æ¹æ³ |
|---|
| | | this.getButtons(); |
|---|
| | | //åå§åèªå®ä¹è¡¨æ ¼å |
|---|
| | | this.initViewColumns(); |
|---|
| | | //åå§ç¼è¾æ¡çæ°æ® |
|---|
| | | this.initBoxHeightWidth(); |
|---|
| | | this.initDicKeys(); //åå§ä¸æ¡æ°æ®æº |
|---|
| | | this.onInited(); //åå§ååï¼å¦æéè¦åå
¶ä»å¤çå¨æ©å±æ¹æ³ä¸è¦çæ¤æ¹æ³ |
|---|
| | | }, |
|---|
| | | beforeUpdate: function() {}, |
|---|
| | | updated: function() {} |
|---|
| | | }; |
|---|
| | | |
|---|
| | | import props from './props.js'; |
|---|
| | | import methods from './methods.js'; |
|---|
| | | |
|---|
| | | //å并å±æ§ |
|---|
| | | vueParam.props = Object.assign(vueParam.props, props); |
|---|
| | | //å并æ¹æ³ |
|---|
| | | vueParam.methods = Object.assign( |
|---|
| | | vueParam.methods, |
|---|
| | | methods, |
|---|
| | | props.extend.methods |
|---|
| | | ); |
|---|
| | | export default defineComponent(vueParam); |
|---|
| | | </script> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | @import './ViewGrid.less'; |
|---|
| | | </style> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .btn-group ::v-deep(.ivu-select-dropdown) { |
|---|
| | | padding: 0px !important; |
|---|
| | | right: 3px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .btn-group ::v-deep(.ivu-select-dropdown .ivu-dropdown-menu) { |
|---|
| | | min-width: 100px; |
|---|
| | | right: -2px; |
|---|
| | | position: absolute; |
|---|
| | | background: white; |
|---|
| | | width: 130px; |
|---|
| | | border-radius: 5px; |
|---|
| | | border: 1px solid #e7e5e5; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .vertical-center-modal ::v-deep(.srcoll-content) { |
|---|
| | | padding: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .view-model-content { |
|---|
| | | background: #eee; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .grid-detail ::v-deep(.v-table .el-table__header th) { |
|---|
| | | height: 44px; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .grid-search { |
|---|
| | | position: relative; |
|---|
| | | |
|---|
| | | .search-box { |
|---|
| | | background: #fefefe; |
|---|
| | | margin-top: 33px; |
|---|
| | | border: 1px solid #eae8e8; |
|---|
| | | position: absolute; |
|---|
| | | z-index: 999; |
|---|
| | | left: 15px; |
|---|
| | | right: 15px; |
|---|
| | | padding: 25px 20px; |
|---|
| | | padding-bottom: 0; |
|---|
| | | border-top: 0; |
|---|
| | | box-shadow: 0 7px 18px -12px #bdc0bb; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <vol-box :footer="false" v-model="model" :height="height" :width="width" :padding="0" :lazy="true" title="å®¡æ ¸"> |
|---|
| | | |
|---|
| | | <div class="audit-model-content" :style="{ height: height - 100 + 'px' }"> |
|---|
| | | <el-descriptions class="desc-top" :column="3" size="default" :border="true"> |
|---|
| | | <el-descriptions-item v-for="(item, index) in formData" :key="index"> |
|---|
| | | <template #label> |
|---|
| | | <div class="cell-item"> |
|---|
| | | {{ item.name }} |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | {{ item.value }} |
|---|
| | | </el-descriptions-item> |
|---|
| | | </el-descriptions> |
|---|
| | | <el-radio-group v-show="hasFlow" style="padding-left: 15px;" v-model="activeName" class="ml-4"> |
|---|
| | | <el-radio label="audit" size="large">å®¡æ ¸</el-radio> |
|---|
| | | <el-radio label="log" size="large">å®¡æ ¸è®°å½</el-radio> |
|---|
| | | </el-radio-group> |
|---|
| | | <div v-show="activeName == 'audit' || !hasFlow" class="audit-content"> |
|---|
| | | <div class="fx-left" v-if="hasFlow"> |
|---|
| | | <div class="v-steps"> |
|---|
| | | <div v-for="(item, index) in workFlowSteps" :key="index"> |
|---|
| | | <div class="step-item" :class="{'step-item-ad':item.auditId||item.stepAttrType=='start'}" v-if="item.stepAttrType == 'start'"> |
|---|
| | | <div class="left-item"> |
|---|
| | | <div>æµç¨å¼å§</div> |
|---|
| | | <div class="left-date">{{ item.createDate }}</div> |
|---|
| | | </div> |
|---|
| | | <div class="right-item"> |
|---|
| | | <div class="step-line"></div> |
|---|
| | | <i class="step-circle"></i> |
|---|
| | | <div class="step-title"> |
|---|
| | | {{ item.stepName }} |
|---|
| | | </div> |
|---|
| | | <div class="step-text">å起人ï¼{{ item.creator }}</div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="step-item" v-else-if="item.stepAttrType == 'end'"> |
|---|
| | | <div class="left-item"> |
|---|
| | | <div>æµç¨ç»æ</div> |
|---|
| | | </div> |
|---|
| | | <div class="right-item"> |
|---|
| | | <div class="step-line"></div> |
|---|
| | | <i class="step-circle"></i> |
|---|
| | | <div class="step-title"> |
|---|
| | | {{ item.stepName }} |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div v-else :class="{ 'step-current': item.isCurrent }" class="step-item"> |
|---|
| | | <div class="left-item"> |
|---|
| | | <div>审æ¹æ¶é´</div> |
|---|
| | | <div class="left-date">{{ item.auditDate || 'å¾
审æ¹' }}</div> |
|---|
| | | </div> |
|---|
| | | <div class="right-item"> |
|---|
| | | <div class="step-line"></div> |
|---|
| | | <i class="step-circle"></i> |
|---|
| | | <div class="step-title"> |
|---|
| | | {{ item.stepName }} |
|---|
| | | </div> |
|---|
| | | <div class="step-text">审æ¹äººï¼{{ item.auditor }}</div> |
|---|
| | | <div class="step-text"> |
|---|
| | | ç¶ æï¼ {{ getAuditStatus(item.auditStatus) }} |
|---|
| | | </div> |
|---|
| | | <div class="step-text">å¤ æ³¨ï¼ {{ item.remark || '-' }}</div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="fx-right" :style="{ width: !hasFlow ? '100%' : '400px' }" v-if="isCurrentUser || !hasFlow"> |
|---|
| | | |
|---|
| | | <div v-if="!hasFlow"> |
|---|
| | | <el-alert :title="'å½åéä¸ã' + rowLen + 'ãæ¡è®°å½å¾
å®¡æ ¸..'" type="success" :closable="false" /> |
|---|
| | | </div> |
|---|
| | | <div class="rd"> |
|---|
| | | <span>审æ¹ï¼</span> |
|---|
| | | <el-radio-group style="margin-left:15px" v-model="auditParam.value"> |
|---|
| | | <el-radio v-for="item in auditParam.data" :key="item.value" :label="item.value"> |
|---|
| | | <span>{{ item.text }}</span> |
|---|
| | | </el-radio> |
|---|
| | | </el-radio-group> |
|---|
| | | </div> |
|---|
| | | <el-input style="padding-top: 10px;" v-model="auditParam.reason" type="textarea" |
|---|
| | | :autosize="{ minRows: 4, maxRows: 10 }" placeholder="请è¾å
¥å¤æ³¨..."></el-input> |
|---|
| | | <div class="btn"> |
|---|
| | | <el-button type="primary" @click="auditClick" icon="Check">审æ¹</el-button> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div v-show="activeName == 'log'"> |
|---|
| | | <vol-table :tableData="tableData" :columns="columns" :height="height - 250" :pagination-hide="true" |
|---|
| | | :load-key="false" :text-inline="false" :ck="false"></vol-table> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </vol-box> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import VolTable from '@/components/basic/VolTable.vue'; |
|---|
| | | import VolBox from '@/components/basic/VolBox.vue'; |
|---|
| | | import http from '@/../src/api/http.js'; |
|---|
| | | import { defineComponent, ref, reactive, getCurrentInstance } from 'vue'; |
|---|
| | | export default defineComponent({ |
|---|
| | | components: { |
|---|
| | | VolTable, |
|---|
| | | VolBox |
|---|
| | | }, |
|---|
| | | props: { |
|---|
| | | option: { //çævueæ件çtableåæ° |
|---|
| | | type: Object, |
|---|
| | | default: { |
|---|
| | | key: '', |
|---|
| | | cnName: '', |
|---|
| | | name: '', |
|---|
| | | url: "" |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | setup(props, { emit }) { |
|---|
| | | const height = ref(500); |
|---|
| | | const width = ref(820); |
|---|
| | | const model = ref(false) |
|---|
| | | const workFlowSteps = reactive([]); |
|---|
| | | |
|---|
| | | const hasFlow = ref(false) |
|---|
| | | const formData = reactive([]); |
|---|
| | | |
|---|
| | | const auditParam = reactive({ |
|---|
| | | //å®¡æ ¸å¯¹è±¡ |
|---|
| | | rows: 0, //å½åéä¸å®¡æ ¸çè¡æ° |
|---|
| | | model: false, //å®¡æ ¸å¼¹åºæ¡ |
|---|
| | | value: -1, //å®¡æ ¸ç»æ |
|---|
| | | reason: '', //å®¡æ ¸åå |
|---|
| | | //å®¡æ ¸é项(main.jséé¢å¯ä»¥æ·»å å
¶ä»é项) |
|---|
| | | data: [] |
|---|
| | | }) |
|---|
| | | const { proxy } = getCurrentInstance(); |
|---|
| | | auditParam.data = proxy.$global.audit.data; |
|---|
| | | const tableData = reactive([]); |
|---|
| | | const columns = reactive([ |
|---|
| | | { title: 'èç¹', field: 'stepName', width: 100 }, |
|---|
| | | { title: '审æ¹äºº', field: 'auditor', width: 80 }, |
|---|
| | | { title: '审æ¹ç»æ', field: 'auditStatus', width: 70, bind: { data: [] } }, |
|---|
| | | { title: '审æ¹æ¶é´', field: 'auditDate', width: 145 }, |
|---|
| | | { title: 'å¤æ³¨', field: 'remark', width: 120 } |
|---|
| | | ]); |
|---|
| | | |
|---|
| | | const isCurrentUser = ref(null); |
|---|
| | | const activeName = ref('audit') |
|---|
| | | |
|---|
| | | const auditDic = reactive([]); |
|---|
| | | const getAuditStatus = (key) => { |
|---|
| | | return (auditDic.find(x => { return x.key === key + '' }) || { value: key }).value; |
|---|
| | | } |
|---|
| | | const rowLen = ref(0) |
|---|
| | | let currentRows = [] |
|---|
| | | const getAuditInfo = (option) => { |
|---|
| | | const table = option.table; //props.option.url.replaceAll('/', ''); |
|---|
| | | const url = `api/Sys_WorkFlow/getSteps?tableName=${table}` |
|---|
| | | // let ids = currentRows.map(x => { return x[props.option.key] }); |
|---|
| | | let ids = currentRows.map(x => { return x[option.key] }); |
|---|
| | | // ['498043c1-fbd0-4a35-a870-523823912a9b'] |
|---|
| | | http.post(url, ids, true).then(result => { |
|---|
| | | if (!result.status) { |
|---|
| | | proxy.$message.error(result.message); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | |
|---|
| | | hasFlow.value = !!(result.list || []).length; |
|---|
| | | if (!hasFlow.value) { |
|---|
| | | |
|---|
| | | let auditStatus = Object.keys(currentRows[0]).find(x => { return x.toLowerCase() === 'auditstatus' }); |
|---|
| | | |
|---|
| | | let checkStatus = currentRows.every((x) => { |
|---|
| | | return proxy.$global.audit.status.some(c => { return c === x[auditStatus] || !x[auditStatus] }) |
|---|
| | | }); |
|---|
| | | if (!checkStatus) { |
|---|
| | | proxy.$message.error('åªè½éæ©å¾
审æ¹æå®¡æ ¸ä¸çæ°æ®'); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | rowLen.value = currentRows.length; |
|---|
| | | model.value = true; |
|---|
| | | width.value = 430; |
|---|
| | | height.value = 330; |
|---|
| | | isCurrentUser.value = true; |
|---|
| | | //没æ审æ¹æµç¨çæ°æ®åªæ¾ç¤º |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | model.value = true; |
|---|
| | | height.value = document.body.clientHeight * 0.95; |
|---|
| | | width.value = 820; |
|---|
| | | if (!auditDic.length) { |
|---|
| | | auditDic.push(...(result.auditDic || [])) |
|---|
| | | columns.forEach(item => { |
|---|
| | | if (item.field == 'auditStatus') { |
|---|
| | | item.bind.data = auditDic; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | isCurrentUser.value = result.list.some(x => { return x.isCurrentUser }) |
|---|
| | | workFlowSteps.length = 0; |
|---|
| | | workFlowSteps.push(...result.list); |
|---|
| | | tableData.length = 0; |
|---|
| | | tableData.push(...result.log) |
|---|
| | | formData.length = 0; |
|---|
| | | formData.push(...(result.form || [])) |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | // |
|---|
| | | |
|---|
| | | const auditClick = () => { |
|---|
| | | if (auditParam.value == -1) { |
|---|
| | | proxy.$message.error('请éæ©å®¡æ¹é¡¹'); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (!isFlow.value) { |
|---|
| | | emit("auditClick", auditParam, currentRows, (result) => { |
|---|
| | | if (result.status) { |
|---|
| | | model.value = false; |
|---|
| | | tableData.length = 0; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | //æçæµç¨ä¸ç¹å»å®¡æ¹ |
|---|
| | | //ä¿åå®¡æ ¸ |
|---|
| | | let keys = currentRows.map(x => { return x[currentOption.key] }); |
|---|
| | | let url = `api/${currentOption.table}/audit?auditReason=${auditParam.reason}&auditStatus=${auditParam.value}` |
|---|
| | | http.post(url, keys, 'å®¡æ ¸ä¸....').then((x) => { |
|---|
| | | if (!x.status) { |
|---|
| | | proxy.$message.error(x.message); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | model.value = false; |
|---|
| | | proxy.$parent.search() |
|---|
| | | proxy.$message.success(x.message) |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | const isFlow = ref(false); |
|---|
| | | let currentOption = {}; |
|---|
| | | const open = (rows, flow) => { |
|---|
| | | isFlow.value = !!flow; |
|---|
| | | currentRows = rows; |
|---|
| | | activeName.value = 'audit' |
|---|
| | | auditParam.reason = ''; |
|---|
| | | auditParam.value = -1; |
|---|
| | | |
|---|
| | | if (flow) { |
|---|
| | | currentOption = { |
|---|
| | | table: rows[0].WorkTable, |
|---|
| | | key: "WorkTableKey"// rows[0].WorkTableKey |
|---|
| | | } |
|---|
| | | } else { |
|---|
| | | currentOption = { |
|---|
| | | table: props.option.url.replaceAll('/', ''), |
|---|
| | | key: props.option.key |
|---|
| | | } |
|---|
| | | } |
|---|
| | | getAuditInfo(currentOption); |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | return { |
|---|
| | | columns, |
|---|
| | | height, |
|---|
| | | width, |
|---|
| | | model, |
|---|
| | | workFlowSteps, |
|---|
| | | getAuditInfo, |
|---|
| | | getAuditStatus, |
|---|
| | | activeName, |
|---|
| | | reactive, |
|---|
| | | tableData, |
|---|
| | | auditParam, |
|---|
| | | auditClick, |
|---|
| | | open, |
|---|
| | | isCurrentUser, |
|---|
| | | hasFlow, |
|---|
| | | rowLen, |
|---|
| | | formData, |
|---|
| | | isFlow |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .audit-model-content { |
|---|
| | | padding: 10px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .step-item { |
|---|
| | | background: #fff; |
|---|
| | | display: flex; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .left-item { |
|---|
| | | min-width: 180px; |
|---|
| | | text-align: right; |
|---|
| | | padding-right: 25px; |
|---|
| | | padding-top: 8px; |
|---|
| | | |
|---|
| | | .left-date { |
|---|
| | | font-size: 13px; |
|---|
| | | padding-top: 7px; |
|---|
| | | color: #6c6c6c; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .right-item { |
|---|
| | | cursor: pointer; |
|---|
| | | position: relative; |
|---|
| | | border-bottom: 1px solid #f3f3f3; |
|---|
| | | padding: 5px 0 5px 5px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .left-item, |
|---|
| | | .right-item { |
|---|
| | | padding-bottom: 10px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .right-item:last-child { |
|---|
| | | border-bottom: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .step-line { |
|---|
| | | top: 16px; |
|---|
| | | left: -10px; |
|---|
| | | width: 1px; |
|---|
| | | height: 100%; |
|---|
| | | position: absolute; |
|---|
| | | background-color: #ebedf0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .step-circle { |
|---|
| | | position: absolute; |
|---|
| | | top: 17px; |
|---|
| | | left: -9px; |
|---|
| | | z-index: 2; |
|---|
| | | font-size: 12px; |
|---|
| | | line-height: 1; |
|---|
| | | transform: translate(-50%, -50%); |
|---|
| | | width: 7px; |
|---|
| | | height: 7px; |
|---|
| | | background-color: #a1a1a1; |
|---|
| | | border-radius: 50%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .right-item::before { |
|---|
| | | content: ''; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .step-content { |
|---|
| | | padding-top: 2px; |
|---|
| | | font-size: 14px; |
|---|
| | | color: #828282; |
|---|
| | | line-height: 1.5; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .step-title { |
|---|
| | | font-weight: bold; |
|---|
| | | padding-top: 3px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .step-text { |
|---|
| | | font-size: 13px; |
|---|
| | | color: #999999; |
|---|
| | | padding-top: 6px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .step-current { |
|---|
| | | * { |
|---|
| | | color: #2f95ff !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .step-circle { |
|---|
| | | background: #2f95ff !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | // border-radius: 5px; |
|---|
| | | // border: 1px solid #d6eaff; |
|---|
| | | font-size: 13px; |
|---|
| | | padding-top: 6px; |
|---|
| | | // background-color: #eff7ffd9; |
|---|
| | | color: black; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .audit-content { |
|---|
| | | // background: #f9f9f9; |
|---|
| | | padding: 10px; |
|---|
| | | border-radius: 4px; |
|---|
| | | display: flex; |
|---|
| | | |
|---|
| | | .fx-left { |
|---|
| | | flex: 1; |
|---|
| | | width: 0; |
|---|
| | | |
|---|
| | | .rd { |
|---|
| | | display: flex; |
|---|
| | | align-items: baseline; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .fx-right { |
|---|
| | | // width: 400px; |
|---|
| | | |
|---|
| | | .btn { |
|---|
| | | margin-top: 10px; |
|---|
| | | text-align: center; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .cell-item { |
|---|
| | | font-weight: 500; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .desc-top { |
|---|
| | | padding: 5px 10px 0 10px; |
|---|
| | | } |
|---|
| | | .step-item-ad{ |
|---|
| | | *{ |
|---|
| | | color: #9f9898 !important; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | export default { |
|---|
| | | initViewColumns(isReset) { |
|---|
| | | //åå§åèªå®åé
ç½® |
|---|
| | | if (isReset) { |
|---|
| | | this.resetViewColumns(); |
|---|
| | | } |
|---|
| | | if (!this.orginColumnFields) { |
|---|
| | | this.orginColumnFields = this.columns.map((c) => { |
|---|
| | | return c.field; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | this.viewColumns = this.columns |
|---|
| | | .filter((c) => { |
|---|
| | | return !c.hidden && !c.render; |
|---|
| | | }) |
|---|
| | | .map((c) => { |
|---|
| | | return { field: c.field, title: c.title, show: !c.hidden }; |
|---|
| | | }); |
|---|
| | | if (isReset) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | this.getCacheViewColumn(); |
|---|
| | | }, |
|---|
| | | getViewCacheKey(){ |
|---|
| | | return 'custom:column'+this.table.name; |
|---|
| | | }, |
|---|
| | | getCacheViewColumn() { |
|---|
| | | try { |
|---|
| | | let columns = localStorage.getItem(this.getViewCacheKey()); |
|---|
| | | if (!columns) return; |
|---|
| | | columns = JSON.parse(columns); |
|---|
| | | if (columns.some(x=>{return !this.viewColumns.some(c=> {return c.field==x.field})})|| |
|---|
| | | this.viewColumns.some(x=>{return !columns.some(c=> {return c.field==x.field})}) |
|---|
| | | ) { |
|---|
| | | localStorage.removeItem(this.getViewCacheKey()) |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | let sortTableColumns = []; |
|---|
| | | //å¼¹åºæ¡çå |
|---|
| | | let _viewColumns = []; |
|---|
| | | columns.forEach((column) => { |
|---|
| | | let _column = this.viewColumns.find((c) => { |
|---|
| | | return c.field == column.field; |
|---|
| | | }); |
|---|
| | | if (_column) { |
|---|
| | | _column.show = column.show; |
|---|
| | | _viewColumns.push(_column); |
|---|
| | | } |
|---|
| | | let tableColumn = this.columns.find((c) => { |
|---|
| | | return c.field == column.field; |
|---|
| | | }); |
|---|
| | | if (tableColumn) { |
|---|
| | | tableColumn.hidden = !column.show; |
|---|
| | | sortTableColumns.push(tableColumn); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | //éæ°æçå¼¹åºæ¡èªå®ä¹å |
|---|
| | | let otherColumns = this.viewColumns.filter((c) => { |
|---|
| | | return !_viewColumns.some((s) => { |
|---|
| | | return c.field == s.field; |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | //éæ°æçå¼¹åºæ¡èªå®ä¹å |
|---|
| | | _viewColumns.push(...otherColumns); |
|---|
| | | this.viewColumns.splice(0); |
|---|
| | | this.viewColumns.push(..._viewColumns); |
|---|
| | | |
|---|
| | | this.sortViewColumns(sortTableColumns); |
|---|
| | | } catch (error) { |
|---|
| | | console.log('设置é»è®¤èªå®ä¹åå¼å¸¸:' + error.message); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | sortViewColumns(sortColumns) { |
|---|
| | | if (sortColumns.length) { |
|---|
| | | let hiddenColumns = this.columns.filter((c) => { |
|---|
| | | return !sortColumns.some((s) => { |
|---|
| | | return c.field == s.field; |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | sortColumns.push(...hiddenColumns); |
|---|
| | | this.columns.splice(0); |
|---|
| | | this.columns.push(...sortColumns); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | resetViewColumns() { |
|---|
| | | if (!this.orginColumnFields) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | let _columns = []; |
|---|
| | | this.orginColumnFields.forEach((x) => { |
|---|
| | | _columns.push( |
|---|
| | | this.columns.find((c) => { |
|---|
| | | return c.field == x; |
|---|
| | | }) |
|---|
| | | ); |
|---|
| | | }); |
|---|
| | | let otherColumns = this.columns.filter((c) => { |
|---|
| | | return !this.orginColumnFields.some((s) => { |
|---|
| | | return c.field == s; |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | _columns.push(...otherColumns); |
|---|
| | | this.columns.splice(0); |
|---|
| | | this.columns.push(..._columns); |
|---|
| | | }, |
|---|
| | | showCustomModel() { |
|---|
| | | if (!this.viewColumns.length) { |
|---|
| | | this.initViewColumns(); |
|---|
| | | } |
|---|
| | | this.viewColumnsClone = JSON.parse(JSON.stringify(this.viewColumns)); |
|---|
| | | this.viewModel = true; |
|---|
| | | }, |
|---|
| | | closeCustomModel() { |
|---|
| | | this.viewModel=false; |
|---|
| | | if (this.checkColumnChanged()) { |
|---|
| | | this.viewColumns = JSON.parse(JSON.stringify(this.viewColumnsClone)); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | checkColumnChanged() { |
|---|
| | | return ( |
|---|
| | | JSON.stringify(this.viewColumns) != JSON.stringify(this.viewColumnsClone) |
|---|
| | | ); |
|---|
| | | }, |
|---|
| | | saveColumnConfig() { |
|---|
| | | let hasShowColumn = this.viewColumns.some((x) => { |
|---|
| | | return x.show; |
|---|
| | | }); |
|---|
| | | if (!hasShowColumn) { |
|---|
| | | return this.$message.error('è³å°éæ©ä¸åæ¾ç¤º'); |
|---|
| | | } |
|---|
| | | this.viewModel = false; |
|---|
| | | if (this.checkColumnChanged()) { |
|---|
| | | let sortColumns = []; |
|---|
| | | this.viewColumns.forEach((column) => { |
|---|
| | | let _column = this.columns.find((c) => { |
|---|
| | | return c.field == column.field; |
|---|
| | | }); |
|---|
| | | if (_column) { |
|---|
| | | _column.hidden = !column.show; |
|---|
| | | sortColumns.push(_column); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | this.sortViewColumns(sortColumns); |
|---|
| | | } |
|---|
| | | try { |
|---|
| | | localStorage.setItem(this.getViewCacheKey(), JSON.stringify(this.viewColumns)); |
|---|
| | | } catch (error) { |
|---|
| | | console.log('è·åèªå®ä¹åå¼å¸¸:' + error.message); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <el-alert |
|---|
| | | title="æå¨ååå¯è°æ´è¡¨æ ¼åæ¾ç¤ºé¡ºåº" |
|---|
| | | type="success" |
|---|
| | | :show-icon="false" |
|---|
| | | > |
|---|
| | | </el-alert> |
|---|
| | | <div class="view-column view-column-title"> |
|---|
| | | <div class="view-column-index">#</div> |
|---|
| | | <div class="view-column-left">åå</div> |
|---|
| | | <div class="view-column-right">æ¯å¦æ¾ç¤º</div> |
|---|
| | | </div> |
|---|
| | | <draggable |
|---|
| | | class="list-group" |
|---|
| | | tag="transition-group" |
|---|
| | | :component-data="componentData" |
|---|
| | | :list="viewColumns" |
|---|
| | | v-bind="dragOptions" |
|---|
| | | item-key="order" |
|---|
| | | > |
|---|
| | | <transition-group class="drag-center-item"> |
|---|
| | | <div |
|---|
| | | class="view-column" |
|---|
| | | v-for="(column, index) in viewColumns" |
|---|
| | | :key="index" |
|---|
| | | > |
|---|
| | | <div class="view-column-index">{{ index + 1 }}</div> |
|---|
| | | <div class="view-column-left">{{ column.title }}</div> |
|---|
| | | <div class="view-column-right"> |
|---|
| | | <el-checkbox v-model="column.show"> |
|---|
| | | <div style="height: 100%; width: 250px"></div |
|---|
| | | ></el-checkbox> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </transition-group> |
|---|
| | | </draggable> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import { VueDraggableNext } from 'vue-draggable-next'; |
|---|
| | | import { defineComponent, ref, reactive } from 'vue'; |
|---|
| | | |
|---|
| | | export default defineComponent({ |
|---|
| | | props: { |
|---|
| | | viewColumns: { |
|---|
| | | type: Array, |
|---|
| | | default: () => { |
|---|
| | | return []; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | components: { |
|---|
| | | draggable: VueDraggableNext |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return {}; |
|---|
| | | }, |
|---|
| | | setup(props, context) { |
|---|
| | | const dragOptions = reactive({ |
|---|
| | | animation: 200, |
|---|
| | | group: 'description', |
|---|
| | | disabled: false, |
|---|
| | | ghostClass: 'ghost' |
|---|
| | | }); |
|---|
| | | const componentData = reactive({ |
|---|
| | | tag: 'ul', |
|---|
| | | type: 'transition-group' |
|---|
| | | }); |
|---|
| | | return { dragOptions, componentData }; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .view-column { |
|---|
| | | cursor: pointer; |
|---|
| | | display: flex; |
|---|
| | | padding: 10px; |
|---|
| | | border-bottom: 1px solid #f3f3f3; |
|---|
| | | .view-column-index { |
|---|
| | | width: 50px; |
|---|
| | | } |
|---|
| | | .view-column-left { |
|---|
| | | width: 120px; |
|---|
| | | padding: 0 10px; |
|---|
| | | } |
|---|
| | | .view-column-right { |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .view-column-title { |
|---|
| | | font-weight: bold; |
|---|
| | | } |
|---|
| | | .view-column:last-child { |
|---|
| | | border-bottom: 0; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | //ä»è¡¨æ¹æ³ |
|---|
| | | let detailMethods = { |
|---|
| | | //æ¥è¯¢ä»è¡¨åå
åå
é¨å¤ç |
|---|
| | | loadInternalDetailTableBefore(param, callBack) { |
|---|
| | | //å è½½æç»è¡¨æ°æ®ä¹å,éè¦è®¾å®æ¥è¯¢ç主表çID |
|---|
| | | //æ¯æ¬¡åªè¦å è½½æç»è¡¨æ ¼æ°æ®å°±éç½®å é¤æç»çå¼ |
|---|
| | | if (this.detailOptions.delKeys.length > 0) { |
|---|
| | | this.detailOptions.delKeys = []; |
|---|
| | | } |
|---|
| | | let key = this.table.key; |
|---|
| | | if (this.currentRow && this.currentRow.hasOwnProperty(key)) { |
|---|
| | | param.value = this.currentRow[key]; |
|---|
| | | } |
|---|
| | | return this.loadDetailTableBefore(param, callBack); |
|---|
| | | }, |
|---|
| | | detailRowOnChange(row) { |
|---|
| | | this.detailRowChange(row); |
|---|
| | | }, |
|---|
| | | detailRowChange(row) { |
|---|
| | | //checkboxéä¸è¡äºä»¶ |
|---|
| | | }, |
|---|
| | | detailRowOnClick({ row, column, event }) { |
|---|
| | | //æç»è¡¨ç¹å»è¡äºä»¶2020.11.07 |
|---|
| | | this.detailRowClick({ row, column, event }); |
|---|
| | | }, |
|---|
| | | detailRowClick({ row, column, event }) {}, |
|---|
| | | resetDetailTable(row) { |
|---|
| | | //ç¼è¾åæ¥çæç»æ¶éç½®ä»è¡¨æ°æ® |
|---|
| | | if (!this.detailOptions.columns || this.detailOptions.columns.length == 0) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | let key = this.table.key; |
|---|
| | | let query = { value: row ? row[key] : this.currentRow[key] }; |
|---|
| | | this.$nextTick(() => { |
|---|
| | | if (this.$refs.detail) { |
|---|
| | | this.$refs.detail.reset(); |
|---|
| | | this.$refs.detail.load(query); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | //ä»åé¢å è½½ä»è¡¨æ°æ® |
|---|
| | | refreshRow() { |
|---|
| | | this.resetDetailTable(); |
|---|
| | | }, |
|---|
| | | addRow() { |
|---|
| | | this.$refs.detail.addRow({}); |
|---|
| | | this.$refs.detail.edit.rowIndex=-1; |
|---|
| | | this.updateDetailTableSummaryTotal(); |
|---|
| | | }, |
|---|
| | | delRow() { |
|---|
| | | let rows = this.$refs.detail.getSelected(); |
|---|
| | | if (!rows || rows.length == 0) { |
|---|
| | | return this.$message.error('请éæ©è¦å é¤çè¡!'); |
|---|
| | | } |
|---|
| | | if (!this.delDetailRow(rows)) { |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | |
|---|
| | | let tigger = false; |
|---|
| | | this.$confirm('确认è¦å é¤éæ©çæ°æ®å?', 'è¦å', { |
|---|
| | | confirmButtonText: 'ç¡®å®', |
|---|
| | | cancelButtonText: 'åæ¶', |
|---|
| | | type: 'warning', |
|---|
| | | center: true |
|---|
| | | }).then(() => { |
|---|
| | | if (tigger) return; |
|---|
| | | tigger = true; |
|---|
| | | rows = this.$refs.detail.delRow(); |
|---|
| | | let key = this.detailOptions.key; |
|---|
| | | //è®°å½å é¤çè¡æ°æ® |
|---|
| | | rows.forEach((x) => { |
|---|
| | | if (x.hasOwnProperty(key) && x[key]) { |
|---|
| | | this.detailOptions.delKeys.push(x[key]); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | this.updateDetailTableSummaryTotal(); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | updateDetailTableSummaryTotal() { |
|---|
| | | //2021.09.25å¢å æç»è¡¨å é¤ãä¿®æ¹æ¶éæ°è®¡ç®è¡æ°ä¸æ±æ» |
|---|
| | | //2021.12.12å¢å æç»è¡¨å¤æ(强å¶å·æ°å计æ¶ä¼ç¨å°) |
|---|
| | | if (!this.$refs.detail) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | //å é¤ææ°å¢è¡æ¶éæ°è®¾ç½®æ¾ç¤ºçæ»è¡æ° |
|---|
| | | this.$refs.detail.paginations.total = this.$refs.detail.rowData.length; |
|---|
| | | //éæ°è®¾ç½®å计 |
|---|
| | | if (this.$refs.detail.summary) { |
|---|
| | | this.$refs.detail.columns.forEach((column) => { |
|---|
| | | if (column.summary) { |
|---|
| | | this.$refs.detail.getInputSummaries(null, null, null, column); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | detailSelectable(row, index){ |
|---|
| | | //æç»è¡¨CheckBox æ¯å¦å¯ä»¥å¾é |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | |
|---|
| | | export default detailMethods; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | import Grid from './ViewGrid.vue' |
|---|
| | | const ViewGrid = { |
|---|
| | | install: function (app) { |
|---|
| | | app.component('ViewGrid', Grid) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | export default ViewGrid |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | import detailMethods from './detailMethods.js'; |
|---|
| | | //ä¸å¡å¤çæ¹æ³,å
¨é¨å¯ä»¥ç±å¼åè¦ç |
|---|
| | | import serviceFilter from './serviceFilter.js'; |
|---|
| | | let methods = { |
|---|
| | | //å½æ·»å æ©å±ç»ä»¶gridHeader/gridBody/gridFooteråæç»modelHeader/modelBody/modelFooteræ¶ï¼ |
|---|
| | | //å¦æè¦è·åç¶çº§Vue对象,请使ç¨æ¤æ¹æ³è¿è¡åè° |
|---|
| | | parentCall(fun) { |
|---|
| | | if (typeof fun != 'function') { |
|---|
| | | return console.log('æ©å±ç»ä»¶éè¦ä¼ å
¥ä¸ä¸ªåè°æ¹æ³æè½è·åç¶çº§Vue对象'); |
|---|
| | | } |
|---|
| | | fun(this); |
|---|
| | | }, |
|---|
| | | getCurrentAction() { |
|---|
| | | if (this.currentReadonly) { |
|---|
| | | return ''; |
|---|
| | | } |
|---|
| | | return '--' + (this.currentAction == this.const.ADD ? 'æ°å¢' : 'ç¼è¾'); |
|---|
| | | }, |
|---|
| | | quickSearchKeyPress($event) { |
|---|
| | | //æ¥è¯¢å段为inputæ¶ï¼æå车æ¥è¯¢ |
|---|
| | | if ($event.keyCode == 13) { |
|---|
| | | if (this.searchFormFields[this.singleSearch.field] != '') { |
|---|
| | | this.search(); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | getButtons() { |
|---|
| | | //çæViewGridçé¢çæä½æé®åæ´å¤é项 |
|---|
| | | let searchIndex = this.buttons.findIndex((x) => { |
|---|
| | | return x.value == 'Search'; |
|---|
| | | }); |
|---|
| | | //æ·»å é«çº§æ¥è¯¢ |
|---|
| | | let hasOneFormItem = |
|---|
| | | this.searchFormOptions.length == 1 && |
|---|
| | | this.searchFormOptions[0].length == 1; |
|---|
| | | if (searchIndex != -1 && !hasOneFormItem) { |
|---|
| | | this.buttons.splice(searchIndex + 1, 0, { |
|---|
| | | icon: this.fiexdSearchForm ? 'el-icon-refresh-left' : 'el-icon-search', |
|---|
| | | name: this.fiexdSearchForm ? 'éç½®' : 'é«çº§æ¥è¯¢', |
|---|
| | | plain: true, |
|---|
| | | type: this.buttons[searchIndex].type, |
|---|
| | | onClick: () => { |
|---|
| | | if (this.fiexdSearchForm) { |
|---|
| | | return this.resetSearch(); |
|---|
| | | } |
|---|
| | | this.searchBoxShow = !this.searchBoxShow; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | if (hasOneFormItem) { |
|---|
| | | this.fiexdSearchForm = false; |
|---|
| | | } |
|---|
| | | this.maxBtnLength += searchIndex == -1 ? 0 : 1; |
|---|
| | | // if (this.buttons.length <= this.maxBtnLength) { |
|---|
| | | // return this.buttons; |
|---|
| | | // } |
|---|
| | | // let btns = this.buttons.slice(0, this.maxBtnLength); |
|---|
| | | // btns[this.maxBtnLength - 1].last = true; |
|---|
| | | // return btns; |
|---|
| | | }, |
|---|
| | | extendBtn(btns, source) { |
|---|
| | | //btnsæéæé®ï¼source为æ©å±æé® |
|---|
| | | if (!btns || !(source && source instanceof Array)) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | //sourceéè¿å¨è¡¨çæ©å±jsæ件ä¸buttons对åºæé®çå±æ§indexå³å®æé®ææ¾ä½ç½® |
|---|
| | | source.forEach((x) => { |
|---|
| | | //éè¿æé®çIndexå±æ§ï¼æ¾å°æå®çä½ç½® |
|---|
| | | btns.splice(x.index == undefined ? btns.length : x.index, 0, x); |
|---|
| | | }); |
|---|
| | | // if (this.extend.buttons.view) { |
|---|
| | | // this.extend.buttons.view.forEach((x) => { |
|---|
| | | // //éè¿æé®çIndexå±æ§ï¼æ¾å°æå®çä½ç½® |
|---|
| | | // this.buttons.splice(x.index == undefined ? this.buttons.length : x.index, 0, x); |
|---|
| | | // }) |
|---|
| | | // } |
|---|
| | | }, |
|---|
| | | initBoxButtons() { |
|---|
| | | //åå§åViewGirdä¸å¼¹åºæ¡/æç»è¡¨æé® |
|---|
| | | let path = this.$route.path; |
|---|
| | | //éè¿èåè·åç¨æ·æ对åºèåéè¦æ¾ç¤ºçæé® |
|---|
| | | let permissionButtons = this.permission.getButtons( |
|---|
| | | path, |
|---|
| | | null, |
|---|
| | | this.extend.tableAction, |
|---|
| | | this.table.name |
|---|
| | | ); |
|---|
| | | if (permissionButtons) { |
|---|
| | | //2020.03.31æ·»å æ·±æ·è´æé®ç» |
|---|
| | | permissionButtons.forEach((p) => { |
|---|
| | | let _obj = {}; |
|---|
| | | for (const key in p) { |
|---|
| | | _obj[key] = p[key]; |
|---|
| | | } |
|---|
| | | this.buttons.push(_obj); |
|---|
| | | }); |
|---|
| | | // this.buttons.push(...permissionButtons); |
|---|
| | | } |
|---|
| | | if (!this.extend) { |
|---|
| | | this.extend = {}; |
|---|
| | | } |
|---|
| | | if (!this.extend.buttons) { |
|---|
| | | this.extend.buttons = {}; |
|---|
| | | } |
|---|
| | | //æ¥è¯¢çé¢æ©å±æé®(æ©å±æé®å¯èªè¡éè¿è®¾ç½®æé®çIndexå±æ§æ¾ç¤ºå°å
·ä½ä½ç½®) |
|---|
| | | if (this.extend.buttons.view) { |
|---|
| | | this.extendBtn(this.buttons, this.extend.buttons.view); |
|---|
| | | } |
|---|
| | | |
|---|
| | | //å¼¹åºæ¡æé® |
|---|
| | | let boxButtons = []; |
|---|
| | | |
|---|
| | | let saveBtn = this.buttons.some((x) => { |
|---|
| | | if ( |
|---|
| | | x.value && |
|---|
| | | (x.value.toLowerCase() == this.const.ADD.toLowerCase() || |
|---|
| | | x.value.toLowerCase() == this.const.EDIT.toLowerCase()) |
|---|
| | | ) |
|---|
| | | return true; |
|---|
| | | }); |
|---|
| | | this.currentReadonly = !saveBtn; |
|---|
| | | //ä»è¡¨è¡¨æ ¼æä½æé® |
|---|
| | | let detailGridButtons = { |
|---|
| | | name: 'å·æ°', |
|---|
| | | type: 'info', |
|---|
| | | icon: 'el-icon-refresh', |
|---|
| | | onClick() { |
|---|
| | | //å¦ææç»è¡¨å½åçç¶æ为æ°å»ºæ¶ï¼ç¦æ¢å·æ° |
|---|
| | | if (this.currentAction == this.const.ADD) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | this.refreshRow(); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | |
|---|
| | | let importExcel = this.buttons.some((x) => { |
|---|
| | | if (x.value == this.const.IMPORT) return true; |
|---|
| | | }); |
|---|
| | | //å¦ææ导å
¥æé,åéè¦åå§å导å
¥ç»ä»¶ |
|---|
| | | if (importExcel) { |
|---|
| | | this.upload.url = this.getUrl(this.const.IMPORT); |
|---|
| | | //å®ä¹ä¸è½½æ¨¡æ¿çæ件å |
|---|
| | | this.upload.template.fileName = this.table.cnName; |
|---|
| | | //å®ä¹ä¸è½½æ¨¡æ¿çUrlè·¯å¾ |
|---|
| | | this.upload.template.url = |
|---|
| | | this.http.ipAddress + this.getUrl(this.const.DOWNLOADTEMPLATE, true); |
|---|
| | | } |
|---|
| | | |
|---|
| | | // disabled |
|---|
| | | //å¦æå½åè§è²æ²¡æç¼è¾ææ°å»ºåè½ï¼æ¥çæç»æ¶å段设置å
¨é¨åªè¯» |
|---|
| | | //åªææç»è¡¨ï¼å°æç»è¡¨ä¹è®¾ç½®ä¸ºä¸å¯è½ç¼è¾ï¼å¹¶ä¸ä¸æ¾ç¤ºæ·»å è¡ãå é¤è¡ |
|---|
| | | if (!saveBtn) { |
|---|
| | | this.editFormOptions.forEach((row) => { |
|---|
| | | row.forEach((x) => { |
|---|
| | | x.disabled = true; |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | //没ææ°å¢ç¼è¾æéçï¼å¼¹åºæ¡é½è®¾ç½®ä¸ºåªè¯» |
|---|
| | | this.detail.columns.forEach((column) => { |
|---|
| | | if (column.hasOwnProperty('edit')) { |
|---|
| | | column.readonly = true; |
|---|
| | | // row['edit'] = false; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | //å¼¹åºæ¡æ©å±æé® |
|---|
| | | this.extendBtn(boxButtons, this.extend.buttons.box); |
|---|
| | | //å¼¹åºå¼¹æ¡æé®(2020.04.21),没æç¼è¾ææ°å»ºæéæ¶ï¼ä¹å¯ä»¥éè¿buttonså±æ§æ·»å èªå®ä¹å¼¹åºæ¡æé® |
|---|
| | | this.boxButtons.push(...boxButtons); |
|---|
| | | this.detailOptions.buttons.push(detailGridButtons); |
|---|
| | | this.detailOptions.buttons.forEach((button) => { |
|---|
| | | if (!button.hasOwnProperty('hidden')) { |
|---|
| | | button.hidden = false; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | //å¼¹åºæ¡æ©å±æç»è¡¨æé® |
|---|
| | | this.extendBtn(this.detailOptions.buttons, this.extend.buttons.detail); |
|---|
| | | |
|---|
| | | return boxButtons; |
|---|
| | | } |
|---|
| | | |
|---|
| | | this.detailOptions.edit = true; |
|---|
| | | boxButtons.push( |
|---|
| | | ...[ |
|---|
| | | { |
|---|
| | | name: 'ä¿ å', |
|---|
| | | icon: 'el-icon-check', |
|---|
| | | type: 'danger', |
|---|
| | | disabled: false, |
|---|
| | | value: 'save', |
|---|
| | | onClick() { |
|---|
| | | this.save(); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | // { |
|---|
| | | // name: 'é ç½®', |
|---|
| | | // icon: 'el-icon-refresh-right', |
|---|
| | | // type: 'primary', |
|---|
| | | // disabled: false, |
|---|
| | | // onClick() { |
|---|
| | | // this.resetEdit(); |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | ] |
|---|
| | | ); |
|---|
| | | //ä»è¡¨è¡¨æ ¼æä½æé® |
|---|
| | | this.detailOptions.buttons.push( |
|---|
| | | ...[ |
|---|
| | | { |
|---|
| | | name: 'æ·»å è¡', |
|---|
| | | icon: 'el-icon-plus', |
|---|
| | | type: 'primary', |
|---|
| | | hidden: false, |
|---|
| | | plain: true, |
|---|
| | | onClick() { |
|---|
| | | this.addRow(); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | type: 'danger', |
|---|
| | | plain: true, |
|---|
| | | name: 'å é¤è¡', |
|---|
| | | hidden: false, |
|---|
| | | icon: 'el-icon-delete', |
|---|
| | | onClick() { |
|---|
| | | this.delRow(); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | //2022.01.08å¢å æç»è¡¨å¯¼å
¥å¯¼åºåè½ |
|---|
| | | //注æéè¦éååå°æç»è¡¨æ¥å£ç导å
¥ä¸ä¸è½½æ¨¡æ¿ã导åºçæé,Sys_DictionaryListController.cs/SellOrderListController.cs |
|---|
| | | { |
|---|
| | | type: 'danger', |
|---|
| | | plain: true, |
|---|
| | | name: '导å
¥', |
|---|
| | | value: 'import', |
|---|
| | | hidden: false, |
|---|
| | | icon: 'el-icon-upload2', |
|---|
| | | onClick() { |
|---|
| | | this.upload.url = `${this.http.ipAddress}api/${this.detail.table}/${this.const.IMPORT}?table=1`; |
|---|
| | | this.upload.template.url = `${this.http.ipAddress}api/${this.detail.table}/${this.const.DOWNLOADTEMPLATE}`; |
|---|
| | | //å®ä¹ä¸è½½æ¨¡æ¿çæ件å |
|---|
| | | this.upload.template.fileName = this.detail.cnName; |
|---|
| | | this.upload.excel = true; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | type: 'danger', |
|---|
| | | plain: true, |
|---|
| | | name: '导åº', |
|---|
| | | value: 'export', |
|---|
| | | icon: 'el-icon-download', |
|---|
| | | hidden: false, |
|---|
| | | onClick() { |
|---|
| | | this.export(true); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | ); |
|---|
| | | this.detailOptions.buttons.forEach((button) => { |
|---|
| | | if (button.hasOwnProperty('hidden')) { |
|---|
| | | button.hidden = false; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | //å¼¹åºæ¡æ©å±æé® |
|---|
| | | this.extendBtn(boxButtons, this.extend.buttons.box); |
|---|
| | | |
|---|
| | | //å¼¹åºæ¡æ©å±æç»è¡¨æé® |
|---|
| | | this.detailOptions.buttons.push(detailGridButtons); |
|---|
| | | this.extendBtn(this.detailOptions.buttons, this.extend.buttons.detail); |
|---|
| | | |
|---|
| | | //å¼¹åºå¼¹æ¡æé® |
|---|
| | | this.boxButtons.push(...boxButtons); |
|---|
| | | }, |
|---|
| | | onClick(click) { |
|---|
| | | click.apply(this); |
|---|
| | | }, |
|---|
| | | changeDropdown(btnName, v1) { |
|---|
| | | let button = this.buttons.filter((x) => { |
|---|
| | | return x.name == btnName; |
|---|
| | | }); |
|---|
| | | if (button && button.length > 0) { |
|---|
| | | button[0].onClick.apply(this); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | emptyValue(value) { |
|---|
| | | if (typeof value == 'string' && value.trim() === '') { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | if (value instanceof Array && !value.length) { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | return value === null || value === undefined || value === ''; |
|---|
| | | }, |
|---|
| | | getSearchParameters() { |
|---|
| | | //è·åæ¥è¯¢åæ° |
|---|
| | | // 2020.09.11å¢å åºå®æ¥è¯¢è¡¨å,å¦æ设置åºå®äºæ¥è¯¢è¡¨åï¼ç¹å»æ¥è¯¢æ¶ï¼ä¸åå
³é |
|---|
| | | if (!this.fiexdSearchForm) { |
|---|
| | | this.searchBoxShow = false; |
|---|
| | | } |
|---|
| | | |
|---|
| | | let query = { wheres: [] }; |
|---|
| | | for (const key in this.searchFormFields) { |
|---|
| | | let value = this.searchFormFields[key]; |
|---|
| | | if (this.emptyValue(value)) continue; |
|---|
| | | |
|---|
| | | if (typeof value == 'number') { |
|---|
| | | value = value + ''; |
|---|
| | | } |
|---|
| | | let displayType = this.getSearchItem(key); |
|---|
| | | |
|---|
| | | //è级åªä¿çéä¸èç¹çæåä¸ä¸ªå¼ |
|---|
| | | if (displayType == 'cascader') { |
|---|
| | | //æ¥è¯¢ä¸é¢ææçåèç¹ï¼å¦ï¼éä¸çæ¯ç¶èç¹ï¼åºè¯¥æ¥è¯¢ä¸é¢ææçèç¹æ°æ®--å¾
å® |
|---|
| | | value = value.length ? value[value.length - 1] + '' : ''; |
|---|
| | | } |
|---|
| | | //2021.05.02å¢å åºé´æ¥è¯¢ |
|---|
| | | if ( |
|---|
| | | typeof value == 'string' || |
|---|
| | | ['date', 'datetime', 'range'].indexOf(displayType) == -1 |
|---|
| | | ) { |
|---|
| | | query.wheres.push({ |
|---|
| | | name: key, |
|---|
| | | value: |
|---|
| | | typeof value == 'string' ? (value + '').trim() : value.join(','), |
|---|
| | | displayType: displayType |
|---|
| | | }); |
|---|
| | | continue; |
|---|
| | | } |
|---|
| | | for (let index = 0; index < value.length; index++) { |
|---|
| | | if (!this.emptyValue(value[index])) { |
|---|
| | | query.wheres.push({ |
|---|
| | | name: key, |
|---|
| | | value: (value[index] + '').trim(), |
|---|
| | | displayType: (() => { |
|---|
| | | if (['date', 'datetime', 'range'].indexOf(displayType) != -1) { |
|---|
| | | return index ? 'lessorequal' : 'thanorequal'; |
|---|
| | | } |
|---|
| | | return displayType; |
|---|
| | | })() |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | return query; |
|---|
| | | }, |
|---|
| | | search() { |
|---|
| | | //æ¥è¯¢ |
|---|
| | | // let query = this.getSearchParameters(); |
|---|
| | | // this.$refs.table.load(query, true); |
|---|
| | | this.$refs.table.load(null, true); |
|---|
| | | }, |
|---|
| | | loadTableBefore(param, callBack) { |
|---|
| | | //æ¥è¯¢å设置æ¥è¯¢æ¡ä»¶ååé¡µä¿¡æ¯ |
|---|
| | | let query = this.getSearchParameters(); |
|---|
| | | if (query) { |
|---|
| | | param = Object.assign(param, query); |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (this.$route.query.viewflow && this.$route.query.id) { |
|---|
| | | param.wheres.push({ |
|---|
| | | name: this.table.key, |
|---|
| | | value: this.$route.query.id |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | // if (this.isViewFlow() && data && data.length) { |
|---|
| | | // let query = JSON.parse(JSON.stringify(this.$route.query)); |
|---|
| | | // query.viewflow = 0; |
|---|
| | | // this.$router.replace({ path: this.$route.path, query: query }); |
|---|
| | | // this.$nextTick(() => { |
|---|
| | | // this.getWorkFlowSteps(data[0]); |
|---|
| | | // }); |
|---|
| | | // } |
|---|
| | | let status = this.searchBefore(param); |
|---|
| | | callBack(status); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | loadTableAfter(data, callBack, result) { |
|---|
| | | //æ¥è¯¢å |
|---|
| | | //2020.10.30å¢å æ¥è¯¢åè¿åææçæ¥è¯¢ä¿¡æ¯ |
|---|
| | | let status = this.searchAfter(data, result); |
|---|
| | | callBack(status); |
|---|
| | | //èªå¨å¼¹åºæ¡å®¡æ¹è¯¦æ
|
|---|
| | | }, |
|---|
| | | loadDetailTableBefore(param, callBack) { |
|---|
| | | //æç»æ¥è¯¢å |
|---|
| | | //æ°å»ºæ¶ç¦æ¢å è½½æç» |
|---|
| | | if (this.currentAction == this.const.ADD) { |
|---|
| | | callBack(false); |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | let status = this.searchDetailBefore(param); |
|---|
| | | callBack(status); |
|---|
| | | }, |
|---|
| | | loadDetailTableAfter(data, callBack) { |
|---|
| | | //æç»æ¥è¯¢å |
|---|
| | | let status = this.searchDetailAfter(data); |
|---|
| | | callBack(status); |
|---|
| | | }, |
|---|
| | | getSearchItem(field) { |
|---|
| | | //è·åæ¥è¯¢çåæ° |
|---|
| | | let data; |
|---|
| | | for (let index = 0; index < this.searchFormOptions.length; index++) { |
|---|
| | | if (data) return data.type; |
|---|
| | | const item = this.searchFormOptions[index]; |
|---|
| | | data = item.find((x) => { |
|---|
| | | return x.field == field; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | |
|---|
| | | return (data || {}).type; |
|---|
| | | }, |
|---|
| | | resetSearch() { |
|---|
| | | //éç½®æ¥è¯¢å¯¹è±¡ |
|---|
| | | this.resetSearchForm(); |
|---|
| | | //2020.10.17å¢å éç½®åæ¹æ³ |
|---|
| | | this.resetSearchFormAfter && this.resetSearchFormAfter(); |
|---|
| | | }, |
|---|
| | | resetEdit() { |
|---|
| | | //éç½®ç¼è¾çæ°æ® |
|---|
| | | let isEdit = this.currentAction != this.const.ADD; |
|---|
| | | //éç½®ä¹å |
|---|
| | | if (!this[isEdit ? 'resetUpdateFormBefore' : 'resetAddFormBefore']()) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | let objKey = {}; |
|---|
| | | //ç¼è¾ç¶æä¸,ä¸éè¦é置主é®,å建æ¶é´å建人 |
|---|
| | | if (isEdit) { |
|---|
| | | objKey[this.table.key] = this.editFormFields[this.table.key]; |
|---|
| | | } |
|---|
| | | this.resetEditForm(objKey); |
|---|
| | | //éç½®ä¹å |
|---|
| | | |
|---|
| | | if (!this[isEdit ? 'resetUpdateFormAfter' : 'resetAddFormAfter']()) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | resetSearchForm(sourceObj) { |
|---|
| | | //éç½®æ¥è¯¢è¡¨ |
|---|
| | | this.resetForm('searchForm', sourceObj); |
|---|
| | | }, |
|---|
| | | resetEditForm(sourceObj) { |
|---|
| | | if (this.hasDetail && this.$refs.detail) { |
|---|
| | | // this.$refs.detail.rowData.splice(0); |
|---|
| | | this.$refs.detail.reset(); |
|---|
| | | } |
|---|
| | | this.resetForm('form', sourceObj); |
|---|
| | | if (this.$refs.form && this.$refs.form.$refs.volform) { |
|---|
| | | setTimeout(() => { |
|---|
| | | this.$refs.form.$refs.volform.clearValidate(); |
|---|
| | | }, 100); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | getKeyValueType(formData, isEditForm) { |
|---|
| | | try { |
|---|
| | | let keyLeft = (isEditForm ? 'e' : 's') + '_b_'; |
|---|
| | | formData.forEach((item) => { |
|---|
| | | item.forEach((x) => { |
|---|
| | | if (this.keyValueType.hasOwnProperty(keyLeft + x.field)) { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | let data; |
|---|
| | | if (x.type == 'switch') { |
|---|
| | | this.keyValueType[x.field] = 1; |
|---|
| | | } else if (x.bind && x.bind.data) { |
|---|
| | | data = x.bind.data; |
|---|
| | | } else if (x.data) { |
|---|
| | | if (x.data instanceof Array) { |
|---|
| | | data = x.data; |
|---|
| | | } else if (x.data.data && x.data.data instanceof Array) { |
|---|
| | | data = x.data.data; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | if ( |
|---|
| | | data && |
|---|
| | | data.length > 0 && |
|---|
| | | !this.keyValueType.hasOwnProperty(x.field) |
|---|
| | | ) { |
|---|
| | | this.keyValueType[x.field] = data[0].key; |
|---|
| | | this.keyValueType[keyLeft + x.field] = x.type; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | } catch (error) { |
|---|
| | | console.log(error.message); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | resetForm(formName, sourceObj) { |
|---|
| | | // return; |
|---|
| | | //é置表åæ°æ® |
|---|
| | | if (this.$refs[formName]) { |
|---|
| | | this.$refs[formName].reset(); |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (!sourceObj) return; |
|---|
| | | let form, keyLeft; |
|---|
| | | if (formName == 'searchForm') { |
|---|
| | | form = this.searchFormFields; |
|---|
| | | keyLeft = 's' + '_b_'; |
|---|
| | | } else { |
|---|
| | | form = this.editFormFields; |
|---|
| | | keyLeft = 'e' + '_b_'; |
|---|
| | | } |
|---|
| | | //è·åæ°æ®æºçdataç±»åï¼å¦åå¦ææ°æ®æºdataçkeyæ¯æ°åï¼éç½®çå¼æ¯å符串就æ æ³ç»å®å¼ |
|---|
| | | if (!this.keyValueType._dinit) { |
|---|
| | | this.getKeyValueType(this.editFormOptions, true); |
|---|
| | | this.getKeyValueType(this.searchFormOptions, false); |
|---|
| | | this.keyValueType._dinit = true; |
|---|
| | | } |
|---|
| | | var _cascaderParentTree; |
|---|
| | | for (const key in form) { |
|---|
| | | if (sourceObj.hasOwnProperty(key)) { |
|---|
| | | let newVal = sourceObj[key]; |
|---|
| | | let kv_type = this.keyValueType[keyLeft + key]; |
|---|
| | | |
|---|
| | | if ( |
|---|
| | | kv_type == 'selectList' || |
|---|
| | | kv_type == 'checkbox' || |
|---|
| | | kv_type == 'cascader' || |
|---|
| | | kv_type == 'treeSelect' |
|---|
| | | ) { |
|---|
| | | // 2020.05.31å¢å iviewç»ä»¶Cascader |
|---|
| | | // 2020.11.01å¢å iviewç»ä»¶Cascader表åéç½®æ¶æ¥è¯¢ææçç¶èç¹ |
|---|
| | | if (kv_type == 'cascader' || kv_type == 'treeSelect') { |
|---|
| | | var treeDic = this.dicKeys.find((dic) => { |
|---|
| | | return dic.fileds && dic.fileds.indexOf(key) != -1; |
|---|
| | | }); |
|---|
| | | |
|---|
| | | if (treeDic && treeDic.orginData && treeDic.orginData.length) { |
|---|
| | | let keyIsNum = typeof treeDic.orginData[0].id == 'number'; |
|---|
| | | |
|---|
| | | if (kv_type == 'cascader') { |
|---|
| | | newVal = keyIsNum ? newVal * 1 || 0 : newVal + ''; |
|---|
| | | if (kv_type == 'cascader') { |
|---|
| | | _cascaderParentTree = this.base.getTreeAllParent( |
|---|
| | | newVal, |
|---|
| | | treeDic.orginData |
|---|
| | | ); |
|---|
| | | if (_cascaderParentTree) { |
|---|
| | | newVal = _cascaderParentTree.map((x) => { |
|---|
| | | return x.id; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } else { |
|---|
| | | if (newVal === null || newVal === undefined) { |
|---|
| | | newVal = []; |
|---|
| | | } else if (typeof newVal == 'string') { |
|---|
| | | newVal = newVal.split(','); |
|---|
| | | } |
|---|
| | | if (keyIsNum) { |
|---|
| | | if (Array.isArray(newVal)) { |
|---|
| | | newVal = newVal.map((x) => { |
|---|
| | | return x * 1 || 0; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } else if (typeof newVal == 'number') { |
|---|
| | | newVal = [newVal + '']; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } else { |
|---|
| | | newVal = [newVal]; |
|---|
| | | } |
|---|
| | | } else if ( |
|---|
| | | newVal != '' && |
|---|
| | | newVal != undefined && |
|---|
| | | typeof newVal == 'string' |
|---|
| | | ) { |
|---|
| | | newVal = newVal.split(','); |
|---|
| | | } else if (kv_type == 'checkbox') { |
|---|
| | | newVal = []; |
|---|
| | | } |
|---|
| | | } else if ( |
|---|
| | | this.keyValueType.hasOwnProperty(key) && |
|---|
| | | typeof this.keyValueType[key] == 'number' && |
|---|
| | | newVal * 1 == newVal |
|---|
| | | ) { |
|---|
| | | newVal = newVal * 1; |
|---|
| | | } else { |
|---|
| | | if (newVal == null || newVal == undefined) { |
|---|
| | | newVal = ''; |
|---|
| | | } else if (this.numberFields.indexOf(key) != -1) { |
|---|
| | | newVal = newVal * 1 || 0; |
|---|
| | | } else { |
|---|
| | | newVal += ''; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | if (newVal instanceof Array) { |
|---|
| | | if (form[key]) { |
|---|
| | | form[key] = []; |
|---|
| | | } |
|---|
| | | form[key] = newVal; |
|---|
| | | } else { |
|---|
| | | form[key] = newVal; |
|---|
| | | } |
|---|
| | | } else { |
|---|
| | | form[key] = form[key] instanceof Array ? [] : ''; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | onBtnClick(param) { |
|---|
| | | this[param.method](param.data); |
|---|
| | | }, |
|---|
| | | refresh() { |
|---|
| | | //å·æ° |
|---|
| | | this.search(); |
|---|
| | | // this.$refs.table.load(); |
|---|
| | | }, |
|---|
| | | saveBefore(formData) { |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | saveAfter(formData, result) { |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | save() { |
|---|
| | | //æ°å¢æç¼è¾æ¶ä¿å |
|---|
| | | // if (!this.$refs.form.validate()) return; |
|---|
| | | this.$refs.form.validate((result) => { |
|---|
| | | if (result) { |
|---|
| | | this.saveExecute(); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | async saveExecute() { |
|---|
| | | let editFormFields = {}; |
|---|
| | | //ä¸ä¼ æ件以éå·éå¼ |
|---|
| | | for (const key in this.editFormFields) { |
|---|
| | | if ( |
|---|
| | | this.uploadfiled && |
|---|
| | | this.uploadfiled.length > 0 && |
|---|
| | | this.uploadfiled.indexOf(key) != -1 && |
|---|
| | | this.editFormFields[key] instanceof Array |
|---|
| | | ) { |
|---|
| | | let allPath = this.editFormFields[key].map((x) => { |
|---|
| | | return x.path; |
|---|
| | | }); |
|---|
| | | editFormFields[key] = allPath.join(','); |
|---|
| | | } else if (typeof this.editFormFields[key] == 'function') { |
|---|
| | | try { |
|---|
| | | editFormFields[key] = this.editFormFields[key](); |
|---|
| | | } catch (error) { } |
|---|
| | | } else { |
|---|
| | | //2021.05.30ä¿®å¤ä¸ææ¡æ¸
é¤æ°æ®ååå°ä¸è½ä¿åçé®é¢ |
|---|
| | | if ( |
|---|
| | | this.editFormFields[key] === undefined && |
|---|
| | | this.dicKeys.some((x) => { |
|---|
| | | return x.fileds && x.fileds.indexOf(key) != -1; |
|---|
| | | }) |
|---|
| | | ) { |
|---|
| | | editFormFields[key] = null; |
|---|
| | | } else { |
|---|
| | | editFormFields[key] = this.editFormFields[key]; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | //å°æ°ç»è½¬æ¢æstring |
|---|
| | | //2020.11.01å¢å 级èå¤ç |
|---|
| | | for (const key in editFormFields) { |
|---|
| | | if (editFormFields[key] instanceof Array) { |
|---|
| | | var iscascader = this.dicKeys.some((x) => { |
|---|
| | | return ( |
|---|
| | | x.type == 'cascader' && x.fileds && x.fileds.indexOf(key) != -1 |
|---|
| | | ); |
|---|
| | | }); |
|---|
| | | if (iscascader && editFormFields[key].length) { |
|---|
| | | editFormFields[key] = |
|---|
| | | editFormFields[key][editFormFields[key].length - 1]; |
|---|
| | | } else { |
|---|
| | | editFormFields[key] = editFormFields[key].join(','); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | let formData = { |
|---|
| | | mainData: editFormFields, |
|---|
| | | detailData: null, |
|---|
| | | delKeys: null |
|---|
| | | }; |
|---|
| | | |
|---|
| | | //è·åæç»æ°æ®(åå°æ°æ®æç»æªåæ ¡éªï¼å¾
å®.åå°å·²ç»æ ¡éª) |
|---|
| | | if (this.hasDetail) { |
|---|
| | | formData.detailData = this.$refs.detail.rowData; |
|---|
| | | let _fields = this.detail.columns |
|---|
| | | .filter((c) => { |
|---|
| | | return ( |
|---|
| | | c.type == 'selectList' || (c.edit && c.edit.type == 'selectList') |
|---|
| | | ); |
|---|
| | | }) |
|---|
| | | .map((c) => { |
|---|
| | | return c.field; |
|---|
| | | }); |
|---|
| | | //2022.06.20å¢å ä¿åæ¶å¯¹æç»è¡¨ä¸ææ¡å¤éçå¤æ |
|---|
| | | if (_fields.length) { |
|---|
| | | formData.detailData = JSON.parse(JSON.stringify(formData.detailData)); |
|---|
| | | formData.detailData.forEach((row) => { |
|---|
| | | for (let index = 0; index < _fields.length; index++) { |
|---|
| | | const _field = _fields[index]; |
|---|
| | | if (Array.isArray(row[_field])) { |
|---|
| | | row[_field] = row[_field].join(','); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | if (this.detailOptions.delKeys.length > 0) { |
|---|
| | | formData.delKeys = this.detailOptions.delKeys; |
|---|
| | | } |
|---|
| | | //ä¿ååæ¦æª |
|---|
| | | let _currentIsAdd = this.currentAction == this.const.ADD; |
|---|
| | | if (_currentIsAdd) { |
|---|
| | | //2020.12.06å¢å æ°å»ºåå¼æ¥å¤çæ¹æ³ |
|---|
| | | //2021.08.16ä¿®å¤å¼æ¥è¯æ³åéçé®é¢ |
|---|
| | | if (!this.addBefore(formData) || !(await this.addBeforeAsync(formData))) |
|---|
| | | return; |
|---|
| | | } else { |
|---|
| | | //2020.12.06å¢å ä¿®æ¹åå¼æ¥å¤çæ¹æ³ |
|---|
| | | if ( |
|---|
| | | !this.updateBefore(formData) || |
|---|
| | | !(await this.updateBeforeAsync(formData)) |
|---|
| | | ) |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | let url = this.getUrl(this.currentAction); |
|---|
| | | this.http.post(url, formData, true).then((x) => { |
|---|
| | | //ä¿åå |
|---|
| | | if (_currentIsAdd) { |
|---|
| | | if (!this.addAfter(x)) return; |
|---|
| | | //è¿ç»æ·»å |
|---|
| | | if (this.continueAdd && x.status) { |
|---|
| | | this.$success(x.message); |
|---|
| | | //æ°å»º |
|---|
| | | this.currentAction = this.const.ADD; |
|---|
| | | this.currentRow = {}; |
|---|
| | | this.resetAdd(); |
|---|
| | | this.refresh(); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | } else { |
|---|
| | | if (!this.updateAfter(x)) return; |
|---|
| | | } |
|---|
| | | if (!x.status) return this.$error(x.message); |
|---|
| | | this.$success(x.message || 'æä½æå'); |
|---|
| | | //å¦æä¿åæååéè¦å
³éç¼è¾æ¡ï¼ç´æ¥è¿åä¸å¤çåé¢ |
|---|
| | | if (this.boxOptions.saveClose) { |
|---|
| | | this.boxModel = false; |
|---|
| | | //2020.12.27å¦ææ¯ç¼è¾ä¿ååä¸éç½®å页页æ°ï¼å·æ°é¡µé¢æ¶è¿æ¯æ¾ç¤ºå½å页çæ°æ® |
|---|
| | | this.$refs.table.load(null, _currentIsAdd); |
|---|
| | | //this.refresh(); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | let resultRow; |
|---|
| | | if (typeof x.data == 'string' && x.data != '') { |
|---|
| | | resultRow = JSON.parse(x.data); |
|---|
| | | } else { |
|---|
| | | resultRow = x.data; |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (this.currentAction == this.const.ADD) { |
|---|
| | | // this.currentRow=x.data; |
|---|
| | | this.editFormFields[this.table.key] = ''; |
|---|
| | | this.currentAction = this.const.EDIT; |
|---|
| | | this.currentRow = resultRow.data; |
|---|
| | | } |
|---|
| | | this.resetEditForm(resultRow.data); |
|---|
| | | // console.log(resultRow); |
|---|
| | | if (this.hasDetail) { |
|---|
| | | this.detailOptions.delKeys = []; |
|---|
| | | if (resultRow.list) { |
|---|
| | | this.$refs.detail.rowData.push(...resultRow.list); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | this.$refs.table.load(null, _currentIsAdd); |
|---|
| | | // this.refresh(); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | del(rows) { |
|---|
| | | if (rows) { |
|---|
| | | if (!(rows instanceof Array)) { |
|---|
| | | rows = [rows]; |
|---|
| | | } |
|---|
| | | } else { |
|---|
| | | rows = this.$refs.table.getSelected(); |
|---|
| | | } |
|---|
| | | //å é¤æ°æ® |
|---|
| | | |
|---|
| | | if (!rows || rows.length == 0) return this.$error('请éæ©è¦å é¤çè¡!'); |
|---|
| | | let delKeys = rows.map((x) => { |
|---|
| | | return x[this.table.key]; |
|---|
| | | }); |
|---|
| | | if (!delKeys || delKeys.length == 0) |
|---|
| | | return this.$error('没æè·åè¦å é¤çè¡æ°æ®!'); |
|---|
| | | //å é¤å |
|---|
| | | if (!this.delBefore(delKeys, rows)) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | let tigger = false; |
|---|
| | | this.$confirm('确认è¦å é¤éæ©çæ°æ®å?', 'è¦å', { |
|---|
| | | confirmButtonText: 'ç¡®å®', |
|---|
| | | cancelButtonText: 'åæ¶', |
|---|
| | | type: 'warning', |
|---|
| | | center: true |
|---|
| | | }).then(() => { |
|---|
| | | if (tigger) return; |
|---|
| | | tigger = true; |
|---|
| | | let url = this.getUrl(this.const.DEL); |
|---|
| | | this.http.post(url, delKeys, 'æ£å¨å é¤æ°æ®....').then((x) => { |
|---|
| | | if (!x.status) return this.$error(x.message); |
|---|
| | | this.$success(x.message); |
|---|
| | | //å é¤å |
|---|
| | | if (!this.delAfter(x)) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | this.refresh(); |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | async modelOpenBeforeAsync(row) { |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | async initBox() { |
|---|
| | | //2022.01.08å¢å æ°å»ºæ¶éèæç»è¡¨å¯¼åºåè½ |
|---|
| | | this.detailOptions.buttons.forEach((x) => { |
|---|
| | | if (x.value == 'export') { |
|---|
| | | x.hidden = this.currentAction == 'Add'; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | //åå§åæ°å»ºãç¼è¾çå¼¹åºæ¡ |
|---|
| | | if (!(await this.modelOpenBeforeAsync(this.currentRow))) return false; |
|---|
| | | this.modelOpenBefore(this.currentRow); |
|---|
| | | if (!this.boxInit) { |
|---|
| | | this.boxInit = true; |
|---|
| | | this.boxModel = true; |
|---|
| | | // this.detailUrl = this.url; |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | setEditForm(row) { |
|---|
| | | // if (this.remoteColumns.length == 0 || !rows || rows.length == 0) return; |
|---|
| | | let remoteColumns = this.$refs.table.remoteColumns; |
|---|
| | | remoteColumns.forEach((column) => { |
|---|
| | | this.editFormOptions.forEach((option) => { |
|---|
| | | option.forEach((x) => { |
|---|
| | | if (x.field == column.field) { |
|---|
| | | x.data.data = Object.assign([], x.data, column.bind.data); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | this.editFormFields; |
|---|
| | | //éç½®ç¼è¾è¡¨åæ°æ® |
|---|
| | | this.editFormFields[this.table.key] = row[this.table.key]; |
|---|
| | | |
|---|
| | | this.resetEditForm(row); |
|---|
| | | this.currentAction = this.const.EDIT; |
|---|
| | | this.boxModel = true; |
|---|
| | | }, |
|---|
| | | async linkData(row, column) { |
|---|
| | | this.boxOptions.title = this.table.cnName + '(ç¼è¾)'; |
|---|
| | | //ç¹å»tableåå
æ ¼å¿«æ·é¾æ¥æ¾ç¤ºç¼è¾æ°æ® |
|---|
| | | this.currentAction = this.const.EDIT; |
|---|
| | | this.currentRow = row; |
|---|
| | | if (!(await this.initBox())) return; |
|---|
| | | this.resetDetailTable(row); |
|---|
| | | this.setEditForm(row); |
|---|
| | | this.setContinueAdd(false); |
|---|
| | | //设置è¿ç¨æ¥è¯¢è¡¨åçé»è®¤key/value |
|---|
| | | this.getRemoteFormDefaultKeyValue(); |
|---|
| | | //ç¹å»ç¼è¾æé®å¼¹åºæ¡åï¼å¯ä»¥å¨æ¤å¤åé»è¾ï¼å¦ï¼ä»åå°è·åæ°æ® |
|---|
| | | this.modelOpenProcess(row); |
|---|
| | | }, |
|---|
| | | setContinueAdd(isAdd) { |
|---|
| | | if (!this.continueAdd) return; |
|---|
| | | var _button = this.boxButtons.find((x) => { |
|---|
| | | return x.value == 'save'; |
|---|
| | | }); |
|---|
| | | if (_button) { |
|---|
| | | _button.name = isAdd ? this.continueAddName : 'ä¿ å'; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | resetAdd() { |
|---|
| | | if (this.hasDetail) { |
|---|
| | | this.$refs.detail && |
|---|
| | | // this.$refs.detail.rowData && |
|---|
| | | this.$refs.detail.reset(); |
|---|
| | | } |
|---|
| | | let obj = {}; |
|---|
| | | //å¦ææswitchæ ç¾ï¼é»è®¤é½è®¾ç½®ä¸ºå¦ |
|---|
| | | this.editFormOptions.forEach((x) => { |
|---|
| | | x.forEach((item) => { |
|---|
| | | if (item.type == 'switch') { |
|---|
| | | obj[item.field] = 0; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | this.resetEditForm(obj); |
|---|
| | | }, |
|---|
| | | async add() { |
|---|
| | | this.boxOptions.title = this.table.cnName + '(æ°å»º)'; |
|---|
| | | //æ°å»º |
|---|
| | | this.currentAction = this.const.ADD; |
|---|
| | | this.currentRow = {}; |
|---|
| | | if (!(await this.initBox())) return; |
|---|
| | | |
|---|
| | | this.resetAdd(); |
|---|
| | | this.setContinueAdd(true); |
|---|
| | | // this.resetEditForm(); |
|---|
| | | this.boxModel = true; |
|---|
| | | //ç¹å»æ°å»ºæé®å¼¹åºæ¡åï¼å¯ä»¥å¨æ¤å¤åé»è¾ï¼å¦ï¼ä»åå°è·åæ°æ® |
|---|
| | | this.modelOpenProcess(); |
|---|
| | | // this.modelOpenAfter(); |
|---|
| | | }, |
|---|
| | | async edit(rows) { |
|---|
| | | this.boxOptions.title = 'ç¼è¾'; |
|---|
| | | //ç¼è¾ |
|---|
| | | this.currentAction = this.const.EDIT; |
|---|
| | | if (rows) { |
|---|
| | | if (!(rows instanceof Array)) { |
|---|
| | | rows = [rows]; |
|---|
| | | } |
|---|
| | | } else { |
|---|
| | | rows = this.$refs.table.getSelected(); |
|---|
| | | } |
|---|
| | | if (rows.length == 0) { |
|---|
| | | return this.$error('请éæ©è¦ç¼è¾çè¡!'); |
|---|
| | | } |
|---|
| | | if (rows.length != 1) { |
|---|
| | | return this.$error('åªè½éæ©ä¸è¡æ°æ®è¿è¡ç¼è¾!'); |
|---|
| | | } |
|---|
| | | //è®°å½å½åç¼è¾çè¡ |
|---|
| | | this.currentRow = rows[0]; |
|---|
| | | //åå§åå¼¹åºæ¡ |
|---|
| | | if (!(await this.initBox())) return; |
|---|
| | | this.setContinueAdd(false); |
|---|
| | | //é置表å |
|---|
| | | this.resetDetailTable(); |
|---|
| | | |
|---|
| | | //设置å½åçæ°æ®å°è¡¨åä¸ |
|---|
| | | this.setEditForm(rows[0]); |
|---|
| | | //设置è¿ç¨æ¥è¯¢è¡¨åçé»è®¤key/value |
|---|
| | | this.getRemoteFormDefaultKeyValue(); |
|---|
| | | //ç¹å»ç¼è¾æé®å¼¹åºæ¡åï¼å¯ä»¥å¨æ¤å¤åé»è¾ï¼å¦ï¼ä»åå°è·åæ°æ® |
|---|
| | | this.modelOpenProcess(rows[0]); |
|---|
| | | // this.modelOpenAfter(rows[0]); |
|---|
| | | }, |
|---|
| | | getRemoteFormDefaultKeyValue() { |
|---|
| | | //设置表åè¿ç¨æ°æ®æºçé»è®¤key.value |
|---|
| | | if (this.currentAction != this.const.EDIT || this.remoteKeys.length == 0) |
|---|
| | | return; |
|---|
| | | this.editFormOptions.forEach((x, xIndex) => { |
|---|
| | | x.forEach((item, yIndex) => { |
|---|
| | | if (item.remote) { |
|---|
| | | let column = this.columns.find((x) => { |
|---|
| | | return x.bind && x.bind.key == item.dataKey; |
|---|
| | | }); |
|---|
| | | if (!column) return; |
|---|
| | | let key = this.currentRow[item.field]; |
|---|
| | | let obj = column.bind.data.find((x) => { |
|---|
| | | return x.key == key; |
|---|
| | | }); |
|---|
| | | // obj ? obj.value : keyå¦æ没ææ¥å°æ°æ®æºï¼ç´æ¥ä½¿ç¨åæ°æ® |
|---|
| | | item.data = [{ key: key, value: obj ? obj.value : key }]; |
|---|
| | | this.editFormOptions[xIndex].splice(yIndex, 1, item); |
|---|
| | | // this.$set(item, 'data', [{ key: key + '', value: obj.value }]) |
|---|
| | | // item.data = [{ key: key + '', value: obj.value }]; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | modelOpenProcess(row) { |
|---|
| | | this.$nextTick(() => { |
|---|
| | | this.modelOpenAfter(row); |
|---|
| | | }); |
|---|
| | | return; |
|---|
| | | // if (!this.$refs.form) { |
|---|
| | | // let timeOut = setTimeout(x => { |
|---|
| | | // this.modelOpenAfter(row); |
|---|
| | | // }, 500) |
|---|
| | | // return; |
|---|
| | | // } |
|---|
| | | // this.modelOpenAfter(row); |
|---|
| | | }, |
|---|
| | | import() { |
|---|
| | | //导å
¥(ä¸ä¼ excel),å¼¹åºå¯¼å
¥ç»ä»¶UploadExcel.vue |
|---|
| | | this.upload.excel = true; |
|---|
| | | this.$refs.upload_excel && this.$refs.upload_excel.reset(); |
|---|
| | | }, |
|---|
| | | download(url, fileName) { |
|---|
| | | //ä¸è½½å¯¼åºçæ件 |
|---|
| | | let xmlResquest = new XMLHttpRequest(); |
|---|
| | | xmlResquest.open('GET', url, true); |
|---|
| | | xmlResquest.setRequestHeader('Content-type', 'application/json'); |
|---|
| | | xmlResquest.setRequestHeader( |
|---|
| | | 'Authorization', |
|---|
| | | this.$store.getters.getToken() |
|---|
| | | ); |
|---|
| | | let elink = this.$refs.export; |
|---|
| | | xmlResquest.responseType = 'blob'; |
|---|
| | | xmlResquest.onload = function (oEvent) { |
|---|
| | | if (xmlResquest.status != 200) { |
|---|
| | | this.$error('ä¸è½½æ件åºéäº..'); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | let content = xmlResquest.response; |
|---|
| | | // let elink = this.$refs.export;//document.createElement("a"); |
|---|
| | | elink.download = fileName; //+".xlsx"; |
|---|
| | | // elink.style.display = "none"; |
|---|
| | | let blob = new Blob([content]); |
|---|
| | | elink.href = URL.createObjectURL(blob); |
|---|
| | | // document.body.appendChild(elink); |
|---|
| | | elink.click(); |
|---|
| | | // document.body.removeChild(elink); |
|---|
| | | }; |
|---|
| | | xmlResquest.send(); |
|---|
| | | }, |
|---|
| | | getFileName(isDetail) { |
|---|
| | | //2021.01.08å¢å 导åºexcelæ¶èªå®ä¹æ件å |
|---|
| | | if (isDetail) { |
|---|
| | | return this.detail.cnName + '.xlsx'; |
|---|
| | | } |
|---|
| | | return this.table.cnName + '.xlsx'; |
|---|
| | | }, |
|---|
| | | export(isDetail) { |
|---|
| | | //å¯¼åº |
|---|
| | | let url, query, param; |
|---|
| | | if (isDetail) { |
|---|
| | | //æç»è¡¨å¯¼åºæ¶å¦ææ¯æ°å»ºç¶æï¼ç¦æ¢å¯¼åº |
|---|
| | | if (this.currentAction == 'Add') { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | url = `api/${this.detail.table}/${this.const.EXPORT}`; |
|---|
| | | param = { |
|---|
| | | wheres: [ |
|---|
| | | { name: this.table.key, value: this.editFormFields[this.table.key] } |
|---|
| | | ] |
|---|
| | | }; |
|---|
| | | } else { |
|---|
| | | //ä¸»è¡¨å¯¼åº |
|---|
| | | url = this.getUrl(this.const.EXPORT); |
|---|
| | | query = this.getSearchParameters(); |
|---|
| | | param = { order: this.pagination.order, wheres: query.wheres || [] }; |
|---|
| | | } |
|---|
| | | //2020.06.25å¢å 导åºåå¤ç |
|---|
| | | if (!isDetail && !this.exportBefore(param)) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (param.wheres && typeof param.wheres == 'object') { |
|---|
| | | param.wheres = JSON.stringify(param.wheres); |
|---|
| | | } |
|---|
| | | let $http = this.http; |
|---|
| | | //2022.09.26å¢å èªå®ä¹å¯¼åºæ件å |
|---|
| | | let fileName = this.downloadFileName || this.getFileName(isDetail); |
|---|
| | | //2021.01.08ä¼å导åºåè½ |
|---|
| | | $http |
|---|
| | | .post(url, param, 'æ£å¨å¯¼åºæ°æ®....', { responseType: 'blob' }) |
|---|
| | | .then((content) => { |
|---|
| | | const blob = new Blob([content]); |
|---|
| | | if ('download' in document.createElement('a')) { |
|---|
| | | // éIEä¸è½½ |
|---|
| | | const elink = document.createElement('a'); |
|---|
| | | elink.download = fileName; |
|---|
| | | elink.style.display = 'none'; |
|---|
| | | elink.href = URL.createObjectURL(blob); |
|---|
| | | document.body.appendChild(elink); |
|---|
| | | elink.click(); |
|---|
| | | URL.revokeObjectURL(elink.href); |
|---|
| | | document.body.removeChild(elink); |
|---|
| | | } else { |
|---|
| | | // IE10+ä¸è½½ |
|---|
| | | navigator.msSaveBlob(blob, fileName); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | //.then(result => { |
|---|
| | | // if (!result.status) { |
|---|
| | | // return this.$error(result.message); |
|---|
| | | // } |
|---|
| | | // let path = this.getUrl(this.const.DOWNLOAD); |
|---|
| | | // path = path[0] == "/" ? path.substring(1) : path; |
|---|
| | | // this.download( |
|---|
| | | // $http.ipAddress + path + "?path=" + result.data, |
|---|
| | | // this.table.cnName + ".xlsx" // filePath |
|---|
| | | // ); |
|---|
| | | /// window.open($http.ipAddress + path + "?fileName=" + filePath, "_self"); |
|---|
| | | // }); |
|---|
| | | }, |
|---|
| | | getSelectRows() { |
|---|
| | | //è·åéä¸çè¡ |
|---|
| | | return this.$refs.table.getSelected(); |
|---|
| | | }, |
|---|
| | | getDetailSelectRows() { |
|---|
| | | //æè·åæç»éä¸çè¡ |
|---|
| | | if (!this.$refs.detail) { |
|---|
| | | return []; |
|---|
| | | } |
|---|
| | | return this.$refs.detail.getSelected(); |
|---|
| | | }, |
|---|
| | | audit() { |
|---|
| | | //å®¡æ ¸å¼¹åºæ¡ |
|---|
| | | let rows = this.$refs.table.getSelected(); |
|---|
| | | if (rows.length == 0) return this.$error('请éæ©è¦å®¡æ ¸çè¡!'); |
|---|
| | | let auditStatus = Object.keys(rows[0]).find(x => { return x.toLowerCase() === 'auditstatus' }); |
|---|
| | | if (!auditStatus) { |
|---|
| | | return this.$message.error(`表å¿
é¡»å
æ¬å®¡æ ¸å段ãAuditStatusã,并ä¸æ¯intç±»å`) |
|---|
| | | } |
|---|
| | | // let checkStatus = rows.every((x) => { |
|---|
| | | // return this.$global.audit.status.some(c => { return c === x[auditStatus] || !x[auditStatus] }) |
|---|
| | | // }); |
|---|
| | | // if (!checkStatus) return this.$error('åªè½éæ©å¾
审æ¹æå®¡æ ¸ä¸çæ°æ®!'); |
|---|
| | | this.$refs.audit.open(rows); |
|---|
| | | }, |
|---|
| | | saveAudit(params, rows, callback) { |
|---|
| | | |
|---|
| | | //ä¿åå®¡æ ¸ |
|---|
| | | let keys = rows.map(x => { return x[this.table.key] }); |
|---|
| | | if (!this.auditBefore(keys, rows)) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | let url = `${this.getUrl(this.const.AUDIT)}?auditReason=${params.reason}&auditStatus=${params.value}` |
|---|
| | | this.http.post(url, keys, 'å®¡æ ¸ä¸....').then((x) => { |
|---|
| | | if (!this.auditAfter(x, keys)) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | if (!x.status) return this.$error(x.message); |
|---|
| | | |
|---|
| | | callback && callback(x); |
|---|
| | | this.$success(x.message); |
|---|
| | | this.refresh(); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | viewModelCancel() { |
|---|
| | | //æ¥ç表ç»æ |
|---|
| | | this.viewModel = false; |
|---|
| | | }, |
|---|
| | | initFormOptions(formOptions, keys, formFields, isEdit) { |
|---|
| | | //åå§åæ¥è¯¢ãç¼è¾å¯¹è±¡çä¸ææ¡æ°æ®æºãå¾çä¸ä¼ é¾æ¥å°å |
|---|
| | | //let defaultOption = { key: "", value: "请éæ©" }; |
|---|
| | | //æä¸ä¼ çå段 |
|---|
| | | //2020.05.03æ°å¢ |
|---|
| | | //ç¼è¾æ°æ®æºçç±»å |
|---|
| | | formOptions.forEach((item) => { |
|---|
| | | item.forEach((d) => { |
|---|
| | | if (d.type == 'number') { |
|---|
| | | //2022.08.22ä¼å表åç±»å为numberæ¶çé»è®¤å¼ |
|---|
| | | if (formFields[d.field] === '') { |
|---|
| | | formFields[d.field] = undefined; |
|---|
| | | } |
|---|
| | | this.numberFields.push(d.field); |
|---|
| | | } |
|---|
| | | if ( |
|---|
| | | d.type == 'img' || |
|---|
| | | d.type == 'excel' || |
|---|
| | | d.type == 'file' || |
|---|
| | | d.columnType == 'img' |
|---|
| | | ) { |
|---|
| | | d.url = this.http.ipAddress + 'api' + this.table.url + 'Upload'; |
|---|
| | | this.uploadfiled.push(d.field); |
|---|
| | | } |
|---|
| | | if (!d.dataKey) return true; |
|---|
| | | //2022.02.20强å¶å¼å¯è级å¯ä»¥éæ©æ个èç¹ |
|---|
| | | if (d.type == 'cascader' && !d.hasOwnProperty('changeOnSelect')) { |
|---|
| | | //强å¶å¼å¯è级å¯ä»¥éæ©æ个èç¹ |
|---|
| | | d.changeOnSelect = true; |
|---|
| | | } |
|---|
| | | //å¼å¯è¿ç¨æç´¢ |
|---|
| | | if (d.remote) { |
|---|
| | | this.remoteKeys.push(d.dataKey); |
|---|
| | | d.data = []; //{ dicNo: d.dataKey, data: [] }; |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | //2020.05.03å¢å ç¼è¾è¡¨å对checkboxçæ¯æ |
|---|
| | | if (d.type == 'checkbox' && !(formFields[d.field] instanceof Array)) { |
|---|
| | | formFields[d.field] = []; |
|---|
| | | } |
|---|
| | | if (keys.indexOf(d.dataKey) == -1) { |
|---|
| | | //2020.05.03å¢å è®°å½ç¼è¾å段çæ°æ®æºç±»å |
|---|
| | | |
|---|
| | | keys.push(d.dataKey); |
|---|
| | | //2020.05.03ä¿®å¤æ¥è¯¢è¡¨åä¸ç¼è¾è¡¨åtypeç±»ååæ强ä¸è´æ§çé®é¢ |
|---|
| | | //this.dicKeys.push({ dicNo: d.dataKey, data: [], type: d.type }); |
|---|
| | | // 2020.11.01å¢å iviewç»ä»¶Cascaderæ°æ®æºåå¨ |
|---|
| | | let _dic = { |
|---|
| | | dicNo: d.dataKey, |
|---|
| | | data: [], |
|---|
| | | fileds: [d.field], |
|---|
| | | orginData: [] |
|---|
| | | }; |
|---|
| | | if (d.type == 'cascader') { |
|---|
| | | _dic.type = 'cascader'; |
|---|
| | | } |
|---|
| | | if (isEdit) { |
|---|
| | | _dic['e_type'] = d.type; |
|---|
| | | } |
|---|
| | | this.dicKeys.push(_dic); |
|---|
| | | } else if (d.type == 'cascader') { |
|---|
| | | this.dicKeys.forEach((x) => { |
|---|
| | | if (x.dicNo == d.dataKey) { |
|---|
| | | x.type = 'cascader'; |
|---|
| | | x.fileds.push(d.field); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | if (d.type != 'cascader') { |
|---|
| | | //2020.01.30移é¤å
é¨è¡¨åformOptionsæ°æ®æºé
ç½®æ ¼å¼data.dataï¼ææåæ°æ¹ä¸ºä¸ç»ä»¶apiæ ¼å¼ç¸å |
|---|
| | | Object.assign( |
|---|
| | | d, |
|---|
| | | this.dicKeys.filter((f) => { |
|---|
| | | return f.dicNo == d.dataKey; |
|---|
| | | })[0], |
|---|
| | | { type: d.type } |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | //åå§tableä¸æç»è¡¨çæ°æ®æºæådicKeys对象ï¼åå»åå°å è½½æ°æ®æº |
|---|
| | | initColumns(scoure, dicKeys, keys) { |
|---|
| | | if (!scoure || !(scoure instanceof Array)) return; |
|---|
| | | scoure.forEach((item) => { |
|---|
| | | if (!item.bind || (item.bind.data && item.bind.data.length > 0)) |
|---|
| | | return true; |
|---|
| | | let key = item.bind.key || item.bind.dicNo; |
|---|
| | | if (this.remoteKeys.indexOf(key) != -1) { |
|---|
| | | item.bind.remote = true; |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | if (this.hasKeyField.indexOf(item.field) == -1) { |
|---|
| | | this.hasKeyField.push(item.field); |
|---|
| | | } |
|---|
| | | var dic = dicKeys.filter((x) => { |
|---|
| | | return x.dicNo == key; |
|---|
| | | }); |
|---|
| | | if (!dic || dic.length == 0) { |
|---|
| | | dicKeys.push({ dicNo: key, data: [] }); |
|---|
| | | dic = [dicKeys[dicKeys.length - 1]]; |
|---|
| | | keys.push(key); |
|---|
| | | } |
|---|
| | | //2020.11.01å¢å 级èå¤ç |
|---|
| | | if (dic[0].type == 'cascader' || dic[0].type == 'treeSelect') { |
|---|
| | | item.bind = { data: dic[0].orginData, type: 'select', key: key }; |
|---|
| | | } else { |
|---|
| | | item.bind = dic[0]; |
|---|
| | | } |
|---|
| | | //2020.05.03ä¼åtableæ°æ®æºcheckboxä¸selectç±»åä»ç¼è¾åä¸éå |
|---|
| | | item.bind.type = item.bind.e_type || 'string'; |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | bindOptions(dic) { |
|---|
| | | //ç»å®ä¸ææ¡çæ°æ®æº |
|---|
| | | //ç»å®åå°çåå
¸æ°æ® |
|---|
| | | dic.forEach((d) => { |
|---|
| | | if (d.data.length >= (this.select2Count || 500)) { |
|---|
| | | if ( |
|---|
| | | !this.dicKeys.some((x) => { |
|---|
| | | return ( |
|---|
| | | x.dicNo == d.dicNo && |
|---|
| | | (x.type == 'cascader' || x.type == 'treeSelect') |
|---|
| | | ); |
|---|
| | | }) |
|---|
| | | ) { |
|---|
| | | d.data.forEach((item) => { |
|---|
| | | item.label = item.value; |
|---|
| | | item.value = item.key; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | this.dicKeys.forEach((x) => { |
|---|
| | | if (x.dicNo != d.dicNo) return true; |
|---|
| | | //2020.10.26å¢å 级èæ°æ®æºç»å®å¤ç |
|---|
| | | if (x.type == 'cascader' || x.type == 'treeSelect') { |
|---|
| | | // x.data=d.data; |
|---|
| | | //çætreeç»æ |
|---|
| | | let _data = JSON.parse(JSON.stringify(d.data)); |
|---|
| | | //2022.04.04å¢å 级èåå
¸æ°æ®æºå·æ°åtable没æååçé®é¢ |
|---|
| | | this.columns.forEach((column) => { |
|---|
| | | if (column.bind && column.bind.key == d.dicNo) { |
|---|
| | | column.bind.data = d.data; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | let arr = this.base.convertTree(_data, (node, data, isRoot) => { |
|---|
| | | if (!node.inited) { |
|---|
| | | node.inited = true; |
|---|
| | | node.label = node.value; |
|---|
| | | node.value = node.key; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | x.data.push(...arr); |
|---|
| | | x.orginData.push(...d.data); |
|---|
| | | //2021.10.17ä¿®å¤æ¥è¯¢çº§èä¸è½ç»å®æ°æ®æºçé®é¢ |
|---|
| | | this.searchFormOptions.forEach((searhcOption) => { |
|---|
| | | searhcOption.forEach((_option) => { |
|---|
| | | if (_option.type == 'cascader' && _option.dataKey == x.dicNo) { |
|---|
| | | _option.data = arr; |
|---|
| | | _option.orginData = d.data; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | //2021.10.17ä¿®å¤çº§èä¸è½äºçº§å·æ°çé®é¢ |
|---|
| | | this.editFormOptions.forEach((editOption) => { |
|---|
| | | editOption.forEach((_option) => { |
|---|
| | | if ( |
|---|
| | | (_option.type == 'cascader' || _option.type == 'treeSelect') && |
|---|
| | | _option.dataKey == x.dicNo |
|---|
| | | ) { |
|---|
| | | _option.data = arr; |
|---|
| | | _option.orginData = d.data; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | } else if (d.data.length > 0 && !d.data[0].hasOwnProperty('key')) { |
|---|
| | | let source = d.data, |
|---|
| | | newSource = new Array(source.length); |
|---|
| | | for (let index = 0; index < source.length; index++) { |
|---|
| | | newSource[index] = { |
|---|
| | | //é»è®¤ä»åå
¸æ°æ®è¯»åºæ¥çkeyé½æ¯stringç±»å,ä½å¦ææ°æ®ä»sqlä¸æ¥è¯¢çå¯è½ä¸ºéstring,å¦æ¯async-validatoréè¦éç½®è®¾ç½®æ ¼å¼ |
|---|
| | | key: source['key'] + '', //source[index][x.config.valueField] + "", |
|---|
| | | value: source['value'] //source[index][x.config.textField] |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | |
|---|
| | | x.data.push(...newSource); |
|---|
| | | } else { |
|---|
| | | //2020.06.06ï¼å¦ææ¯selectListæ°æ®æºä½¿ç¨çèªå®ä¹sql并ä¸keyæ¯æ°åï¼å¼ºå¶è½¬æ¢æå符串 |
|---|
| | | if ( |
|---|
| | | x.e_type == 'selectList' && |
|---|
| | | d.data.length > 0 && |
|---|
| | | typeof d.data[0].key == 'number' |
|---|
| | | ) { |
|---|
| | | d.data.forEach((c) => { |
|---|
| | | c.key = c.key + ''; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | x.data.push(...d.data); |
|---|
| | | } |
|---|
| | | if ( |
|---|
| | | this.singleSearch && |
|---|
| | | this.singleSearch.dataKey && |
|---|
| | | this.singleSearch.dataKey == x.dicNo |
|---|
| | | ) { |
|---|
| | | this.singleSearch.data.splice(0, 1, ...x.data); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | getUrl(action, ingorPrefix) { |
|---|
| | | //æ¯å¦å¿½ç¥åç¼/ è·åæä½çurl |
|---|
| | | return (!ingorPrefix ? '/' : '') + 'api' + this.table.url + action; |
|---|
| | | }, |
|---|
| | | initDicKeys() { |
|---|
| | | //åå§ååå
¸æ°æ® |
|---|
| | | let keys = []; |
|---|
| | | //2022.04.17ä¼åéæ°å è½½æ°æ®æº |
|---|
| | | this.dicKeys.forEach((item) => { |
|---|
| | | item.data.splice(0); |
|---|
| | | item.orginData && item.orginData.splice(0); |
|---|
| | | }); |
|---|
| | | //this.dicKeys.splice(0); |
|---|
| | | //åå§åç¼è¾æ°æ®æº,é»è®¤ä¸ºä¸ä¸ªç©ºæ°ç»ï¼å¦æè¦æ±å¿
填设置type=number/decimalçæå°å¼ |
|---|
| | | this.initFormOptions(this.editFormOptions, keys, this.editFormFields, true); |
|---|
| | | //åå§åæ¥è¯¢æ°æ®æº,é»è®¤ä¸ºä¸ä¸ªç©ºæ°ç» |
|---|
| | | this.initFormOptions( |
|---|
| | | this.searchFormOptions, |
|---|
| | | keys, |
|---|
| | | this.searchFormFields, |
|---|
| | | false |
|---|
| | | ); |
|---|
| | | //æ¥è¯¢æ¥æ设置为å¯éå¼å§ä¸ç»ææ¥æ |
|---|
| | | this.searchFormOptions.forEach((item) => { |
|---|
| | | item.forEach((x) => { |
|---|
| | | if (x.type == 'date' || x.type == 'datetime') x.range = true; |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | //åå§ådatatable表æ°æ®æº,é»è®¤ä¸ºä¸ä¸ªç©ºæ°ç»,dicKeys为çé¢ææçæ°æ®åå
¸ç¼å· |
|---|
| | | this.initColumns(this.columns, this.dicKeys, keys); |
|---|
| | | //2021.05.23é»è®¤å¼å¯æ¥è¯¢é¡µé¢ææå段æåº,å¦æä¸éè¦æåºï¼å¨onInitedéåcolumns设置sort=false |
|---|
| | | //2021.09.25移é¤å¼ºå¶æåºåè½ |
|---|
| | | // this.columns.forEach(x => { |
|---|
| | | // x.sort = x.render ? false : true; |
|---|
| | | // }) |
|---|
| | | if (this.detailOptions && this.detailOptions.columns) { |
|---|
| | | this.initColumns(this.detailOptions.columns, this.dicKeys, keys); |
|---|
| | | } |
|---|
| | | //åå§åå¿«éæ¥è¯¢å段,é»è®¤ä½¿ç¨ä»£ç çæå¨é
ç½®ç第ä¸ä¸ªæ¥è¯¢å段 |
|---|
| | | if (this.searchFormOptions.length > 0) { |
|---|
| | | this.singleSearch = { |
|---|
| | | dataKey: this.searchFormOptions[0][0].dataKey, |
|---|
| | | dicNo: this.searchFormOptions[0][0].dicNo, |
|---|
| | | field: this.searchFormOptions[0][0].field, |
|---|
| | | title: this.searchFormOptions[0][0].title, |
|---|
| | | type: this.searchFormOptions[0][0].type, |
|---|
| | | data: [] |
|---|
| | | }; |
|---|
| | | // this.singleSearch = this.searchFormOptions[0][0]; |
|---|
| | | } |
|---|
| | | if (keys.length == 0) return; |
|---|
| | | let $this = this; |
|---|
| | | this.http.post('/api/Sys_Dictionary/GetVueDictionary', keys).then((dic) => { |
|---|
| | | $this.bindOptions(dic); |
|---|
| | | //2022.04.04å¢å åå
¸å è½½å®ææ¹æ³ |
|---|
| | | $this.dicInited && $this.dicInited(dic); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | setFiexdColumn(columns, containerWidth) { |
|---|
| | | //计ç®æ´ä¸ªtableç宽度ï¼æ ¹æ®å®½åº¦å³å®æ¯å¦å¯ç¨ç¬¬ä¸è¡æ¾ç¤ºçå为åºå®å |
|---|
| | | //2021.09.21移é¤å¼ºå¶åºå®ç¬¬ä¸å |
|---|
| | | // let columnsWidth = 0; |
|---|
| | | // columns.forEach(x => { |
|---|
| | | // if (!x.hidden && x.width) { |
|---|
| | | // columnsWidth += x.width; |
|---|
| | | // } |
|---|
| | | // }); |
|---|
| | | // //å¯ç¨ç¬¬ä¸å为åºå®å |
|---|
| | | // if (columnsWidth > containerWidth) { |
|---|
| | | // let firstColumn = columns.find(x => !x.hidden); |
|---|
| | | // if (firstColumn) { |
|---|
| | | // firstColumn.fixed = true; |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | }, |
|---|
| | | initBoxHeightWidth() { |
|---|
| | | //åå§åå¼¹åºæ¡çé«åº¦ä¸å®½åº¦ |
|---|
| | | let clientHeight = document.documentElement.clientHeight; |
|---|
| | | //å¼¹åºæ¡é«åº¦è³å°250px |
|---|
| | | clientHeight = clientHeight < 250 ? 250 : clientHeight; |
|---|
| | | let clientWidth = document.documentElement.clientWidth; |
|---|
| | | if ( |
|---|
| | | this.editFormOptions.some((x) => { |
|---|
| | | return x.some((item) => { |
|---|
| | | return item.type == 'editor'; |
|---|
| | | }); |
|---|
| | | }) |
|---|
| | | ) { |
|---|
| | | this.editor.uploadImgUrl = this.getUrl('upload'); |
|---|
| | | this.boxOptions.height = clientHeight * 0.8; |
|---|
| | | this.boxOptions.width = clientWidth * 0.8; |
|---|
| | | } else { |
|---|
| | | if (this.boxOptions.height) { |
|---|
| | | //å¦æé«åº¦ä¸å®½åº¦è¶
è¿äºè·åå°çå¯è§é«å®½åº¦ï¼å设为é»è®¤ç90%é«å®½ |
|---|
| | | if (this.boxOptions.height > clientHeight * 0.8) { |
|---|
| | | this.boxOptions.height = clientHeight * 0.8; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | if (this.boxOptions.width) { |
|---|
| | | //å¦æé«åº¦ä¸å®½åº¦è¶
è¿äºè·åå°çå¯è§é«å®½åº¦ï¼å设为é»è®¤ç90%é«å®½ |
|---|
| | | if (this.boxOptions.width > clientWidth * 0.8) { |
|---|
| | | this.boxOptions.width = clientWidth * 0.8; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | //计ç®æ´ä¸ªtableç宽度ï¼æ ¹æ®å®½åº¦å³å®æ¯å¦å¯ç¨ç¬¬ä¸è¡æ¾ç¤ºçå为åºå®å |
|---|
| | | let maxTableWidth = clientWidth - 270; |
|---|
| | | this.setFiexdColumn(this.columns, maxTableWidth); |
|---|
| | | |
|---|
| | | this.height = this.tableHeight || clientHeight - 206; |
|---|
| | | this.url = this.getUrl(this.const.PAGE); |
|---|
| | | //计ç®å¼¹åºæ¡çé«ä¸å®½åº¦ |
|---|
| | | //å¦æææç»è¡¨ï¼é«åº¦ä¸å®½å¸¦è®¾ç½®ä¸º0.9/0.82 |
|---|
| | | if (this.detail.columns && this.detail.columns.length > 0) { |
|---|
| | | this.hasDetail = true; |
|---|
| | | clientWidth = clientWidth * 0.8; |
|---|
| | | clientHeight = clientHeight * 0.85; |
|---|
| | | if (!this.detailOptions.height) { |
|---|
| | | this.detailOptions.height = |
|---|
| | | clientHeight - this.editFormOptions.length * 36 - 234; |
|---|
| | | this.detailOptions.height = |
|---|
| | | this.detailOptions.height < 240 ? 240 : this.detailOptions.height; |
|---|
| | | } |
|---|
| | | |
|---|
| | | this.detailOptions.columns = this.detail.columns; |
|---|
| | | this.detailOptions.pagination.sortName = this.detail.sortName; |
|---|
| | | this.detailOptions.cnName = this.detail.cnName; |
|---|
| | | this.detailOptions.key = this.detail.key; |
|---|
| | | this.detailOptions.url = this.getUrl('getDetailPage'); |
|---|
| | | //计ç®å¼¹åºæ¡æ´ä¸ªtableç宽度ï¼æ ¹æ®å®½åº¦å³å®æ¯å¦å¯ç¨ç¬¬ä¸è¡æ¾ç¤ºçå为åºå®å |
|---|
| | | this.setFiexdColumn(this.detail.columns, clientWidth); |
|---|
| | | } else { |
|---|
| | | let maxColumns = 1; //æ大åæ°ï¼æ ¹æ®å计ç®å¼¹æ¡ç宽度 |
|---|
| | | this.editFormOptions.forEach((x) => { |
|---|
| | | if (x.length > maxColumns) maxColumns = x.length; |
|---|
| | | }); |
|---|
| | | let maxHeightRate = 0.7, |
|---|
| | | maxWidthRate = 0.5; |
|---|
| | | maxWidthRate = maxColumns / 10 + 0.3; |
|---|
| | | maxHeightRate = (this.editFormOptions.length || 1) * 0.1 + 0.03; |
|---|
| | | maxHeightRate = maxHeightRate > 0.9 ? 0.9 : maxHeightRate; |
|---|
| | | clientWidth = clientWidth * maxWidthRate; |
|---|
| | | clientHeight = clientHeight * maxHeightRate; |
|---|
| | | // this.boxOptions.width = clientWidth * maxWidthRate; |
|---|
| | | // this.boxOptions.height = clientHeight * maxHeightRate; |
|---|
| | | } |
|---|
| | | if (!this.boxOptions.height) { |
|---|
| | | this.boxOptions.height = clientHeight + 10; |
|---|
| | | } |
|---|
| | | if (!this.boxOptions.width) { |
|---|
| | | this.boxOptions.width = clientWidth + 30; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | rowOnChange(row) { |
|---|
| | | this.rowChange(row); |
|---|
| | | }, |
|---|
| | | rowChange(row) { |
|---|
| | | //éä¸è¡checkboxè¡äºä»¶ |
|---|
| | | }, |
|---|
| | | rowOnClick({ row, column, event }) { |
|---|
| | | this.rowClick({ row, column, event }); |
|---|
| | | }, |
|---|
| | | rowClick({ row, column, event }) { |
|---|
| | | // ç¹å»è¡äºä»¶(2020.11.07) |
|---|
| | | }, |
|---|
| | | rowOnDbClick({ row, column, event }) { |
|---|
| | | this.rowDbClick({ row, column, event }); |
|---|
| | | }, |
|---|
| | | rowDbClick({ row, column, event }) { |
|---|
| | | // åå»å»è¡äºä»¶(2021.05.23) |
|---|
| | | }, |
|---|
| | | $error(message) { |
|---|
| | | this.$message.error(message); |
|---|
| | | // this.$message({ |
|---|
| | | // type: 'error', |
|---|
| | | // content: message, |
|---|
| | | // duration: 5 |
|---|
| | | // }); |
|---|
| | | }, |
|---|
| | | $success(message) { |
|---|
| | | this.$message.success(message); |
|---|
| | | }, |
|---|
| | | setFiexdSearchForm(visiable) { |
|---|
| | | //2020.09.011å¢å åºå®æ¥è¯¢è¡¨ååè½,visiable=trueé»è®¤å°æ¥è¯¢è¡¨åå±å¼ |
|---|
| | | this.fiexdSearchForm = true; |
|---|
| | | let refreshBtn = this.buttons.find((x) => x.name == 'å· æ°'); |
|---|
| | | if (visiable) { |
|---|
| | | this.searchBoxShow = true; |
|---|
| | | } |
|---|
| | | if (refreshBtn) { |
|---|
| | | refreshBtn.name = 'é ç½®'; |
|---|
| | | refreshBtn.onClick = function () { |
|---|
| | | this.resetSearch(); |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | tableBeginEdit(row, column, index) { |
|---|
| | | //2021.03.19æ¯å¦å¼å¯æ¥è¯¢çé¢è¡¨æ ¼åå»ç¼è¾ç»ææ¹æ³,è¿åfalseä¸ä¼ç»æç¼è¾ |
|---|
| | | return this.beginEdit(row, column, index); |
|---|
| | | }, |
|---|
| | | beginEdit(row, column, index) { |
|---|
| | | //2021.03.19æ¯å¦å¼å¯æ¥è¯¢çé¢è¡¨æ ¼åå»ç¼è¾ç»ææ¹æ³,è¿åfalseä¸ä¼ç»æç¼è¾ |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | tableEndEditBefore(row, column, index) { |
|---|
| | | return this.endEditBefore(row, column, index); |
|---|
| | | }, |
|---|
| | | endEditBefore(row, column, index) { |
|---|
| | | //2021.03.19æ¯å¦å¼å¯æ¥è¯¢çé¢è¡¨æ ¼åå»ç¼è¾ç»ææ¹æ³,è¿åfalseä¸ä¼ç»æç¼è¾ |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | filterPermission(tableName, permission) { |
|---|
| | | //2021.03.19å¤ææ¯å¦ææ个表çæé®æé |
|---|
| | | //:["Search","Add","Delete","Update","Import","Export","Upload","Audit"] |
|---|
| | | const _result = (this.$store.state.permission || []).find((x) => { |
|---|
| | | return x.url == '/' + tableName; |
|---|
| | | }); |
|---|
| | | return _result && _result.permission.some((x) => x == permission); |
|---|
| | | }, |
|---|
| | | destroyed() { |
|---|
| | | //2021.04.11å¢å vue页é¢éæ¯æ¹æ³,è·¯ç±å¿
须设置keepLive:falseï¼è®¾ç½®æ¹æ³è§ï¼å端å¼åææ¡£-ã[ç¦ç¨é¡µé¢ç¼åkeepAlive] |
|---|
| | | }, |
|---|
| | | loadTreeTableChildren(tree, treeNode, resolve) { |
|---|
| | | this.loadTreeChildren.call(this, tree, treeNode, resolve); |
|---|
| | | }, |
|---|
| | | loadTreeChildren(tree, treeNode, resolve) { |
|---|
| | | //æ å½¢ç»æå è½½åèç¹(2021.05.02),å¨onInitä¸è®¾ç½®äºrowKey主é®å段åæä¼çæ |
|---|
| | | return resolve([]); |
|---|
| | | }, |
|---|
| | | importDetailAfter(data) { |
|---|
| | | //2022.01.08å¢å æç»è¡¨å¯¼å
¥åå¤ç |
|---|
| | | }, |
|---|
| | | importExcelAfter(data) { |
|---|
| | | //2022.01.08å¢å æç»è¡¨å¯¼å
¥åæ¹æ³å¤æ |
|---|
| | | |
|---|
| | | if (!data.status) { |
|---|
| | | return; // this.$message.error(data.message); |
|---|
| | | } |
|---|
| | | //æç»è¡¨å¯¼å
¥ |
|---|
| | | if (this.boxModel) { |
|---|
| | | if (data.data) { |
|---|
| | | data.data = JSON.parse(data.data); |
|---|
| | | } else { |
|---|
| | | data.data = []; |
|---|
| | | } |
|---|
| | | data.data.forEach((x) => { |
|---|
| | | x[this.detail.key] = undefined; |
|---|
| | | x[this.table.key] = undefined; |
|---|
| | | }); |
|---|
| | | this.importDetailAfter(data); //å¢å æç»è¡¨å¯¼å
¥åå¤ç |
|---|
| | | this.$refs.detail.rowData.unshift(...data.data); |
|---|
| | | this.upload.excel = false; |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | this.importAfter(data); |
|---|
| | | }, |
|---|
| | | onGridModelClose(iconClick) { |
|---|
| | | if (this.isBoxAudit) { |
|---|
| | | this.initFormOptionType(false); |
|---|
| | | } |
|---|
| | | this.isBoxAudit = false; |
|---|
| | | this.onModelClose(iconClick); |
|---|
| | | }, |
|---|
| | | initAuditColumn() { |
|---|
| | | |
|---|
| | | }, |
|---|
| | | getWorkFlowSteps(row) { |
|---|
| | | let table = this.table.url.replaceAll('/', ''); |
|---|
| | | let url = `api/Sys_WorkFlow/getSteps?tableName=${table}&id=${row[this.table.key] |
|---|
| | | }`; |
|---|
| | | this.http.get(url, {}, true).then((result) => { |
|---|
| | | this.workFlowSteps.splice(0); |
|---|
| | | //æå¯è½æ²¡æé
置审æ¹æµç¨ |
|---|
| | | if (!result.list || !result.list.length) { |
|---|
| | | result.list = []; |
|---|
| | | this.auditParam.showAction = true; |
|---|
| | | this.auditParam.height = 240; |
|---|
| | | this.auditParam.showViewButton = row.AuditStatus == 0; |
|---|
| | | } else { |
|---|
| | | this.auditParam.showAction = result.list.some((c) => { |
|---|
| | | return c.isCurrentUser; |
|---|
| | | }); |
|---|
| | | this.auditParam.height = 511; |
|---|
| | | this.auditParam.showViewButton = true; |
|---|
| | | } |
|---|
| | | this.auditParam.reason = ''; |
|---|
| | | this.auditParam.status = -1; |
|---|
| | | this.auditParam.value = -1; |
|---|
| | | if (result.his) { |
|---|
| | | result.his.forEach((item) => { |
|---|
| | | item.auditStatus = this.getAuditStatus(item.auditStatus); |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | |
|---|
| | | this.auditParam.auditHis = result.his; |
|---|
| | | this.workFlowSteps.push(...result.list); |
|---|
| | | this.isBoxAudit = true; |
|---|
| | | this.initFormOptionType(true); |
|---|
| | | this.edit(row); |
|---|
| | | this.boxOptions.title = 'å®¡æ ¸'; |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | initFormOptionType(isReadonly) { |
|---|
| | | this.editFormOptions.forEach((options) => { |
|---|
| | | options.forEach((option) => { |
|---|
| | | if (isReadonly) { |
|---|
| | | if (!option.readonly) { |
|---|
| | | this.formFieldsType.push(option.field); |
|---|
| | | option.readonly = true; |
|---|
| | | } |
|---|
| | | } else { |
|---|
| | | if (this.formFieldsType.indexOf(option.field) != -1) { |
|---|
| | | option.readonly = false; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | getAuditStatus(status) { |
|---|
| | | let data = this.auditParam.data.find((x) => { |
|---|
| | | return x.value == status; |
|---|
| | | }); |
|---|
| | | if (!data) { |
|---|
| | | return '-'; |
|---|
| | | // return `å®¡æ ¸å¼ä¸æ£ç¡®:${status}` |
|---|
| | | } |
|---|
| | | return data.text; |
|---|
| | | }, |
|---|
| | | initFlowQuery() { |
|---|
| | | if (this.$route.query.viewflow) { |
|---|
| | | this.$refs.table && this.search(); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | fullscreen(full){ //å¼¹åºæ¡å
¨å±æ¹æ³ |
|---|
| | | |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | import customColumns from './ViewGridCustomColumn.js'; |
|---|
| | | //å并æ©å±æ¹æ³ |
|---|
| | | methods = Object.assign(methods, detailMethods, serviceFilter, customColumns); |
|---|
| | | export default methods; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | let props = { |
|---|
| | | columns: {//å½å表çé
ç½®ä¿¡æ¯ |
|---|
| | | type: Array, |
|---|
| | | default: () => { |
|---|
| | | return []; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | detail: {//ä»è¡¨æç»é
ç½® |
|---|
| | | type: Object, |
|---|
| | | default: () => { |
|---|
| | | return { |
|---|
| | | columns: [],//ä»è¡¨å |
|---|
| | | sortName: ""//ä»è¡¨æåºå段 |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | editFormFields: {//æ°å»ºãç¼è¾å段(key/value) |
|---|
| | | type: Object, |
|---|
| | | default: () => { |
|---|
| | | return {}; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | editFormOptions: {//æ°å»ºãç¼è¾é
ç½®ä¿¡æ¯ |
|---|
| | | type: Array, |
|---|
| | | default: () => { |
|---|
| | | return []; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | searchFormFields: {//æ¥è¯¢å段(key/value) |
|---|
| | | type: Object, |
|---|
| | | default: () => { |
|---|
| | | return {}; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | searchFormOptions: {//æ¥è¯¢é
置信æ¯(key/value) |
|---|
| | | type: Array, |
|---|
| | | default: () => { |
|---|
| | | return []; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | table: {//表çé
置信æ¯ï¼ä¸»é®ãæåºç |
|---|
| | | type: Object, |
|---|
| | | default: () => { |
|---|
| | | return {}; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | extend: {//表çæ©å±æ¹æ³ä¸ç»ä»¶é½å并å°æ¤å±æ§ä¸ |
|---|
| | | type: Object, |
|---|
| | | default: () => { |
|---|
| | | return {}; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | export default props; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | |
|---|
| | | |
|---|
| | | let serviceFilter = { |
|---|
| | | onInit () { //对åºcreated |
|---|
| | | console.log('Createæ§è¡å') |
|---|
| | | }, |
|---|
| | | onInited () { //对åºcreatedï¼å¨onInitä¸onInitedä¸é´ä¼åå§åçé¢æ°æ®å¯¹è±¡ |
|---|
| | | console.log('Createæ§è¡å') |
|---|
| | | }, |
|---|
| | | mounted () { |
|---|
| | | console.log('mounted'); |
|---|
| | | }, |
|---|
| | | searchBefore (param) { //æ¥è¯¢ViewGird表æ°æ®å,paramæ¥è¯¢åæ° |
|---|
| | | // console.log('表' + this.table.cnName + '触åloadTableBefore'); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | //2020.10.30å¢å æ¥è¯¢åè¿åææçæ¥è¯¢ä¿¡æ¯ |
|---|
| | | searchAfter (param, result) { //æ¥è¯¢ViewGird表æ°æ®åparamæ¥è¯¢åæ°,resultåè¿æ¥è¯¢çç»æ |
|---|
| | | // console.log('表' + this.table.cnName + '触åloadTableAfter'); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | searchDetailBefore (param) {//æ¥è¯¢ä»è¡¨è¡¨æ°æ®å,paramæ¥è¯¢åæ° |
|---|
| | | //console.log(this.detailOptions.cnName + '触åloadDetailTableBefore'); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | searchDetailAfter (param, data) {//æ¥è¯¢ä»è¡¨åparamæ¥è¯¢åæ°,resultåè¿æ¥è¯¢çç»æ |
|---|
| | | // console.log(this.detailOptions.cnName + '触åloadDetailTableAfter'); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | delBefore (ids, rows) { //æ¥è¯¢çé¢ç表å é¤å ids为å é¤çidæ°ç»,,rowså é¤çè¡ |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | delAfter (result) {//æ¥è¯¢çé¢ç表å é¤å |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | delDetailRow (rows) { //å¼¹åºæ¡å é¤æç»è¡¨çè¡æ°æ®(åªæ¯å¯¹tableæä½ï¼å¹¶æ²¡ææä½åå°) |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | addBefore (formData) { //æ°å»ºä¿ååformData为对象ï¼å
æ¬æç»è¡¨ |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | async addBeforeAsync (formData) { //å¼æ¥å¤ç,åè½åä¸(2020.12.06) |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | addAfter (result) {//æ°å»ºä¿ååresultè¿åçç¶æå表å对象 |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | updateBefore (formData) { //ç¼è¾ä¿ååformData为对象ï¼å
æ¬æç»è¡¨ãå é¤è¡çId |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | async updateBeforeAsync (formData) { //å¼æ¥å¤ç,åè½åä¸(2020.12.06) |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | updateAfter (result) {//ç¼è¾ä¿ååresultè¿åçç¶æå表å对象 |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | auditBefore (ids, rows) {//å®¡æ ¸å |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | auditAfter (result, rows) {// å®¡æ ¸å |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | resetAddFormBefore () { //éç½®æ°å»ºè¡¨ååçå
容 |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | resetAddFormAfter () { //éç½®æ°å»ºè¡¨ååçå
容 |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | resetUpdateFormBefore () { //éç½®ç¼è¾è¡¨ååçå
容 |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | resetUpdateFormAfter () { //éç½®ç¼è¾è¡¨ååçå
容 |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | modelOpenBefore (row) { //ç¹å»ç¼è¾/æ°å»ºæé®å¼¹åºæ¡åï¼å¯ä»¥å¨æ¤å¤åé»è¾ï¼å¦ï¼ä»åå°è·åæ°æ® |
|---|
| | | |
|---|
| | | }, |
|---|
| | | modelOpenAfter (row) { //ç¹å»ç¼è¾/æ°å»ºæé®å¼¹åºæ¡åï¼å¯ä»¥å¨æ¤å¤åé»è¾ï¼å¦ï¼ä»åå°è·åæ°æ® |
|---|
| | | |
|---|
| | | }, |
|---|
| | | importAfter (data) { //导å
¥excelåå·æ°tableè¡¨æ ¼æ°æ® |
|---|
| | | this.search(); |
|---|
| | | }, |
|---|
| | | //2020.10.31æ·»å 导å
¥åçæ¹æ³ |
|---|
| | | importExcelBefore (formData) { //导å
¥excel导å
¥å |
|---|
| | | //å¾formDataåä¸äºå
¶ä»åæ°æ交å°åå°ï¼ |
|---|
| | | // formData.append("val2", "xxx"); |
|---|
| | | //åå°æä¸é¢æ¹æ³è·å请æ±çåæ° |
|---|
| | | // Core.Utilities.HttpContext.Current.Request("val2"); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | reloadDicSource () { //éæ°å è½½åå
¸ç»å®çæ°æ®æº |
|---|
| | | this.initDicKeys(); |
|---|
| | | }, |
|---|
| | | exportBefore (param) { //2020.06.25å¢å 导åºåå¤ç |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | onModelClose(iconClick){ |
|---|
| | | //iconClick=true为ç¹å»å·¦ä¸ä¸è§X触åçå
³éäºä»¶ |
|---|
| | | //å¦æè¿å falseä¸ä¼å
³éå¼¹åºæ¡ |
|---|
| | | //return false; |
|---|
| | | this.boxModel=false; |
|---|
| | | }, |
|---|
| | | selectable(row, index){ |
|---|
| | | //表CheckBox æ¯å¦å¯ä»¥å¾é |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | export default serviceFilter; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="vol-dialog"> |
|---|
| | | |
|---|
| | | <el-dialog v-model="vmodel" :close-on-click-modal="false" :close-on-press-escape="false" :width="width" |
|---|
| | | :fullscreen="fullscreen" :draggable="draggable" :modal="modal" :before-close="handleClose"> |
|---|
| | | <template #header> |
|---|
| | | <i :class="icon"></i> {{ title }} |
|---|
| | | <button class="el-dialog__headerbtn" type="button" style="right: 35px; color: var(--el-color-info)" @click="handleFullScreen"> |
|---|
| | | <i class="el-icon el-icon-full-screen"></i> |
|---|
| | | </button> |
|---|
| | | </template> |
|---|
| | | <el-scrollbar :max-height="contentHeight"> |
|---|
| | | <div v-if="inited" style="min-height: 50px;" class="srcoll-content" :style="{ padding: padding + 'px' }"> |
|---|
| | | <slot name="content"></slot> |
|---|
| | | <slot></slot> |
|---|
| | | </div> |
|---|
| | | </el-scrollbar> |
|---|
| | | <template #footer> |
|---|
| | | <div class="dia-footer" v-if="footer"> |
|---|
| | | <slot name="footer"></slot> |
|---|
| | | <el-button type="primary" v-if="!footer" size="mini" @click="handleClose()"><i |
|---|
| | | class="el-icon-close"></i>å
³é</el-button> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </el-dialog> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import { defineComponent, ref, watch, watchEffect } from 'vue'; |
|---|
| | | |
|---|
| | | export default defineComponent({ |
|---|
| | | props: { |
|---|
| | | modelValue: false, |
|---|
| | | lazy: { |
|---|
| | | //æ¯å¦å¼å¯æå è½½2020.12.06 |
|---|
| | | type: Boolean, |
|---|
| | | default: false, |
|---|
| | | }, |
|---|
| | | icon: { |
|---|
| | | type: String, |
|---|
| | | default: "el-icon-warning-outline", |
|---|
| | | }, |
|---|
| | | title: { |
|---|
| | | type: String, |
|---|
| | | default: "åºæ¬ä¿¡æ¯", |
|---|
| | | }, |
|---|
| | | height: { |
|---|
| | | type: Number, |
|---|
| | | default: 200, |
|---|
| | | }, |
|---|
| | | width: { |
|---|
| | | type: Number, |
|---|
| | | default: 650, |
|---|
| | | }, |
|---|
| | | padding: { |
|---|
| | | type: Number, |
|---|
| | | default: 16, |
|---|
| | | }, |
|---|
| | | modal: { |
|---|
| | | //æ¯å¦éè¦é®ç½©å± |
|---|
| | | type: Boolean, |
|---|
| | | default: true, |
|---|
| | | }, |
|---|
| | | draggable: { |
|---|
| | | //å¯ç¨å¯ææ½åè½ |
|---|
| | | type: Boolean, |
|---|
| | | default: false, |
|---|
| | | }, |
|---|
| | | mask: { |
|---|
| | | type: Boolean, |
|---|
| | | default: true, |
|---|
| | | }, |
|---|
| | | onModelClose: { |
|---|
| | | //2021.07.11å¢å å¼¹åºæ¡å
³éäºä»¶ |
|---|
| | | type: Function, |
|---|
| | | default: (iconClick) => { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | footer:{ //æ¯å¦æ¾ç¤ºåºé¨æé® |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, |
|---|
| | | setup(props, context) { |
|---|
| | | const clientHeight = document.body.clientHeight * 0.95 - 60; |
|---|
| | | const inited = ref(true); |
|---|
| | | const vmodel = ref(false); |
|---|
| | | const footer = ref(false); |
|---|
| | | const top = ref(100); |
|---|
| | | vmodel.value = props.modelValue; |
|---|
| | | footer.value = !!context.slots.footer; |
|---|
| | | const contentHeight = ref(200); |
|---|
| | | contentHeight.value = props.height; |
|---|
| | | const handleClose = (done, iconClose) => { |
|---|
| | | let result = props.onModelClose(!!iconClose); |
|---|
| | | if (result === false) return; |
|---|
| | | vmodel.value = false; |
|---|
| | | context.emit("update:modelValue", false); |
|---|
| | | done && done(); |
|---|
| | | }; |
|---|
| | | const calcHeight = (val) => { |
|---|
| | | // if (props.height > clientHeight) { |
|---|
| | | // if(true){ |
|---|
| | | contentHeight.value = clientHeight - 30; |
|---|
| | | return clientHeight / -2 + 'px'; |
|---|
| | | // } |
|---|
| | | // contentHeight.value = val || props.height; |
|---|
| | | // return (props.height + 56) / -2 + 'px'; |
|---|
| | | }; |
|---|
| | | top.value = calcHeight(); |
|---|
| | | watch( |
|---|
| | | () => props.modelValue, |
|---|
| | | (newVal, oldVal) => { |
|---|
| | | vmodel.value = newVal; |
|---|
| | | } |
|---|
| | | ); |
|---|
| | | watch( |
|---|
| | | () => props.height, |
|---|
| | | (newVal, oldVal) => { |
|---|
| | | top.value = calcHeight(); |
|---|
| | | } |
|---|
| | | ); |
|---|
| | | const fullscreen=ref(false); |
|---|
| | | const handleFullScreen=()=> { |
|---|
| | | fullscreen.value = !fullscreen.value; |
|---|
| | | context.emit("fullscreen", fullscreen.value); |
|---|
| | | } |
|---|
| | | return { |
|---|
| | | handleClose, |
|---|
| | | inited, |
|---|
| | | vmodel, |
|---|
| | | footer, |
|---|
| | | top, |
|---|
| | | calcHeight, |
|---|
| | | contentHeight, |
|---|
| | | fullscreen, |
|---|
| | | handleFullScreen |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .dia-footer { |
|---|
| | | text-align: right; |
|---|
| | | width: 100%; |
|---|
| | | border-top: 1px solid #e2e2e2; |
|---|
| | | text-align: right; |
|---|
| | | padding: 6px 8px; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | |
|---|
| | | <style scoped lang="less"> |
|---|
| | | .vol-dialog ::v-deep(.el-overlay-dialog) { |
|---|
| | | display: flex !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .vol-dialog ::v-deep(.el-dialog) { |
|---|
| | | margin: auto; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .vol-dialog ::v-deep(.el-dialog) { |
|---|
| | | border-top-left-radius: 4px; |
|---|
| | | border-top-right-radius: 4px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .vol-dialog ::v-deep(.el-dialog__header) { |
|---|
| | | border-top-left-radius: 4px; |
|---|
| | | border-top-right-radius: 4px; |
|---|
| | | padding: 0px 13px; |
|---|
| | | line-height: 53px; |
|---|
| | | border-bottom: 1px solid #e6e6e6; |
|---|
| | | height: 50px; |
|---|
| | | color: rgb(79, 79, 79); |
|---|
| | | font-weight: bold; |
|---|
| | | font-size: 14px; |
|---|
| | | margin: 0; |
|---|
| | | // background-image: linear-gradient(135deg, #0cd7bd 10%, #50c3f7); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .vol-dialog ::v-deep(.el-dialog__footer), |
|---|
| | | .vol-dialog ::v-deep(.el-dialog__body) { |
|---|
| | | padding: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .vol-dialog ::v-deep(.el-dialog__headerbtn) { |
|---|
| | | top: 0; |
|---|
| | | padding-top: 8px; |
|---|
| | | height: 50px; |
|---|
| | | width: 0; |
|---|
| | | padding-right: 30px; |
|---|
| | | padding-left: 5px; |
|---|
| | | } |
|---|
| | | // .vol-dialog ::v-deep(.el-dialog__headerbtn .el-dialog__close) { |
|---|
| | | // color: #fff; |
|---|
| | | // } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="vol-el-menu"> |
|---|
| | | <el-menu |
|---|
| | | close="vol-el-menu--vertical" |
|---|
| | | :default-openeds="openedIds" |
|---|
| | | :default-active="defaultActive" |
|---|
| | | :unique-opened="true" |
|---|
| | | @select="select" |
|---|
| | | :collapse="isCollapse" |
|---|
| | | @open="handleOpen" |
|---|
| | | @close="handleClose" |
|---|
| | | @contextmenu.prevent="bindRightClickMenu" |
|---|
| | | > |
|---|
| | | <template v-for="item in convertTree(list)"> |
|---|
| | | <el-sub-menu |
|---|
| | | :key="item.id" |
|---|
| | | :index="'' + item.id" |
|---|
| | | v-if="item.children.length && (!enable || item.enable == 1)" |
|---|
| | | > |
|---|
| | | <template #title> |
|---|
| | | <i class="menu-icon" :class="item.icon"></i> |
|---|
| | | <span> {{ item.name }}</span> |
|---|
| | | </template> |
|---|
| | | <vol-element-menu-child |
|---|
| | | :enable="enable" |
|---|
| | | :list="item.children" |
|---|
| | | ></vol-element-menu-child> |
|---|
| | | </el-sub-menu> |
|---|
| | | <template v-else> |
|---|
| | | <el-menu-item |
|---|
| | | class="menu-item-lv1" |
|---|
| | | v-if="!enable || item.enable == 1" |
|---|
| | | :key="item.id" |
|---|
| | | :index="'' + item.id" |
|---|
| | | > |
|---|
| | | <i :class="item.icon"></i> |
|---|
| | | <span> {{ item.name }}</span> |
|---|
| | | </el-menu-item> |
|---|
| | | </template> |
|---|
| | | </template> |
|---|
| | | </el-menu> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import VolElementMenuChild from './VolElementMenuChild'; |
|---|
| | | import { useRouter } from 'vue-router'; |
|---|
| | | |
|---|
| | | import { |
|---|
| | | defineComponent, |
|---|
| | | reactive, |
|---|
| | | watch, |
|---|
| | | ref, |
|---|
| | | toRef, |
|---|
| | | toRefs, |
|---|
| | | getCurrentInstance |
|---|
| | | // onMounted, |
|---|
| | | } from 'vue'; |
|---|
| | | export default defineComponent({ |
|---|
| | | components: { |
|---|
| | | 'vol-element-menu-child': VolElementMenuChild |
|---|
| | | }, |
|---|
| | | props: { |
|---|
| | | enable: { |
|---|
| | | type: Boolean, |
|---|
| | | default: false //æ¯å¦å¤æenable=1 |
|---|
| | | }, |
|---|
| | | isCollapse: { |
|---|
| | | type: Boolean, |
|---|
| | | default: false |
|---|
| | | }, |
|---|
| | | onSelect: { |
|---|
| | | type: Function, |
|---|
| | | default: (x) => {} |
|---|
| | | }, |
|---|
| | | openSelect: { |
|---|
| | | //æå¼çæ¶åæ¯å¦è§¦åéä¸äºä»¶ |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | list: { |
|---|
| | | type: Array, |
|---|
| | | default: [] |
|---|
| | | }, |
|---|
| | | rootId: { |
|---|
| | | type: String, |
|---|
| | | default: '0' |
|---|
| | | }, |
|---|
| | | currentMenuId: { |
|---|
| | | type: Number, |
|---|
| | | default: 0 |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | setup(props) { |
|---|
| | | // const { list } = toRefs(props); |
|---|
| | | // const treeList = ref([]); |
|---|
| | | const getTree = (id, node, data) => { |
|---|
| | | if (!node.children) { |
|---|
| | | node.children = []; |
|---|
| | | } |
|---|
| | | data.forEach((x) => { |
|---|
| | | if (x.parentId == id && !node.children.some((c) => c.id === x.id)) { |
|---|
| | | node.children.push(x); |
|---|
| | | getTree(x.id, x, data); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | let rootTreeId = !isNaN(props.rootId) ? ~~props.rootId : props.rootId; |
|---|
| | | props.list.forEach((x) => { |
|---|
| | | if (!x.icon || x.icon.substring(0, 3) != 'el-') { |
|---|
| | | x.icon = 'el-icon-menu'; |
|---|
| | | } |
|---|
| | | x.children = []; |
|---|
| | | x.isRoot = x.parentId === rootTreeId; |
|---|
| | | }); |
|---|
| | | const convertTree = (data) => { |
|---|
| | | var root_data = []; |
|---|
| | | data.forEach((x) => { |
|---|
| | | if (x.parentId === rootTreeId) { |
|---|
| | | if (!x.hasOwnProperty('enable')) x.enable = 1; |
|---|
| | | root_data.push(x); |
|---|
| | | getTree(x.id, x, data); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | return root_data; |
|---|
| | | }; |
|---|
| | | const openedIds = reactive([props.currentMenuId]); |
|---|
| | | const defaultActive = ref(props.currentMenuId + ''); |
|---|
| | | let _base = getCurrentInstance().appContext.config.globalProperties.base; |
|---|
| | | watch( |
|---|
| | | () => props.currentMenuId, |
|---|
| | | (newVal, oldVal) => { |
|---|
| | | defaultActive.value = newVal + ''; |
|---|
| | | openedIds.splice(0); |
|---|
| | | openedIds.push( |
|---|
| | | ..._base.getTreeAllParent(newVal, props.list).map((c) => { |
|---|
| | | return c.id; |
|---|
| | | }) |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | ); |
|---|
| | | const router = useRouter(); |
|---|
| | | let eventSelect = false; |
|---|
| | | const select = (index, path) => { |
|---|
| | | if (eventSelect) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | eventSelect = true; |
|---|
| | | setTimeout(() => { |
|---|
| | | eventSelect = false; |
|---|
| | | }, 20); |
|---|
| | | |
|---|
| | | let _item = props.list.find((x) => { |
|---|
| | | return x.id == index; |
|---|
| | | }); |
|---|
| | | props.onSelect(index, _item); |
|---|
| | | router.push({ path: _item.path || '' }); |
|---|
| | | }; |
|---|
| | | |
|---|
| | | const handleOpen = (index, path) => { |
|---|
| | | if (props.openSelect) { |
|---|
| | | select(index, path); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | const handleClose = () => {}; |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * èå导èªå³é®äºä»¶ |
|---|
| | | * @param {*} enable æ¯å¦å¯ç¨å³é®äºä»¶[true:å¯ç¨;false:ç¦ç¨;] |
|---|
| | | */ |
|---|
| | | const bindRightClickMenu = (enable) => { |
|---|
| | | if (!enable) return; |
|---|
| | | }; |
|---|
| | | |
|---|
| | | return { |
|---|
| | | // treeList, |
|---|
| | | // list, |
|---|
| | | select, |
|---|
| | | convertTree, |
|---|
| | | handleOpen, |
|---|
| | | handleClose, |
|---|
| | | bindRightClickMenu, |
|---|
| | | openedIds, |
|---|
| | | defaultActive |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .vol-el-menu { |
|---|
| | | box-sizing: content-box; |
|---|
| | | width: 100%; |
|---|
| | | .menu-icon { |
|---|
| | | font-size: 18px; |
|---|
| | | margin-right: 6px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="vol-el-menu-item"> |
|---|
| | | <template v-for="(item) in list"> |
|---|
| | | <template v-if="item.children&&item.children.length"> |
|---|
| | | <el-menu-item :key="item.id" |
|---|
| | | :index="'' + item.id" |
|---|
| | | v-if="!item.children.length && (!enable || item.enable == 1)"> |
|---|
| | | <template #title></template> |
|---|
| | | <span> {{ item.name }}</span> |
|---|
| | | </el-menu-item> |
|---|
| | | <el-sub-menu :key="item.id" |
|---|
| | | :index="'' + item.id" |
|---|
| | | v-if="item.children.length && (!enable || item.enable == 1)"> |
|---|
| | | <template #title> |
|---|
| | | <span> {{ item.name }}</span> |
|---|
| | | </template> |
|---|
| | | <vol-element-menu-child :enable="enable" :list="item.children" /> |
|---|
| | | </el-sub-menu> |
|---|
| | | </template> |
|---|
| | | <template v-else> |
|---|
| | | <el-menu-item :key="item.id" |
|---|
| | | :index="'' + item.id" |
|---|
| | | v-if="(!enable || item.enable == 1)"> |
|---|
| | | <template #title></template> |
|---|
| | | <span> {{item.name }}</span> |
|---|
| | | </el-menu-item> |
|---|
| | | </template> |
|---|
| | | </template> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | export default { |
|---|
| | | name: "vol-element-menu-child", |
|---|
| | | props: { |
|---|
| | | list: { |
|---|
| | | type: Array, |
|---|
| | | default: [], |
|---|
| | | }, |
|---|
| | | enable: { |
|---|
| | | type: Boolean, |
|---|
| | | default: false, //æ¯å¦å¤æenable=1 |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped lang="less"> |
|---|
| | | .vol-el-menu-item ::v-deep(.el-menu-item) { |
|---|
| | | height: 42px !important; |
|---|
| | | line-height: 42px !important; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <el-form |
|---|
| | | style="display: inline-block; width: 100%" |
|---|
| | | :inline="true" |
|---|
| | | ref="volform" |
|---|
| | | @submit.prevent |
|---|
| | | :model="formFields" |
|---|
| | | :label-width="labelWidth" |
|---|
| | | :rules="rules" |
|---|
| | | > |
|---|
| | | <template v-for="(row, findex) in formRules" :key="findex"> |
|---|
| | | <div class="vol-form-item"> |
|---|
| | | <el-form-item |
|---|
| | | :label="item.title ? item.title + 'ï¼' : ''" |
|---|
| | | v-show="!item.hidden" |
|---|
| | | v-for="(item, index) in row" |
|---|
| | | :prop="item.field" |
|---|
| | | :key="item.field + index" |
|---|
| | | :style="{ width: getColWidth(item) + '%' }" |
|---|
| | | > |
|---|
| | | <!-- render --> |
|---|
| | | <form-expand |
|---|
| | | v-if="item.render && typeof item.render == 'function'" |
|---|
| | | :render="item.render" |
|---|
| | | :par="12" |
|---|
| | | ></form-expand> |
|---|
| | | <!-- 2021.10.17å¢å 表åå®æ¶æ¹æ³è®¡ç® --> |
|---|
| | | <span |
|---|
| | | v-else-if=" |
|---|
| | | item.readonly && typeof formFields[item.field] == 'function' |
|---|
| | | " |
|---|
| | | >{{ formFields[item.field]() }}</span |
|---|
| | | > |
|---|
| | | <!-- åªè¯»å¾çææ件 --> |
|---|
| | | <div v-else-if="isReadonlyImgFile(item, formFields)"> |
|---|
| | | <div v-if="item.type == 'img'" class="form-imgs"> |
|---|
| | | <div |
|---|
| | | class="img-item" |
|---|
| | | v-for="(img, imgIndex) in formFields[item.field]" |
|---|
| | | :key="imgIndex" |
|---|
| | | > |
|---|
| | | <img |
|---|
| | | :src="getSrc(img.path)" |
|---|
| | | :onerror="errorImg" |
|---|
| | | @click="previewImg(img.path)" |
|---|
| | | /> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div |
|---|
| | | v-else |
|---|
| | | class="form-file-list" |
|---|
| | | v-for="(file, fileIndex) in formFields[item.field]" |
|---|
| | | :key="fileIndex" |
|---|
| | | > |
|---|
| | | <a @click="dowloadFile(formFields[item.field][fileIndex])">{{ |
|---|
| | | file.name |
|---|
| | | }}</a> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div v-else :class="{ 'form-item-extra': item.extra }"> |
|---|
| | | <!-- åªè¯»å±æ§ --> |
|---|
| | | <label |
|---|
| | | :style="item.inputStyle" |
|---|
| | | v-if="item.type == 'label'" |
|---|
| | | class="readonly-input" |
|---|
| | | >{{ getText(formFields, item) }}</label |
|---|
| | | > |
|---|
| | | <!-- 20223.05.13éæel-tree-select --> |
|---|
| | | <!-- :filter-method="(value)=>{filterMethod(value,item.data)}" --> |
|---|
| | | <!-- :filterable="true" --> |
|---|
| | | <el-tree-select |
|---|
| | | style="width: 100%" |
|---|
| | | v-else-if="item.type == 'treeSelect'" |
|---|
| | | v-model="formFields[item.field]" |
|---|
| | | :data="item.data" |
|---|
| | | :multiple="item.multiple" |
|---|
| | | :render-after-expand="false" |
|---|
| | | :show-checkbox="false" |
|---|
| | | :check-strictly="true" |
|---|
| | | check-on-click-node |
|---|
| | | node-key="key" |
|---|
| | | :props="{ label: 'label' }" |
|---|
| | | > |
|---|
| | | <template #default="{data,node }"> |
|---|
| | | <!-- <el-checkbox v-model="node.checked"></el-checkbox> --> |
|---|
| | | <!-- {{getNode(node, data)}} --> |
|---|
| | | <!-- {{node.checked}} --> |
|---|
| | | <!-- è¿éè¿æç¹é®é¢ï¼åé¢å¤ç --> |
|---|
| | | {{ data.label}}</template |
|---|
| | | > |
|---|
| | | </el-tree-select> |
|---|
| | | <template |
|---|
| | | v-else-if="['select', 'selectList'].indexOf(item.type) != -1" |
|---|
| | | > |
|---|
| | | <el-select-v2 |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | v-show="!item.hidden" |
|---|
| | | style="width: 100%" |
|---|
| | | :size="size" |
|---|
| | | v-if="item.data.length > select2Count" |
|---|
| | | v-model="formFields[item.field]" |
|---|
| | | filterable |
|---|
| | | :multiple="item.type == 'select' ? false : true" |
|---|
| | | :placeholder="item.placeholder ? item.placeholder : item.title" |
|---|
| | | :allow-create="item.autocomplete" |
|---|
| | | :options="item.data" |
|---|
| | | @change=" |
|---|
| | | (val) => { |
|---|
| | | item.onChange(val, item.data); |
|---|
| | | } |
|---|
| | | " |
|---|
| | | clearable |
|---|
| | | > |
|---|
| | | <template #default="{ item }"> |
|---|
| | | {{ item.label }} |
|---|
| | | </template> |
|---|
| | | </el-select-v2> |
|---|
| | | <el-select |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | v-show="!item.hidden" |
|---|
| | | style="width: 100%" |
|---|
| | | :size="size" |
|---|
| | | v-else-if="item.remote || item.url" |
|---|
| | | v-model="formFields[item.field]" |
|---|
| | | filterable |
|---|
| | | :multiple="item.type == 'select' ? false : true" |
|---|
| | | :placeholder="item.placeholder ? item.placeholder : item.title" |
|---|
| | | clearable |
|---|
| | | :remote-method=" |
|---|
| | | (val) => { |
|---|
| | | remoteSearch(item, formFields, val); |
|---|
| | | } |
|---|
| | | " |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="item in item.data" |
|---|
| | | :key="item.key" |
|---|
| | | :label="item.value" |
|---|
| | | :value="item.key" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | <el-select |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | v-show="!item.hidden" |
|---|
| | | style="width: 100%" |
|---|
| | | :size="size" |
|---|
| | | v-else |
|---|
| | | v-model="formFields[item.field]" |
|---|
| | | filterable |
|---|
| | | :multiple="item.type == 'select' ? false : true" |
|---|
| | | :placeholder="item.placeholder ? item.placeholder : item.title" |
|---|
| | | :allow-create="item.autocomplete" |
|---|
| | | @change=" |
|---|
| | | (val) => { |
|---|
| | | item.onChange(val, item.data); |
|---|
| | | } |
|---|
| | | " |
|---|
| | | clearable |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-show="!item.hidden" |
|---|
| | | :disabled="item.disabled" |
|---|
| | | v-for="item in item.data" |
|---|
| | | :key="item.key" |
|---|
| | | :label="item.value" |
|---|
| | | :value="item.key" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <el-switch |
|---|
| | | v-show="!item.hidden" |
|---|
| | | v-else-if="item.type == 'switch'" |
|---|
| | | v-model="formFields[item.field]" |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | active-color="#0f84ff" |
|---|
| | | @change="item.onChange" |
|---|
| | | inactive-color="rgb(194 194 194)" |
|---|
| | | :active-value=" |
|---|
| | | typeof formFields[item.field] == 'boolean' |
|---|
| | | ? true |
|---|
| | | : typeof formFields[item.field] == 'string' |
|---|
| | | ? '1' |
|---|
| | | : 1 |
|---|
| | | " |
|---|
| | | :inactive-value=" |
|---|
| | | typeof formFields[item.field] == 'boolean' |
|---|
| | | ? false |
|---|
| | | : typeof formFields[item.field] == 'string' |
|---|
| | | ? '0' |
|---|
| | | : 0 |
|---|
| | | " |
|---|
| | | > |
|---|
| | | </el-switch> |
|---|
| | | |
|---|
| | | <el-radio-group |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | v-show="!item.hidden" |
|---|
| | | v-model="formFields[item.field]" |
|---|
| | | v-else-if="item.type == 'radio'" |
|---|
| | | @change="item.onChange" |
|---|
| | | > |
|---|
| | | <el-radio |
|---|
| | | v-for="kv in item.data" |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | :key="kv.key" |
|---|
| | | :label="kv.key" |
|---|
| | | >{{ kv.value }}</el-radio |
|---|
| | | > |
|---|
| | | </el-radio-group> |
|---|
| | | |
|---|
| | | <el-checkbox-group |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | v-show="!item.hidden" |
|---|
| | | v-model="formFields[item.field]" |
|---|
| | | v-else-if="item.type == 'checkbox'" |
|---|
| | | @change="item.onChange" |
|---|
| | | > |
|---|
| | | <el-checkbox |
|---|
| | | v-for="kv in item.data" |
|---|
| | | :key="kv.key" |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | :label="kv.key" |
|---|
| | | >{{ kv.value }}</el-checkbox |
|---|
| | | > |
|---|
| | | </el-checkbox-group> |
|---|
| | | <div |
|---|
| | | class="v-date-range" |
|---|
| | | style="display: flex" |
|---|
| | | v-else-if=" |
|---|
| | | ['date', 'datetime'].indexOf(item.type) != -1 && item.range |
|---|
| | | " |
|---|
| | | > |
|---|
| | | <el-date-picker |
|---|
| | | :size="size" |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | style="flex: 1; width: auto" |
|---|
| | | v-model="formFields[item.field][0]" |
|---|
| | | :type="item.type == 'date' ? 'date' : 'datetime'" |
|---|
| | | :disabledDate="(val) => getDateOptions(val, item)" |
|---|
| | | placeholder="å¼å§æ¶é´" |
|---|
| | | @change=" |
|---|
| | | (val) => { |
|---|
| | | dateRangeChange(val, item); |
|---|
| | | } |
|---|
| | | " |
|---|
| | | :value-format="getDateFormat(item)" |
|---|
| | | > |
|---|
| | | </el-date-picker> |
|---|
| | | <span style="margin: 0px 5px; font-size: 13px; color: #6f6b6b" |
|---|
| | | >è³</span |
|---|
| | | > |
|---|
| | | <el-date-picker |
|---|
| | | :size="size" |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | style="flex: 1; width: auto" |
|---|
| | | v-model="formFields[item.field][1]" |
|---|
| | | placeholder="ç»ææ¶é´" |
|---|
| | | :type="item.type == 'date' ? 'date' : 'datetime'" |
|---|
| | | :disabledDate="(val) => getDateOptions(val, item)" |
|---|
| | | @change=" |
|---|
| | | (val) => { |
|---|
| | | dateRangeChange(val, item); |
|---|
| | | } |
|---|
| | | " |
|---|
| | | :value-format="getDateFormat(item)" |
|---|
| | | > |
|---|
| | | </el-date-picker> |
|---|
| | | </div> |
|---|
| | | <!-- v-showä¸æ·»å æ ¹èç¹å°±ä¼æ¥é没ææ ¹ç¹è --> |
|---|
| | | <div |
|---|
| | | v-show="!item.hidden" |
|---|
| | | style="width: 100%" |
|---|
| | | v-else-if="['date', 'datetime', 'month'].indexOf(item.type) != -1" |
|---|
| | | > |
|---|
| | | <el-date-picker |
|---|
| | | :size="size" |
|---|
| | | clearable |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | style="width: 100%" |
|---|
| | | v-model="formFields[item.field]" |
|---|
| | | @change="item.onChange" |
|---|
| | | :type="item.type" |
|---|
| | | :placeholder=" |
|---|
| | | item.placeholder ? item.placeholder : '请éæ©' + item.title |
|---|
| | | " |
|---|
| | | :disabledDate="(val) => getDateOptions(val, item)" |
|---|
| | | :value-format="getDateFormat(item)" |
|---|
| | | > |
|---|
| | | </el-date-picker> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <el-time-picker |
|---|
| | | :size="size" |
|---|
| | | v-else-if="item.type == 'time'" |
|---|
| | | v-model="formFields[item.field]" |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | placeholder="请éæ©æ¶é´" |
|---|
| | | :value-format="item.format || 'HH:mm:ss'" |
|---|
| | | :format="item.format" |
|---|
| | | style="width: 100%" |
|---|
| | | > |
|---|
| | | </el-time-picker> |
|---|
| | | |
|---|
| | | <el-scrollbar |
|---|
| | | style="border: 1px solid #c7d8db; border-radius: 5px" |
|---|
| | | :height="item.height || 150" |
|---|
| | | v-else-if=" |
|---|
| | | item.type == 'editor' && (item.readonly || item.disabled) |
|---|
| | | " |
|---|
| | | > |
|---|
| | | <div ref="editor" v-html="formFields[item.field]"></div> |
|---|
| | | </el-scrollbar> |
|---|
| | | |
|---|
| | | <vol-wang-editor |
|---|
| | | ref="editor" |
|---|
| | | v-else-if="item.type == 'editor'" |
|---|
| | | :url="item.url || editor.uploadImgUrl" |
|---|
| | | :upload="item.upload || editor.upload" |
|---|
| | | v-model="formFields[item.field]" |
|---|
| | | :height="item.height || 350" |
|---|
| | | ></vol-wang-editor> |
|---|
| | | |
|---|
| | | <vol-upload |
|---|
| | | v-show="!item.hidden" |
|---|
| | | v-else-if="isFile(item, formFields)" |
|---|
| | | :desc="item.desc" |
|---|
| | | :multiple="item.multiple" |
|---|
| | | :max-file="item.maxFile" |
|---|
| | | :max-size="item.maxSize" |
|---|
| | | :autoUpload="item.autoUpload" |
|---|
| | | :fileInfo="formFields[item.field]" |
|---|
| | | :url="item.url" |
|---|
| | | :img="item.type == 'img' || item.columnType == 'img'" |
|---|
| | | :excel="item.type == 'excel'" |
|---|
| | | :fileTypes="item.fileTypes ? item.fileTypes : []" |
|---|
| | | :upload-before="item.uploadBefore" |
|---|
| | | :upload-after="item.uploadAfter" |
|---|
| | | :append="item.multiple" |
|---|
| | | :on-change=" |
|---|
| | | (files) => { |
|---|
| | | return fileOnChange(files, item); |
|---|
| | | } |
|---|
| | | " |
|---|
| | | :file-click="item.fileClick" |
|---|
| | | :remove-before="item.removeBefore" |
|---|
| | | :downLoad="item.downLoad ? true : false" |
|---|
| | | ></vol-upload> |
|---|
| | | <el-cascader |
|---|
| | | :size="size" |
|---|
| | | clearable |
|---|
| | | style="width: 100%; margin-top: -3px" |
|---|
| | | v-model="formFields[item.field]" |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | v-else-if="item.type == 'cascader'" |
|---|
| | | :options="item.data" |
|---|
| | | :props="{ |
|---|
| | | checkStrictly: item.changeOnSelect || item.checkStrictly |
|---|
| | | }" |
|---|
| | | @change="item.onChange" |
|---|
| | | > |
|---|
| | | </el-cascader> |
|---|
| | | <el-rate |
|---|
| | | v-else-if="item.type == 'rate'" |
|---|
| | | @change=" |
|---|
| | | (val) => { |
|---|
| | | item.onChange && item.onChange(val); |
|---|
| | | } |
|---|
| | | " |
|---|
| | | :max="item.max" |
|---|
| | | v-model="formFields[item.field]" |
|---|
| | | /> |
|---|
| | | <div |
|---|
| | | style="display: flex" |
|---|
| | | v-else-if="item.type == 'range' || item.range" |
|---|
| | | > |
|---|
| | | <el-input |
|---|
| | | :size="size" |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | style="flex: 1" |
|---|
| | | v-model="formFields[item.field][0]" |
|---|
| | | clearable |
|---|
| | | /> |
|---|
| | | <span style="margin: 0 5px">-</span> |
|---|
| | | <el-input |
|---|
| | | :size="size" |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | style="flex: 1" |
|---|
| | | v-model="formFields[item.field][1]" |
|---|
| | | clearable |
|---|
| | | /> |
|---|
| | | </div> |
|---|
| | | <el-input |
|---|
| | | :size="size" |
|---|
| | | clearable |
|---|
| | | :ref="item.field" |
|---|
| | | :input-style="item.inputStyle" |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | v-else-if="item.type == 'textarea'" |
|---|
| | | v-model="formFields[item.field]" |
|---|
| | | type="textarea" |
|---|
| | | :autosize="{ |
|---|
| | | minRows: item.minRows || 2, |
|---|
| | | maxRows: item.maxRows || 10 |
|---|
| | | }" |
|---|
| | | :placeholder="item.placeholder ? item.placeholder : item.title" |
|---|
| | | /> |
|---|
| | | <el-input-number |
|---|
| | | :size="size" |
|---|
| | | style="width: 100%" |
|---|
| | | :ref="item.field" |
|---|
| | | :input-style="item.inputStyle" |
|---|
| | | v-else-if="item.type == 'number'" |
|---|
| | | v-model="formFields[item.field]" |
|---|
| | | :min="item.min" |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | :max="item.max" |
|---|
| | | controls-position="right" |
|---|
| | | /> |
|---|
| | | <el-input |
|---|
| | | :size="size" |
|---|
| | | clearable |
|---|
| | | :input-style="item.inputStyle" |
|---|
| | | v-else-if="item.type == 'password'" |
|---|
| | | type="password" |
|---|
| | | v-model="formFields[item.field]" |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | v-show="!item.hidden" |
|---|
| | | :placeholder="item.placeholder ? item.placeholder : item.title" |
|---|
| | | /> |
|---|
| | | <!-- 2021.11.18ä¿®å¤el-input没æé»è®¤enteräºä»¶æ¶å车å¼å¸¸ --> |
|---|
| | | <el-input |
|---|
| | | :size="size" |
|---|
| | | clearable |
|---|
| | | :ref="item.field" |
|---|
| | | :input-style="item.inputStyle" |
|---|
| | | v-else-if="item.onKeyPress" |
|---|
| | | :placeholder="item.placeholder ? item.placeholder : item.title" |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | v-show="!item.hidden" |
|---|
| | | v-model="formFields[item.field]" |
|---|
| | | @keypress=" |
|---|
| | | ($event) => { |
|---|
| | | onKeyPress($event, item); |
|---|
| | | } |
|---|
| | | " |
|---|
| | | @change="item.onKeyPress" |
|---|
| | | @keyup.enter="item.onKeyPress" |
|---|
| | | ></el-input> |
|---|
| | | <el-input |
|---|
| | | :size="size" |
|---|
| | | clearable |
|---|
| | | v-else |
|---|
| | | :ref="item.field" |
|---|
| | | :input-style="item.inputStyle" |
|---|
| | | :placeholder="item.placeholder ? item.placeholder : item.title" |
|---|
| | | :disabled="item.readonly || item.disabled" |
|---|
| | | v-show="!item.hidden" |
|---|
| | | v-model="formFields[item.field]" |
|---|
| | | ></el-input> |
|---|
| | | |
|---|
| | | <div class="form-extra" v-if="item.extra"> |
|---|
| | | <form-expand |
|---|
| | | v-if="item.extra.render" |
|---|
| | | :render="item.extra.render" |
|---|
| | | ></form-expand> |
|---|
| | | <a |
|---|
| | | v-else-if="item.extra.click" |
|---|
| | | :style="item.extra.style" |
|---|
| | | @click="item.extra.click(item, formFields[item.field])" |
|---|
| | | > |
|---|
| | | <i v-if="item.extra.icon" :class="item.extra.icon" /> |
|---|
| | | {{ item.extra.text }} |
|---|
| | | </a> |
|---|
| | | <a v-else :style="item.extra.style"> |
|---|
| | | <i v-if="item.extra.icon" :class="item.extra.icon" /> |
|---|
| | | {{ item.extra.text }} |
|---|
| | | </a> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </el-form-item> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <slot></slot> |
|---|
| | | <div style="width: 100%"> |
|---|
| | | <slot name="footer"></slot> |
|---|
| | | </div> |
|---|
| | | </el-form> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | const rule = { |
|---|
| | | change: [ |
|---|
| | | 'checkbox', |
|---|
| | | 'select', |
|---|
| | | 'date', |
|---|
| | | 'datetime', |
|---|
| | | 'drop', |
|---|
| | | 'radio', |
|---|
| | | 'cascader' |
|---|
| | | ], // 2020.05.31å¢å 级èç±»å |
|---|
| | | phone: /^[1][3,4,5,6,7,8,9][0-9]{9}$/, |
|---|
| | | decimal: /(^[\-0-9][0-9]*(.[0-9]+)?)$/, |
|---|
| | | number: /(^[\-0-9][0-9]*([0-9]+)?)$/ |
|---|
| | | }; |
|---|
| | | const inputTypeArr = ['text', 'string', 'mail', 'textarea', 'password']; |
|---|
| | | const types = { |
|---|
| | | int: 'number', |
|---|
| | | byte: 'number', |
|---|
| | | decimal: 'number', // "float", |
|---|
| | | string: 'string', |
|---|
| | | bool: 'boolean', |
|---|
| | | date: 'datetime', |
|---|
| | | date: 'date', |
|---|
| | | mail: 'email' |
|---|
| | | }; |
|---|
| | | //表åéªè¯æ³¨æï¼æ¯æ¬¡éªè¯é½å¿
é¡»æ§è¡callback,å¦åéªè¯ä¸æ§è¡åè°æ¹æ³ |
|---|
| | | const colPow = Math.pow(10, 3); |
|---|
| | | import FormExpand from './VolForm/VolFormRender'; |
|---|
| | | import { |
|---|
| | | defineAsyncComponent, |
|---|
| | | defineComponent, |
|---|
| | | ref, |
|---|
| | | reactive, |
|---|
| | | toRefs, |
|---|
| | | getCurrentInstance, |
|---|
| | | onMounted, |
|---|
| | | watch |
|---|
| | | } from 'vue'; |
|---|
| | | export default defineComponent({ |
|---|
| | | components: { |
|---|
| | | FormExpand, |
|---|
| | | 'vol-upload': defineAsyncComponent(() => |
|---|
| | | import('@/components/basic/VolUpload.vue') |
|---|
| | | ), |
|---|
| | | 'vol-wang-editor': defineAsyncComponent(() => |
|---|
| | | import('@/components/editor/VolWangEditor.vue') |
|---|
| | | ) |
|---|
| | | }, |
|---|
| | | props: { |
|---|
| | | loadKey: { |
|---|
| | | // æ¯å¦å è½½formRuleså段é
ç½®çæ°æ®æº |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | width: { |
|---|
| | | // 表å宽度 |
|---|
| | | type: Number, |
|---|
| | | default: 0 |
|---|
| | | }, |
|---|
| | | labelWidth: { |
|---|
| | | // 表å左边labelæåæ ç¾ç宽度 |
|---|
| | | type: Number, |
|---|
| | | default: 100 |
|---|
| | | }, |
|---|
| | | formRules: { |
|---|
| | | // 表åé
ç½®è§åï¼å¦å段类åï¼æ¯å¦å¿
å¡« |
|---|
| | | type: Array, |
|---|
| | | default: [] |
|---|
| | | }, |
|---|
| | | formFields: { |
|---|
| | | type: Object, |
|---|
| | | default: () => { |
|---|
| | | return {}; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | editor: { |
|---|
| | | // 2021.01.16ç¼è¾å¨ä¿¡æ¯ {uploadImgUrl:"",upload:null//ä¸ä¼ æ¹æ³} |
|---|
| | | type: Object, |
|---|
| | | default: () => { |
|---|
| | | return {}; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | size: { |
|---|
| | | type: String, //large / default / small |
|---|
| | | default: 'large' |
|---|
| | | }, |
|---|
| | | select2Count: { |
|---|
| | | //è¶
åºæ°éæ¾ç¤ºselect2ç»ä»¶ |
|---|
| | | type: Number, |
|---|
| | | default: 500 |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | rules() { |
|---|
| | | let ruleResult = {}; |
|---|
| | | this.formRules.forEach((option, xIndex) => { |
|---|
| | | option.forEach((item) => { |
|---|
| | | ruleResult[item.field] = [this.getRule(item, this.formFields)]; |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | if (this.$refs.volform) { |
|---|
| | | setTimeout(() => { |
|---|
| | | this.$refs.volform.clearValidate(); |
|---|
| | | }, 100); |
|---|
| | | } |
|---|
| | | return ruleResult; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | setup(props, context) { |
|---|
| | | const { appContext, proxy } = getCurrentInstance(); |
|---|
| | | const remoteCall = ref(true); |
|---|
| | | const span = ref(1); |
|---|
| | | const rangeFields = toRefs([]); |
|---|
| | | const volform = ref(null); |
|---|
| | | const numberFields = toRefs([]); |
|---|
| | | onMounted(() => {}); |
|---|
| | | const initFormRules = (init) => { |
|---|
| | | if (props.loadKey) { |
|---|
| | | initSource(); |
|---|
| | | } |
|---|
| | | props.formRules.forEach((row, xIndex) => { |
|---|
| | | if (row.length > span.value) span.value = row.length; |
|---|
| | | let _count = 0, |
|---|
| | | _size = 0; |
|---|
| | | row.forEach((x) => { |
|---|
| | | if (x.colSize > 0) { |
|---|
| | | _size = _size + x.colSize; |
|---|
| | | _count++; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | if (_count > 0 && row.length - _count > 0) { |
|---|
| | | let _cellSize = (12 - _size) / (row.length - _count); |
|---|
| | | row.forEach((x) => { |
|---|
| | | if (!x.colSize) { |
|---|
| | | x.colSize = _cellSize; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | row.forEach((item, yIndex) => { |
|---|
| | | if (item.type == 'number') { |
|---|
| | | numberFields.push(item.field); |
|---|
| | | } |
|---|
| | | // ç®ååªæ¯æselectåéè¿ç¨æç´¢ï¼remoteè¿ç¨ä»åå°åå
¸æ°æ®æºè¿è¡æç´¢ï¼urlä»æå®çurlæç´¢ |
|---|
| | | if (item.remote || item.url) { |
|---|
| | | // item.remoteData = []; |
|---|
| | | item.loading = false; |
|---|
| | | item.point = { x: xIndex, y: yIndex }; |
|---|
| | | } |
|---|
| | | // åå§åä¸ä¼ æä»¶ä¿¡æ¯ |
|---|
| | | initUpload(item, init); |
|---|
| | | // åå§åæ°æ®æºç©ºå¯¹è±¡ |
|---|
| | | if (item.dataKey) { |
|---|
| | | // ä¸ææ¡é½å¼ºå¶è®¾ç½®ä¸ºå符串类å |
|---|
| | | item.columnType = 'string'; |
|---|
| | | if (!item.data) { |
|---|
| | | item.data = []; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (item.range || item.type == 'range') { |
|---|
| | | if ( |
|---|
| | | !(props.formFields[item.field] instanceof Array) || |
|---|
| | | props.formFields[item.field].length != 2 |
|---|
| | | ) { |
|---|
| | | props.formFields[item.field] = ['', '']; |
|---|
| | | } |
|---|
| | | rangeFields.push(item.field); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | |
|---|
| | | const initSource = () => { |
|---|
| | | let keys = [], |
|---|
| | | binds = []; |
|---|
| | | // åå§ååå
¸æ°æ®æº |
|---|
| | | props.formRules.forEach((item) => { |
|---|
| | | item.forEach((x) => { |
|---|
| | | if (x.dataKey && (!x.data || x.data.length == 0) && !x.remote) { |
|---|
| | | x.data = []; |
|---|
| | | binds.push({ key: x.dataKey, data: x.data, type: x.type }); |
|---|
| | | if (keys.indexOf(x.dataKey) == -1) { |
|---|
| | | keys.push(x.dataKey); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | |
|---|
| | | if (keys.length == 0) return; |
|---|
| | | appContext.config.globalProperties.http |
|---|
| | | .post('/api/Sys_Dictionary/GetVueDictionary', keys) |
|---|
| | | .then((dic) => { |
|---|
| | | bindOptions(dic, binds); |
|---|
| | | proxy.$emit('dicInited', dic); |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | const bindOptions = (dic, binds) => { |
|---|
| | | dic.forEach((d) => { |
|---|
| | | if (d.data.length > props.select2Count) { |
|---|
| | | if ( |
|---|
| | | !binds.some((x) => { |
|---|
| | | return x.key == d.dicNo && x.type == 'cascader'; |
|---|
| | | }) |
|---|
| | | ) { |
|---|
| | | d.data.forEach((item) => { |
|---|
| | | item.label = item.value; |
|---|
| | | item.value = item.key; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | binds.forEach((x) => { |
|---|
| | | if (x.key != d.dicNo) return true; |
|---|
| | | // å¦æææ°æ®çåä¸æ¥è¯¢ |
|---|
| | | if (x.data.length > 0) return true; |
|---|
| | | //2022.03.13å¢å 级èæ°æ®æºèªå¨è½¬æ¢ |
|---|
| | | if (x.type == 'cascader' || x.type == 'treeSelect') { |
|---|
| | | let _data = JSON.parse(JSON.stringify(d.data)); |
|---|
| | | let cascaderArr = appContext.config.globalProperties.base.convertTree( |
|---|
| | | _data, |
|---|
| | | (node, data, isRoot) => { |
|---|
| | | if (!node.inited) { |
|---|
| | | node.inited = true; |
|---|
| | | node.label = node.value; |
|---|
| | | node.value = node.key; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ); |
|---|
| | | props.formRules.forEach((option) => { |
|---|
| | | option.forEach((item) => { |
|---|
| | | if (item.dataKey == x.key) { |
|---|
| | | item.orginData = x.data; |
|---|
| | | item.data = cascaderArr; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | } else if (d.data.length > 0 && !d.data[0].hasOwnProperty('key')) { |
|---|
| | | let source = d.data, |
|---|
| | | newSource = new Array(source.length); |
|---|
| | | for (let index = 0; index < source.length; index++) { |
|---|
| | | newSource[index] = { |
|---|
| | | key: source['key'] + '', |
|---|
| | | value: source['value'] |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | x.data.push(...newSource); |
|---|
| | | } else { |
|---|
| | | x.data.push(...d.data); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | |
|---|
| | | const initUpload = (item, init) => { |
|---|
| | | if (!init) return; |
|---|
| | | if ( |
|---|
| | | ['img', 'excel', 'file'].indexOf(item.type != -1) || |
|---|
| | | item.columnType == 'img' |
|---|
| | | ) { |
|---|
| | | // åªæ¯æ²¡è®¾ç½®æ¯å¦èªå¨ä¸ä¼ çï¼é»è®¤é½æ¯éæ©æ件åèªå¨ä¸ä¼ |
|---|
| | | if (!item.hasOwnProperty('autoUpload')) { |
|---|
| | | item.autoUpload = true; |
|---|
| | | } |
|---|
| | | if (!item.hasOwnProperty('fileList')) { |
|---|
| | | item.fileList = true; |
|---|
| | | } |
|---|
| | | if (!item.hasOwnProperty('downLoad')) { |
|---|
| | | item.downLoad = true; |
|---|
| | | } |
|---|
| | | if (!item.removeBefore) { |
|---|
| | | item.removeBefore = (index, file, files) => { |
|---|
| | | return true; |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | if (!item.fileClick) { |
|---|
| | | item.fileClick = (index, file, files) => { |
|---|
| | | return true; |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | if (!item.onChange) { |
|---|
| | | item.onChange = (files) => { |
|---|
| | | return true; |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | if (!item.uploadAfter) { |
|---|
| | | item.uploadAfter = (result, files) => { |
|---|
| | | return true; |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | if (!item.uploadBefore) { |
|---|
| | | item.uploadBefore = (files) => { |
|---|
| | | return true; |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | const validate = (callback) => { |
|---|
| | | let result = true; |
|---|
| | | volform.value.validate((valid) => { |
|---|
| | | if (!valid) { |
|---|
| | | appContext.config.globalProperties.$message.error('æ°æ®éªè¯æªéè¿!'); |
|---|
| | | result = false; |
|---|
| | | } else if (typeof callback === 'function') { |
|---|
| | | try { |
|---|
| | | callback(valid); |
|---|
| | | } catch (error) { |
|---|
| | | let msg = `表åéªè¯åè°æ¹æ³å¼å¸¸ï¼${error.message}`; |
|---|
| | | appContext.config.globalProperties.$message.error(msg); |
|---|
| | | console.log(msg); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | return result; |
|---|
| | | }; |
|---|
| | | |
|---|
| | | initFormRules(true); |
|---|
| | | return { |
|---|
| | | remoteCall, |
|---|
| | | span, |
|---|
| | | rangeFields, |
|---|
| | | numberFields, |
|---|
| | | validate, |
|---|
| | | volform |
|---|
| | | // initFormRules, |
|---|
| | | // initSource |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | created() { |
|---|
| | | this.formRules.forEach((rules) => { |
|---|
| | | rules.forEach((option) => { |
|---|
| | | if (option.type == 'treeSelect' && option.multiple === undefined) { |
|---|
| | | option.multiple = true; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | // remoteCall: true, |
|---|
| | | errorImg: 'this.src="' + require('@/assets/imgs/error-img.png') + '"' |
|---|
| | | // span: 1, |
|---|
| | | // rangeFields: [], |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | getColWidth(item) { |
|---|
| | | //2021.08.30 å¢å å¨æ计ç®è¡¨å宽度 |
|---|
| | | let _span = 0; |
|---|
| | | this.formRules.forEach((row, xIndex) => { |
|---|
| | | //2022.05.06 追å 表åä¸éèçå
ç´ ä¸åä¸å¨æ计ç®è¡¨å宽度 |
|---|
| | | let rowLength = row.filter((item) => { |
|---|
| | | return !item.hidden; |
|---|
| | | }).length; |
|---|
| | | if (rowLength > _span) _span = rowLength; |
|---|
| | | }); |
|---|
| | | let rete = |
|---|
| | | Math.round(((item.colSize || 12 / _span) / 0.12) * colPow, 10.0) / |
|---|
| | | colPow; |
|---|
| | | if (item.colSize) return rete.toFixed(3); |
|---|
| | | return rete.toFixed(3); |
|---|
| | | // return (100 - rete).toFixed(3); |
|---|
| | | }, |
|---|
| | | previewImg(url) { |
|---|
| | | this.base.previewImg(url, this.http.ipAddress); |
|---|
| | | }, |
|---|
| | | getSrc(path) { |
|---|
| | | if (!path) return; |
|---|
| | | if (!this.base.isUrl(path) && path.indexOf('.') != -1) { |
|---|
| | | return this.http.ipAddress + path; |
|---|
| | | } |
|---|
| | | return path; |
|---|
| | | }, |
|---|
| | | // æ¯å¦ä¸ºå¾çæ件çæ ¼å¼å¹¶å¯¹å段ç转æ¢ææ°ç»ï¼[{name:'1.jpg',path:'127.0.0.1/ff/1.jpg'}] |
|---|
| | | isFile(item, formFields) { |
|---|
| | | if ( |
|---|
| | | item.type == 'img' || |
|---|
| | | item.columnType == 'img' || |
|---|
| | | item.type == 'excel' || |
|---|
| | | item.type == 'file' |
|---|
| | | ) { |
|---|
| | | this.convertFileToArray(item, formFields); |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | return false; |
|---|
| | | }, |
|---|
| | | isReadonlyImgFile(item, formFields) { |
|---|
| | | if ((item.disabled || item.readonly) && this.isFile(item, formFields)) { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | return false; |
|---|
| | | }, |
|---|
| | | convertFileToArray(item, formFields) { |
|---|
| | | if (!item.maxFile) { |
|---|
| | | item.maxFile = 1; // é»è®¤åªè½ä¸ä¼ ä¸ä¸ªæ件ï¼å¯ä»¥å¨onInitä¸è®¾ç½® |
|---|
| | | } |
|---|
| | | |
|---|
| | | let fileInfo = formFields[item.field]; |
|---|
| | | if (fileInfo instanceof Array) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | if (fileInfo === null || fileInfo === undefined) { |
|---|
| | | formFields[item.field] = []; |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | // å°ä»¥éå·éå¼çæ件åå²ææ°ç»127.0.0.1/aa/1.jpg,å°127.0.0.1/aa/2.jpg |
|---|
| | | if (typeof fileInfo === 'string') { |
|---|
| | | if (fileInfo.trim() === '') { |
|---|
| | | formFields[item.field] = []; |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | // å¦ææ件路å¾æ¯å符串ï¼å使ç¨ï¼æå |
|---|
| | | fileInfo = fileInfo.replace(/\\/g, '/'); |
|---|
| | | let files = fileInfo.split(','); |
|---|
| | | formFields[item.field] = []; |
|---|
| | | for (let index = 0; index < files.length; index++) { |
|---|
| | | let file = files[index]; |
|---|
| | | let splitFile = file.split('/'); |
|---|
| | | formFields[item.field].push({ |
|---|
| | | name: splitFile.length > 0 ? splitFile[splitFile.length - 1] : file, |
|---|
| | | path: file // this.base.isUrl(file) ? file : this.http.ipAddress + file, |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | dowloadFile(file) { |
|---|
| | | this.base.dowloadFile( |
|---|
| | | file.path, |
|---|
| | | file.name, |
|---|
| | | { |
|---|
| | | Authorization: this.$store.getters.getToken() |
|---|
| | | }, |
|---|
| | | this.http.ipAddress |
|---|
| | | ); |
|---|
| | | }, |
|---|
| | | validatorPhone(ruleOption, value, callback) { |
|---|
| | | if (!ruleOption.required && !value && value != '0') { |
|---|
| | | return callback(); |
|---|
| | | } |
|---|
| | | if (!rule.phone.test((value || '').trim())) { |
|---|
| | | return callback(new Error('请è¾å
¥æ£ç¡®çææºå·')); |
|---|
| | | } |
|---|
| | | callback(); |
|---|
| | | }, |
|---|
| | | validatorPwd(ruleOption, value, callback) { |
|---|
| | | if (!ruleOption.required && !value && value != '0') { |
|---|
| | | return callback(); |
|---|
| | | } |
|---|
| | | if ((value + '').trim().length < 6) { |
|---|
| | | return callback(new Error('å¯ç é¿åº¦ä¸è½å°äº6ä½')); |
|---|
| | | } |
|---|
| | | callback(); |
|---|
| | | }, |
|---|
| | | convertArrayValue(data, val) { |
|---|
| | | // 2020.12.13å¢å 表åå¤éåªè½¬æ¢åå
¸ |
|---|
| | | // ç¼è¾å¤étableæ¾ç¤º |
|---|
| | | //2023.04.20ä¿®å¤åªè¯»ä¸ºlabelæ¶åæ°æ®è¢«åå
¸æ¿æ¢äºçé®é¢ |
|---|
| | | let valArr = Array.isArray(val) |
|---|
| | | ? val.map((x) => { |
|---|
| | | return x; |
|---|
| | | }) |
|---|
| | | : val.split(','); |
|---|
| | | for (let index = 0; index < valArr.length; index++) { |
|---|
| | | var _item = data.find((x) => { |
|---|
| | | return x.key && x.key != '0' && x.key + '' == valArr[index] + ''; |
|---|
| | | }); |
|---|
| | | if (_item) { |
|---|
| | | valArr[index] = _item.value; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | return valArr.join(','); |
|---|
| | | }, |
|---|
| | | getText(formFields, item) { |
|---|
| | | // 2019.10.24ä¿®å¤è¡¨åselectç»ä»¶ä¸ºåªè¯»çå±æ§æ¶æ²¡æç»å®æ°æ®æº |
|---|
| | | let text = formFields[item.field]; |
|---|
| | | if (typeof text === 'function') return text(formFields); |
|---|
| | | if (text === 'null' || text === '' || text === null || text === undefined) |
|---|
| | | return '--'; |
|---|
| | | //2021.03.02å¢å åªè¯»æ¶æ¥æå¤ç |
|---|
| | | if (item.type == 'date') { |
|---|
| | | return text.replace('T', ' ').split(' ')[0]; |
|---|
| | | } |
|---|
| | | //2021.03.31ä¿®å¤è¡¨åswitchåªè¯»æ¶æ²¡æ转æ¢å¼çé®é¢ |
|---|
| | | if (item.type == 'switch') { |
|---|
| | | return text ? 'æ¯' : 'å¦'; |
|---|
| | | } |
|---|
| | | if (!item.data) return text; |
|---|
| | | if (item.type == 'selectList' || item.type == 'checkbox') { |
|---|
| | | return this.convertArrayValue(item.data, text); |
|---|
| | | } |
|---|
| | | var _item = item.data.find((x) => { |
|---|
| | | return x.key == text; |
|---|
| | | }); |
|---|
| | | return _item ? _item.value : text; |
|---|
| | | }, |
|---|
| | | onClear(item, formFields) { |
|---|
| | | // è¿ç¨selectæ ç¾æ¸
空é项 |
|---|
| | | item.data.splice(0); |
|---|
| | | // console.log(2); |
|---|
| | | }, |
|---|
| | | onChange(item, value) { |
|---|
| | | if (item.onChange && typeof item.onChange === 'function') { |
|---|
| | | item.onChange(value, item); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | onRemoteChange(item, value) { |
|---|
| | | // 第äºæ¬¡æå¼æ¶ï¼é»è®¤å¼æäºundefinedï¼å¾
æ¥viewgridä¸é置代ç |
|---|
| | | if (value == undefined && item.data.length > 0) { |
|---|
| | | this.formFields[item.field] = item.data[0].key; |
|---|
| | | // console.log('undefined'); |
|---|
| | | } |
|---|
| | | this.remoteCall = false; |
|---|
| | | if (item.onChange && typeof item.onChange === 'function') { |
|---|
| | | item.onChange(value, item); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | getData(item) { |
|---|
| | | return item.data; |
|---|
| | | }, |
|---|
| | | |
|---|
| | | // è¿ç¨æç´¢(æå¼å¼¹åºæ¡æ¶åºè¯¥ç¦æ¢æç´¢) |
|---|
| | | remoteSearch(item, formFields, val) { |
|---|
| | | if (!item.remote && !item.url) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | if ( |
|---|
| | | val == '' || |
|---|
| | | (item.data.length == 1 && |
|---|
| | | (val == item.data[0].key || val == item.data[0].value)) |
|---|
| | | ) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | // å¼¹åºæ¡æåå§å表åæ¶ç»data设置æ°ç»é»è®¤å¼2 |
|---|
| | | // 2020.09.26ä¿®å¤è¿ç¨æç´¢èªå®ä¹urlä¸èµ·ä½ç¨çé®é¢ |
|---|
| | | let url; |
|---|
| | | if (typeof item.url === 'function') { |
|---|
| | | url = item.url(val, item.dataKey, item); |
|---|
| | | } else { |
|---|
| | | url = |
|---|
| | | (item.url || '/api/Sys_Dictionary/GetSearchDictionary') + |
|---|
| | | '?dicNo=' + |
|---|
| | | item.dataKey + |
|---|
| | | '&value=' + |
|---|
| | | val; |
|---|
| | | } |
|---|
| | | this.http.post(url).then((dicData) => { |
|---|
| | | //this.$set(item, "loading", false); |
|---|
| | | item.loading = false; |
|---|
| | | item.data = dicData; |
|---|
| | | this.formRules[item.point.x].splice(item.point.y, 1, item); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | getObject(date) { |
|---|
| | | if (typeof date === 'object') { |
|---|
| | | return date; |
|---|
| | | } |
|---|
| | | return new Date(date); |
|---|
| | | }, |
|---|
| | | reset(sourceObj) { |
|---|
| | | // é置表åæ¶ï¼ç¦ç¨è¿ç¨æ¥è¯¢ |
|---|
| | | this.$refs['volform'].resetFields(); |
|---|
| | | if (this.rangeFields.length) { |
|---|
| | | this.rangeFields.forEach((key) => { |
|---|
| | | this.formFields[key].splice(0); |
|---|
| | | this.formFields[key] = [null, null]; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | if (!sourceObj) return; |
|---|
| | | for (const key in this.formFields) { |
|---|
| | | if (sourceObj.hasOwnProperty(key)) { |
|---|
| | | this.formFields[key] = sourceObj[key]; |
|---|
| | | if (this.numberFields.indexOf(key) != -1) { |
|---|
| | | this.formFields[key] = sourceObj[key] * 1 || 0; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | // this.remoteCall = true; |
|---|
| | | }, |
|---|
| | | |
|---|
| | | fileOnChange(files, item) { |
|---|
| | | this.$refs.volform.clearValidate(item.field); |
|---|
| | | if (item.onChange) { |
|---|
| | | return item.onChange(files); |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | isReadonly(item) { |
|---|
| | | return item.readonly || item.disabled; |
|---|
| | | }, |
|---|
| | | getRule(item, formFields) { |
|---|
| | | //2021.07.17å¢å åªè¯»è¡¨åä¸éªè¯ |
|---|
| | | //rangeä¸swtichææ¶ä¸åæ ¡éª |
|---|
| | | if ( |
|---|
| | | // item.readonly || |
|---|
| | | // item.disabled || |
|---|
| | | item.type == 'switch' || |
|---|
| | | item.type == 'range' |
|---|
| | | ) |
|---|
| | | return { required: false }; |
|---|
| | | // ç¨æ·è®¾ç½®çèªå®ä¹æ¹æ³ |
|---|
| | | if (item.validator && typeof item.validator === 'function') { |
|---|
| | | return { |
|---|
| | | validator: (rule, val, callback) => { |
|---|
| | | // ç¨æ·èªå®ä¹çæ¹æ³ï¼å¦æè¿åäºå¼ï¼ç´æ¥æ¾ç¤ºè¿åçå¼ï¼éªè¯ä¸éè¿ |
|---|
| | | let message = item.validator(rule, val); |
|---|
| | | if (message) return callback(new Error(message + '')); |
|---|
| | | return callback(); |
|---|
| | | }, |
|---|
| | | required: item.required, |
|---|
| | | trigger: rule.change.indexOf(item.type) != -1 ? 'change' : 'blur' |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | if (['img', 'excel', 'file'].indexOf(item.type) != -1) { |
|---|
| | | return { |
|---|
| | | validator: (rule, val, callback) => { |
|---|
| | | //2021.09.05移é¤æ件ä¸ä¼ é»è®¤å¿
å¡« |
|---|
| | | if ( |
|---|
| | | item.required && |
|---|
| | | !this.isReadonly(item) && |
|---|
| | | (!val || !val.length) |
|---|
| | | ) { |
|---|
| | | return callback( |
|---|
| | | new Error(item.type == 'img' ? '请ä¸ä¼ ç
§ç' : '请ä¸ä¼ æ件') |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | return callback(); |
|---|
| | | }, |
|---|
| | | required: item.required, |
|---|
| | | trigger: 'change' |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | // 设置æ°åçæ大å¼æ°æå°å¼ |
|---|
| | | if ( |
|---|
| | | item.type == 'number' || |
|---|
| | | item.columnType == 'number' || |
|---|
| | | item.columnType == 'int' || |
|---|
| | | item.type == 'decimal' |
|---|
| | | ) { |
|---|
| | | // å¦ææ¯å¿
填项çæ°åï¼è®¾ç½®ä¸ä¸ªé»è®¤æ大ä¸æå¼å° |
|---|
| | | if (item.required && typeof item.min !== 'number') { |
|---|
| | | item.min = 0; //item.type == "decimal" ? 0.1 : 1; |
|---|
| | | } |
|---|
| | | |
|---|
| | | return { |
|---|
| | | required: item.required, |
|---|
| | | message: item.title + 'åªè½æ¯æ°å', |
|---|
| | | title: item.title, |
|---|
| | | trigger: 'blur', |
|---|
| | | min: item.min, |
|---|
| | | max: item.max, |
|---|
| | | type: item.columnType || item.type, |
|---|
| | | validator: (ruleObj, value, callback) => { |
|---|
| | | if (!ruleObj.min && !ruleObj.max) { |
|---|
| | | if (ruleObj.required) { |
|---|
| | | if ((!value && value != '0') || !rule.decimal.test(value)) { |
|---|
| | | return callback(new Error('åªè½æ¯æ°å')); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | return callback(); |
|---|
| | | } |
|---|
| | | if (this.isReadonly(item)) return callback(); |
|---|
| | | if (ruleObj.type == 'number') { |
|---|
| | | if (!rule.number.test(value)) { |
|---|
| | | ruleObj.message = ruleObj.title + 'åªè½æ¯æ´æ°'; |
|---|
| | | return callback(new Error(ruleObj.message)); |
|---|
| | | } |
|---|
| | | } else { |
|---|
| | | if (!rule.decimal.test(value)) { |
|---|
| | | ruleObj.message = ruleObj.title + 'åªè½æ¯æ°å'; |
|---|
| | | return callback(new Error(ruleObj.message)); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | if ( |
|---|
| | | ruleObj.min !== undefined && |
|---|
| | | typeof ruleObj.min === 'number' && |
|---|
| | | value < ruleObj.min |
|---|
| | | ) { |
|---|
| | | ruleObj.message = ruleObj.title + 'ä¸è½å°äº' + ruleObj.min; |
|---|
| | | return callback(new Error(ruleObj.message)); |
|---|
| | | } |
|---|
| | | if ( |
|---|
| | | ruleObj.max !== undefined && |
|---|
| | | typeof ruleObj.max === 'number' && |
|---|
| | | value > ruleObj.max |
|---|
| | | ) { |
|---|
| | | ruleObj.message = ruleObj.title + 'ä¸è½å¤§äº' + ruleObj.max; |
|---|
| | | return callback(new Error(ruleObj.message)); |
|---|
| | | } |
|---|
| | | return callback(); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | |
|---|
| | | // ææºãå¯ç éªè¯ |
|---|
| | | if (item.type == 'password' || item.type == 'phone') { |
|---|
| | | return { |
|---|
| | | validator: |
|---|
| | | item.type == 'phone' ? this.validatorPhone : this.validatorPwd, |
|---|
| | | required: item.required, |
|---|
| | | trigger: 'blur' |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (!item.required && item.type != 'mail') return { required: false }; |
|---|
| | | |
|---|
| | | if (!item.hasOwnProperty('type')) item.type = 'text'; |
|---|
| | | |
|---|
| | | if (inputTypeArr.indexOf(item.type) != -1) { |
|---|
| | | let message = |
|---|
| | | item.title + |
|---|
| | | (item.type == 'mail' ? 'å¿
é¡»æ¯ä¸ä¸ªé®ç®±å°å' : 'ä¸è½ä¸ºç©º'); |
|---|
| | | let type = item.type == 'mail' ? 'email' : types[item.columnType]; |
|---|
| | | let _rule = { |
|---|
| | | required: true, |
|---|
| | | message: message, |
|---|
| | | trigger: 'blur', |
|---|
| | | type: type, |
|---|
| | | validator: (ruleObj, value, callback) => { |
|---|
| | | if ( |
|---|
| | | !this.isReadonly(item) && |
|---|
| | | (value === '' || value === undefined || value === null) |
|---|
| | | ) { |
|---|
| | | return callback(new Error(ruleObj.message)); |
|---|
| | | } |
|---|
| | | return callback(); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | if (item.type == 'mail') { |
|---|
| | | _rule.validator = undefined; |
|---|
| | | return _rule; |
|---|
| | | } |
|---|
| | | if (item.min) { |
|---|
| | | _rule.min = item.min; |
|---|
| | | _rule.message = item.title + 'è³å°' + item.min + '个å符!'; |
|---|
| | | } |
|---|
| | | if (item.max) { |
|---|
| | | return [ |
|---|
| | | _rule, |
|---|
| | | { |
|---|
| | | max: item.max, |
|---|
| | | required: true, |
|---|
| | | message: item.title + 'æå¤' + item.max + '个å符!', |
|---|
| | | trigger: 'blur' |
|---|
| | | } |
|---|
| | | ]; |
|---|
| | | } |
|---|
| | | return _rule; |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (item.type == 'radio') { |
|---|
| | | return { |
|---|
| | | required: item.required, |
|---|
| | | message: '请éæ©' + item.title, |
|---|
| | | trigger: 'change', |
|---|
| | | type: 'string' |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | if ( |
|---|
| | | item.type == 'date' || |
|---|
| | | item.type == 'datetime' || |
|---|
| | | item.type == 'month' || |
|---|
| | | item.type == 'time' |
|---|
| | | ) { |
|---|
| | | return { |
|---|
| | | required: true, |
|---|
| | | message: '请éæ©' + item.title, |
|---|
| | | trigger: 'change', |
|---|
| | | type: item.range ? 'array' : 'string', |
|---|
| | | validator: (rule, val, callback) => { |
|---|
| | | if (this.isReadonly(item)) return callback(); |
|---|
| | | // ç¨æ·èªå®ä¹çæ¹æ³ï¼å¦æè¿åäºå¼ï¼ç´æ¥æ¾ç¤ºè¿åçå¼ï¼éªè¯ä¸éè¿ |
|---|
| | | if (!val || (item.range && !val.length)) { |
|---|
| | | return callback(new Error('请éæ©æ¥æ')); |
|---|
| | | } |
|---|
| | | return callback(); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (item.type == 'cascader') { |
|---|
| | | return { |
|---|
| | | type: 'array', |
|---|
| | | required: true, |
|---|
| | | min: item.min || 1, |
|---|
| | | // message: "请éæ©" + item.title, |
|---|
| | | trigger: 'change', |
|---|
| | | validator: (rule, val, callback) => { |
|---|
| | | if (this.isReadonly(item)) return callback(); |
|---|
| | | // ç¨æ·èªå®ä¹çæ¹æ³ï¼å¦æè¿åäºå¼ï¼ç´æ¥æ¾ç¤ºè¿åçå¼ï¼éªè¯ä¸éè¿ |
|---|
| | | let _arr = this.formFields[item.field]; |
|---|
| | | if (!_arr || !_arr.length) { |
|---|
| | | return callback(new Error('请éæ©' + item.title)); |
|---|
| | | } |
|---|
| | | return callback(); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | |
|---|
| | | if ( |
|---|
| | | ['select', 'selectList', 'checkbox', 'cascader', 'treeSelect'].indexOf( |
|---|
| | | item.type |
|---|
| | | ) != -1 |
|---|
| | | ) { |
|---|
| | | let _rule = { |
|---|
| | | type: item.type == 'select' ? 'string' : 'array', |
|---|
| | | required: true, |
|---|
| | | min: item.min || 1, |
|---|
| | | message: '请éæ©' + item.title, |
|---|
| | | trigger: 'change', |
|---|
| | | validator: (rule, value, callback) => { |
|---|
| | | if (this.isReadonly(item)) return callback(); |
|---|
| | | //2021.11.27ä¿®å¤å¤é没ææ示çé®é¢ |
|---|
| | | if (value == undefined || value === '') { |
|---|
| | | return callback(new Error(rule.message)); |
|---|
| | | } else if ( |
|---|
| | | (item.type == 'checkbox' || |
|---|
| | | item.type == 'selectList' || |
|---|
| | | item.type == 'treeSelect') && |
|---|
| | | (!(value instanceof Array) || !value.length) |
|---|
| | | ) { |
|---|
| | | return callback(new Error(rule.message)); |
|---|
| | | } |
|---|
| | | return callback(); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | |
|---|
| | | if (_rule.max) { |
|---|
| | | _rule.nax = item.max; |
|---|
| | | _rule.message = 'æå¤åªè½éæ©' + item.max + '项'; |
|---|
| | | } |
|---|
| | | return _rule; |
|---|
| | | } |
|---|
| | | return {}; |
|---|
| | | }, |
|---|
| | | compareDate(date1, date2) { |
|---|
| | | if (!date2) { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | return ( |
|---|
| | | date1.valueOf() < |
|---|
| | | (typeof date2 == 'number' ? date2 : new Date(date2).valueOf()) |
|---|
| | | ); |
|---|
| | | }, |
|---|
| | | getDateOptions(date, item) { |
|---|
| | | //2021.07.17设置æ¶é´å¯éèå´ |
|---|
| | | if ((!item.min && !item.max) || !date) { |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | if (item.min && item.min.indexOf(' ') == -1) { |
|---|
| | | //ä¸è®¾ç½®æ¶åç§ï¼åé¢ä¼èªå¨å ä¸ 08:00 |
|---|
| | | item.min = item.min + ' 00:00:000'; |
|---|
| | | } |
|---|
| | | return ( |
|---|
| | | this.compareDate(date, item.min) || !this.compareDate(date, item.max) |
|---|
| | | ); |
|---|
| | | }, |
|---|
| | | getDateFormat(item) { |
|---|
| | | if (item.type == 'month') { |
|---|
| | | return 'YYYY-MM'; |
|---|
| | | } |
|---|
| | | // if (item.type=='time') { |
|---|
| | | // return 'HH:mm:ss' |
|---|
| | | // } |
|---|
| | | //è§https://day.js.org/docs/zh-CN/display/format |
|---|
| | | return item.type == 'date' ? 'YYYY-MM-DD' : 'YYYY-MM-DD HH:mm:ss'; |
|---|
| | | }, |
|---|
| | | dateRangeChange(val, item) { |
|---|
| | | if (!val) { |
|---|
| | | this.$emit('update:formFields'); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | item.onChange && item.onChange(val); |
|---|
| | | }, |
|---|
| | | onKeyPress($event, item) { |
|---|
| | | if ($event.keyCode == 13) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | item.onKeyPress($event); |
|---|
| | | }, |
|---|
| | | filterMethod(value, data) { |
|---|
| | | return data.label.includes(value); |
|---|
| | | }, |
|---|
| | | getNode( label,node, data){ |
|---|
| | | console.log(label) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .el-form-item { |
|---|
| | | margin-right: 0; |
|---|
| | | } |
|---|
| | | .el-form-item { |
|---|
| | | .form-imgs { |
|---|
| | | img { |
|---|
| | | float: left; |
|---|
| | | cursor: pointer; |
|---|
| | | object-fit: cover; |
|---|
| | | margin: 0 10px 10px 0; |
|---|
| | | width: 65px; |
|---|
| | | height: 65px; |
|---|
| | | border: 1px solid #c7c7c7; |
|---|
| | | overflow: hidden; |
|---|
| | | border-radius: 5px; |
|---|
| | | box-sizing: content-box; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .el-form-item ::v-deep(.el-form-item__label) { |
|---|
| | | padding: 0 0px 0 4px; |
|---|
| | | overflow: hidden; |
|---|
| | | text-overflow: ellipsis; |
|---|
| | | white-space: nowrap; |
|---|
| | | } |
|---|
| | | .el-form-item ::v-deep(.el-range-separator) { |
|---|
| | | text-align: center; |
|---|
| | | width: 13px; |
|---|
| | | padding: 0px 1px; |
|---|
| | | font-size: 12px; |
|---|
| | | } |
|---|
| | | .el-form-item ::v-deep(.el-range__close-icon) { |
|---|
| | | margin-right: -10px; |
|---|
| | | } |
|---|
| | | .form-item-extra { |
|---|
| | | > *:first-child { |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | display: flex; |
|---|
| | | .form-extra { |
|---|
| | | padding-left: 7px; |
|---|
| | | line-height: 36px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .vol-form-item { |
|---|
| | | width: 100%; |
|---|
| | | } |
|---|
| | | .vol-form-item ::v-deep(.el-form-item__content) { |
|---|
| | | display: unset !important; |
|---|
| | | } |
|---|
| | | .vol-form-item ::v-deep(.el-input--large .el-input__inner) { |
|---|
| | | height: 34px !important; |
|---|
| | | } |
|---|
| | | .vol-form-item ::v-deep(.el-input-number--large .el-input-number__increase) { |
|---|
| | | border-top: 1px solid #d4d4d4; |
|---|
| | | } |
|---|
| | | .vol-form-item ::v-deep(.el-input-number--large .el-input-number__decrease) { |
|---|
| | | border-bottom: 1px solid #d4d4d4; |
|---|
| | | } |
|---|
| | | .vol-form-item ::v-deep(.el-input--large.el-date-editor) { |
|---|
| | | height: 36px; |
|---|
| | | } |
|---|
| | | .v-date-range ::v-deep(.el-input__prefix) { |
|---|
| | | display: none; |
|---|
| | | } |
|---|
| | | .v-date-range ::v-deep(.el-input__inner) { |
|---|
| | | padding: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-form-item ::v-deep(.el-checkbox) { |
|---|
| | | margin-right: 8px; |
|---|
| | | } |
|---|
| | | .el-form-item ::v-deep(.el-checkbox .el-checkbox__label) { |
|---|
| | | padding-left: 5px; |
|---|
| | | } |
|---|
| | | .el-form-item ::v-deep(textarea) { |
|---|
| | | font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', |
|---|
| | | 'Microsoft YaHei', '微软é
é»', Arial, sans-serif !important; |
|---|
| | | } |
|---|
| | | .el-form-item ::v-deep(.el-select .el-select__tags > span) { |
|---|
| | | display: flex; |
|---|
| | | } |
|---|
| | | .el-form-item ::v-deep(.el-select-v2__combobox-input) { |
|---|
| | | height: 30px; |
|---|
| | | } |
|---|
| | | .el-form-item ::v-deep(.el-select__tags) { |
|---|
| | | overflow: hidden; |
|---|
| | | height: 30px; |
|---|
| | | } |
|---|
| | | .el-form-item ::v-deep(.el-select-tags-wrapper) { |
|---|
| | | position: absolute; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-form-item { |
|---|
| | | vertical-align: top !important; |
|---|
| | | } |
|---|
| | | .form-file-list { |
|---|
| | | a { |
|---|
| | | color: #3ea9ff; |
|---|
| | | } |
|---|
| | | a:hover { |
|---|
| | | cursor: pointer; |
|---|
| | | color: #0281e7; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | import { h } from 'vue'; |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | name: "FormExpand", |
|---|
| | | functional: true, |
|---|
| | | props: { |
|---|
| | | render: Function, |
|---|
| | | par: {}//æµè¯åæ° |
|---|
| | | }, |
|---|
| | | render: ({ render, par }) => { |
|---|
| | | return render(h, { par }); //h(); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | import templateCode from './templateCode' |
|---|
| | | export default function () { |
|---|
| | | let code = templateCode; |
|---|
| | | let _formOptions = this.options.formOptions.map(m => { |
|---|
| | | let _op = m.map((m1, i) => { |
|---|
| | | let _obj; |
|---|
| | | //.data[0].hasOwnProperty("key") |
|---|
| | | if (m1.data && m1.data.length && !m1.dataKey) { |
|---|
| | | let m2 = JSON.parse(JSON.stringify(m1)); |
|---|
| | | m2.data = m2.data.map(c => { |
|---|
| | | return { key: c.label || c.key, value: c.label } |
|---|
| | | }) |
|---|
| | | _obj = JSON.stringify(m2) |
|---|
| | | } else { |
|---|
| | | _obj = JSON.stringify(m1) |
|---|
| | | } |
|---|
| | | return (i === 0 ? '' : '\n\t\t\t\t') + _obj |
|---|
| | | }).join(','); |
|---|
| | | //return JSON.stringify(m, null, '') |
|---|
| | | return _op; |
|---|
| | | }) |
|---|
| | | code = code.replace('{#fields}', JSON.stringify(this.options.fields)) |
|---|
| | | .replace('{#formOptions}', '[' + _formOptions.join('],\n\t\t\t\t[') + ']'); |
|---|
| | | code = code.replace('}],', '\t\t\t\t\t}],') |
|---|
| | | .replace("[{#tableOptions}]", JSON.stringify(this.options.tables, null, '\t')) |
|---|
| | | .replace("[{#tabsOptions}]", JSON.stringify(this.options.tabs, null, '\t')) |
|---|
| | | // fields: {#fields}, |
|---|
| | | // formOptions: [{#formOptions}], |
|---|
| | | // tables: [{#tables}], |
|---|
| | | // tabs: [{#tabs}] |
|---|
| | | var tabsText = this.options.tabs.length ? ` <div class="tables" |
|---|
| | | style="padding-bottom: 10px"> |
|---|
| | | <el-tabs v-model="tabsModel" |
|---|
| | | @tab-click="() => {}"> |
|---|
| | | <el-tab-pane style="padding: 0" |
|---|
| | | class="table-item" |
|---|
| | | v-for="(item, index) in tabs" |
|---|
| | | :label="item.name" |
|---|
| | | :name="index+''" |
|---|
| | | :key="index"> |
|---|
| | | <div class="table-header"> |
|---|
| | | <div class="header-text"> |
|---|
| | | {{ item.name }} |
|---|
| | | </div> |
|---|
| | | <div class="header-btns"> |
|---|
| | | <el-button type="primary" |
|---|
| | | size="mini" |
|---|
| | | :key="bindex" |
|---|
| | | :icon="btnItem.icon" |
|---|
| | | plain |
|---|
| | | @click="tabsTableBtnClick(item, bindex, index)" |
|---|
| | | v-for="(btnItem, bindex) in item.buttons"> |
|---|
| | | {{ btnItem.name }} |
|---|
| | | </el-button> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <vol-table :url="item.url" |
|---|
| | | :load-key="false" |
|---|
| | | :index="true" |
|---|
| | | :ref="'tabsTable' + index" |
|---|
| | | :tableData="item.tableData" |
|---|
| | | :columns="item.columns" |
|---|
| | | :max-height="250" |
|---|
| | | :pagination-hide="item.pagination" |
|---|
| | | :column-index="true" |
|---|
| | | :ck="true"></vol-table> |
|---|
| | | </el-tab-pane> |
|---|
| | | </el-tabs> |
|---|
| | | </div>`: '' |
|---|
| | | code = code.replace('{#tabs}', tabsText); |
|---|
| | | if (this.options.tables.length || this.options.tabs.length) { |
|---|
| | | code = code.replace("{import_VolTable}", "import VolTable from '@/components/basic/VolTable'") |
|---|
| | | code = code.replace(",{component_table}", ",'vol-table': VolTable") |
|---|
| | | } else { |
|---|
| | | code = code.replace("{import_VolTable}", '') |
|---|
| | | code = code.replace("{component_table}", '') |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (this.options.tables.length) { |
|---|
| | | |
|---|
| | | code = code.replace('{table_ms}', ` |
|---|
| | | tableBtnClick (item, btnIndex, index) { |
|---|
| | | if (item.buttons[btnIndex].value == "add") { |
|---|
| | | this.$refs["table" + index][0].addRow({}); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | if (item.buttons[btnIndex].value == "del") { |
|---|
| | | this.$refs["table" + index][0].delRow(); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | tabsTableBtnClick (item, btnIndex, index) { |
|---|
| | | if (item.buttons[btnIndex].value == "add") { |
|---|
| | | this.$refs["tabsTable" + index][0].addRow({}); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | if (item.buttons[btnIndex].value == "del") { |
|---|
| | | this.$refs["tabsTable" + index][0].delRow(); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | },`) |
|---|
| | | code = code.replace('{#tables}', |
|---|
| | | ` |
|---|
| | | <!--tableé
ç½® --> |
|---|
| | | <div class="tables"> |
|---|
| | | <div class="table-item" |
|---|
| | | v-for="(item, index) in tables" |
|---|
| | | :key="index"> |
|---|
| | | <div class="table-header"> |
|---|
| | | <div class="header-text"> |
|---|
| | | {{ item.name }} |
|---|
| | | </div> |
|---|
| | | <div class="header-btns"> |
|---|
| | | <el-button type="primary" |
|---|
| | | size="mini" |
|---|
| | | :key="bindex" |
|---|
| | | plain |
|---|
| | | @click="tableBtnClick(item, bindex, index)" |
|---|
| | | :icon="btnItem.icon" |
|---|
| | | v-for="(btnItem, bindex) in item.buttons"> |
|---|
| | | {{ btnItem.name }} |
|---|
| | | </el-button> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <vol-table :url="item.url" |
|---|
| | | :load-key="false" |
|---|
| | | :index="true" |
|---|
| | | :ref="'table' + index" |
|---|
| | | :tableData="item.tableData" |
|---|
| | | :columns="item.columns" |
|---|
| | | :max-height="250" |
|---|
| | | :pagination-hide="item.pagination" |
|---|
| | | :column-index="true" |
|---|
| | | :ck="true"></vol-table> |
|---|
| | | </div> |
|---|
| | | </div>`); |
|---|
| | | |
|---|
| | | } else { |
|---|
| | | |
|---|
| | | code = code.replace('{table_ms}', '') |
|---|
| | | code = code.replace('{#tables}', ''); |
|---|
| | | } |
|---|
| | | const blob = new Blob([code], { type: "text/plain;charset=utf-8" }) |
|---|
| | | if ('download' in document.createElement('a')) { // éIEä¸è½½ |
|---|
| | | const elink = document.createElement('a') |
|---|
| | | elink.download = `code${new Date().valueOf()}.vue`; |
|---|
| | | elink.style.display = 'none' |
|---|
| | | elink.href = URL.createObjectURL(blob) |
|---|
| | | document.body.appendChild(elink) |
|---|
| | | elink.click() |
|---|
| | | URL.revokeObjectURL(elink.href) // éæ¾URL 对象 |
|---|
| | | document.body.removeChild(elink) |
|---|
| | | } else { |
|---|
| | | navigator.msSaveBlob(blob, fileName) |
|---|
| | | } |
|---|
| | | } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="drag-container"> |
|---|
| | | <!-- @start="onStart" --> |
|---|
| | | <div class="drag-left"> |
|---|
| | | <div class="left-title">ç»ä»¶å表</div> |
|---|
| | | <draggable |
|---|
| | | v-model="components" |
|---|
| | | @end="end1" |
|---|
| | | class="left-draggable-item" |
|---|
| | | :group="{ name: 'componentsGroup', pull: 'clone', put: false }" |
|---|
| | | animation="300" |
|---|
| | | @start="onStart" |
|---|
| | | :sort="false" |
|---|
| | | :move="onMove1" |
|---|
| | | > |
|---|
| | | <transition-group> |
|---|
| | | <div |
|---|
| | | :class="item.id == 1 ? 'item forbid' : 'item'" |
|---|
| | | v-for="item in components" |
|---|
| | | :key="item.id" |
|---|
| | | > |
|---|
| | | <i :class="item.icon"></i> {{ item.name }} |
|---|
| | | </div> |
|---|
| | | </transition-group> |
|---|
| | | </draggable> |
|---|
| | | <div class="example"> |
|---|
| | | <div @click="example1">示ä¾ä¸<i class="el-icon-arrow-right"></i></div> |
|---|
| | | <div @click="example2">示ä¾äº<i class="el-icon-arrow-right"></i></div> |
|---|
| | | <div @click="example3">示ä¾ä¸<i class="el-icon-arrow-right"></i></div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div class="drag-center"> |
|---|
| | | <div class="center-top"> |
|---|
| | | <span> |
|---|
| | | <!-- <i class="el-icon-warning-outline"></i>é«æç表åé
ç½® --> |
|---|
| | | </span> |
|---|
| | | <el-button type="primary" size="mini" plain @click="save" |
|---|
| | | ><i class="el-icon-check"> </i>ä¿å</el-button |
|---|
| | | > |
|---|
| | | <el-button type="primary" size="mini" plain @click="preview(true)" |
|---|
| | | ><i class="el-icon-view"> </i>é¢è§</el-button |
|---|
| | | > |
|---|
| | | <el-button type="primary" size="mini" plain @click="download" |
|---|
| | | ><i class="el-icon-view"> </i>ä¸è½½</el-button |
|---|
| | | > |
|---|
| | | <el-button type="primary" @click="clearItems" size="mini" plain |
|---|
| | | ><i class="el-icon-delete"> </i>æ¸
空</el-button |
|---|
| | | > |
|---|
| | | <a |
|---|
| | | style="margin-left: 15px" |
|---|
| | | href="http://v2.volcore.xyz/document/api" |
|---|
| | | target="_blank" |
|---|
| | | >设计å¨åºäºæ¡æ¶volformãvoltableãvoluploadãvolboxå®å¶å¼å</a |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | <div> |
|---|
| | | <el-alert |
|---|
| | | title="å
³äºè¡¨å设计å¨" |
|---|
| | | type="success" |
|---|
| | | :show-icon="true" |
|---|
| | | :closable="false" |
|---|
| | | > |
|---|
| | | <div> |
|---|
| | | 1ã表å设计å¨åºäºdraggableå¼å,为æ¬æ¡æ¶èªå®ä¹é¡µé¢åè½çè¡¥å
,æ¡æ¶ä»ä»¥å¯è§å代ç çæå¨ä¸ºæ ¸å¿ |
|---|
| | | </div> |
|---|
| | | <div> |
|---|
| | | 2ãæ¯æå¯è§å设计1对1ã1对å¤å表åä¸ææ¡èªå¨ç»å®ãtableèªå¨å è½½æ°æ®(å页ãç¼è¾)ãèªå¨ä¸ä¼ æ件ãå¯ææ¬ç¼è¾ |
|---|
| | | </div> |
|---|
| | | </el-alert> |
|---|
| | | </div> |
|---|
| | | <el-scrollbar style="flex: 1"> |
|---|
| | | <div class="tips" key="empty" v-show="!currentComponents.length"> |
|---|
| | | 请å°å·¦è¾¹ç»ä»¶æå
¥æ¤å®¹å¨ä¸ |
|---|
| | | </div> |
|---|
| | | <el-form label-position="top"> |
|---|
| | | <draggable |
|---|
| | | class="draggable-container" |
|---|
| | | v-model="currentComponents" |
|---|
| | | @end="end2" |
|---|
| | | animation="300" |
|---|
| | | :move="onMove" |
|---|
| | | group="componentsGroup" |
|---|
| | | > |
|---|
| | | <transition-group class="drag-center-item"> |
|---|
| | | <div |
|---|
| | | class="item2" |
|---|
| | | :class="{ actived: index === currentIndex }" |
|---|
| | | @click="itemClick(item, index)" |
|---|
| | | :style="{ width: item.width + '%' }" |
|---|
| | | v-for="(item, index) in currentComponents" |
|---|
| | | :key="index" |
|---|
| | | > |
|---|
| | | <i |
|---|
| | | class="el-icon-document-copy" |
|---|
| | | @click.stop="copyItem(item)" |
|---|
| | | ></i> |
|---|
| | | <i class="el-icon-delete" @click.stop="removeItem(index)"> </i> |
|---|
| | | <el-form-item |
|---|
| | | :required="item.required" |
|---|
| | | label-position="top" |
|---|
| | | style="width: 100%" |
|---|
| | | :label="item.type == 'line' ? '' : item.name" |
|---|
| | | > |
|---|
| | | <el-col> |
|---|
| | | <!-- <div></div> --> |
|---|
| | | <!-- {{ item.name }} --> |
|---|
| | | <el-input |
|---|
| | | v-if="item.type == 'text'" |
|---|
| | | placeholder="请è¾å
¥å
容" |
|---|
| | | v-model="item.value" |
|---|
| | | :disabled="item.readonly" |
|---|
| | | size="medium" |
|---|
| | | ></el-input> |
|---|
| | | <el-input |
|---|
| | | v-else-if="item.type == 'textarea'" |
|---|
| | | type="textarea" |
|---|
| | | v-model="item.value" |
|---|
| | | :disabled="item.readonly" |
|---|
| | | placeholder="请è¾å
¥å
容" |
|---|
| | | ></el-input> |
|---|
| | | <el-date-picker |
|---|
| | | v-else-if="item.type == 'date'" |
|---|
| | | align="right" |
|---|
| | | v-model="item.value" |
|---|
| | | type="date" |
|---|
| | | :disabled="item.readonly" |
|---|
| | | size="medium" |
|---|
| | | placeholder="éæ©æ¥æ" |
|---|
| | | > |
|---|
| | | </el-date-picker> |
|---|
| | | <el-radio-group |
|---|
| | | :disabled="item.readonly" |
|---|
| | | v-else-if="item.type == 'radio'" |
|---|
| | | v-model="item.value" |
|---|
| | | > |
|---|
| | | <el-radio |
|---|
| | | v-for="item in item.data" |
|---|
| | | :key="item.key" |
|---|
| | | :label="item.value" |
|---|
| | | :value="item.key" |
|---|
| | | > |
|---|
| | | </el-radio> |
|---|
| | | <!-- <el-radio :label="1">æ¯</el-radio> |
|---|
| | | <el-radio :label="0">å¦</el-radio> --> |
|---|
| | | </el-radio-group> |
|---|
| | | |
|---|
| | | <el-checkbox-group |
|---|
| | | v-model="item.values" |
|---|
| | | :disabled="item.readonly" |
|---|
| | | style="width: 100%; display: inline-block" |
|---|
| | | v-else-if="item.type == 'checkbox'" |
|---|
| | | > |
|---|
| | | <el-checkbox |
|---|
| | | v-for="item in item.data" |
|---|
| | | :key="item.key" |
|---|
| | | :label="item.value" |
|---|
| | | :value="item.key" |
|---|
| | | > |
|---|
| | | </el-checkbox> |
|---|
| | | <!-- <el-checkbox label="å¤éæ¡ A"></el-checkbox> |
|---|
| | | <el-checkbox label="å¤éæ¡ B"></el-checkbox> |
|---|
| | | <el-checkbox label="å¤éæ¡ C"></el-checkbox> --> |
|---|
| | | </el-checkbox-group> |
|---|
| | | |
|---|
| | | <el-select |
|---|
| | | style="width: 100%" |
|---|
| | | :disabled="item.readonly" |
|---|
| | | v-model="item.value" |
|---|
| | | size="medium" |
|---|
| | | v-else-if="item.type == 'select'" |
|---|
| | | placeholder="请éæ©" |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="item in item.data" |
|---|
| | | :key="item.value" |
|---|
| | | :label="item.label" |
|---|
| | | :value="item.value" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | <el-select |
|---|
| | | style="width: 100%" |
|---|
| | | :disabled="item.readonly" |
|---|
| | | v-model="item.values" |
|---|
| | | size="medium" |
|---|
| | | :multiple="true" |
|---|
| | | v-else-if="item.type == 'selectList'" |
|---|
| | | placeholder="请éæ©" |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="item in item.data" |
|---|
| | | :key="item.value" |
|---|
| | | :label="item.label" |
|---|
| | | :value="item.value" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | <el-cascader |
|---|
| | | :disabled="item.readonly" |
|---|
| | | style="width: 100%" |
|---|
| | | v-else-if="item.type == 'cascader'" |
|---|
| | | v-model="item.values" |
|---|
| | | :options="item.data" |
|---|
| | | @change="() => {}" |
|---|
| | | ></el-cascader> |
|---|
| | | |
|---|
| | | <el-switch |
|---|
| | | :disabled="item.readonly" |
|---|
| | | v-model="item.value" |
|---|
| | | style="width: 100%" |
|---|
| | | v-else-if="item.type == 'switch'" |
|---|
| | | active-color="#13ce66" |
|---|
| | | inactive-color="#0e7ef3" |
|---|
| | | :active-value="1" |
|---|
| | | :inactive-value="0" |
|---|
| | | > |
|---|
| | | </el-switch> |
|---|
| | | <div class="col-line" v-else-if="item.type == 'line'"> |
|---|
| | | {{ item.name }} |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <vol-upload |
|---|
| | | v-else-if=" |
|---|
| | | item.type == 'img' || |
|---|
| | | item.type == 'excel' || |
|---|
| | | item.type == 'file' |
|---|
| | | " |
|---|
| | | :fileInfo="item.fileInfo" |
|---|
| | | :url="item.url" |
|---|
| | | :img="item.type == 'img'" |
|---|
| | | :excel="item.type == 'excel'" |
|---|
| | | :multiple="item.multiple" |
|---|
| | | :max-size="item.maxSize" |
|---|
| | | :max-file="item.maxFile" |
|---|
| | | :autoUpload="item.autoUpload" |
|---|
| | | > |
|---|
| | | </vol-upload> |
|---|
| | | <vol-wang-editor |
|---|
| | | v-else-if="item.type == 'editor'" |
|---|
| | | :url="item.url" |
|---|
| | | v-model="item.value" |
|---|
| | | :height="item.height" |
|---|
| | | ></vol-wang-editor> |
|---|
| | | |
|---|
| | | <vol-table |
|---|
| | | v-else-if="item.type == 'table'" |
|---|
| | | :url="item.url" |
|---|
| | | :load-key="true" |
|---|
| | | :index="item.edit" |
|---|
| | | :tableData="item.tableData" |
|---|
| | | :columns="item.columns" |
|---|
| | | :height="item.height" |
|---|
| | | :pagination-hide="true" |
|---|
| | | :column-index="item.columnIndex" |
|---|
| | | :ck="item.ck" |
|---|
| | | ></vol-table> |
|---|
| | | <el-button |
|---|
| | | @click="model = true" |
|---|
| | | v-else-if="item.type == 'box'" |
|---|
| | | type="primary" |
|---|
| | | size="small" |
|---|
| | | >{{ item.name }}</el-button |
|---|
| | | > |
|---|
| | | </el-col> |
|---|
| | | </el-form-item> |
|---|
| | | </div> |
|---|
| | | </transition-group> |
|---|
| | | </draggable> |
|---|
| | | </el-form> |
|---|
| | | </el-scrollbar> |
|---|
| | | </div> |
|---|
| | | <div class="drag-right"> |
|---|
| | | <div class="left-title">ç»ä»¶å±æ§</div> |
|---|
| | | <div class="attr" v-show="currentIndex != -1"> |
|---|
| | | <div class="attr-item"> |
|---|
| | | <div class="text">å段å称</div> |
|---|
| | | <el-input size="medium" v-model="currentItem.name" /> |
|---|
| | | </div> |
|---|
| | | <div class="attr-item"> |
|---|
| | | <div class="text">å段(å¯ä¸å段)</div> |
|---|
| | | <el-input size="medium" v-model="currentItem.field" /> |
|---|
| | | </div> |
|---|
| | | <div class="attr-item" v-show="currentItem.type == 'table'"> |
|---|
| | | <div class="text">åå°è¿åæ°æ®æ¥å£å°å</div> |
|---|
| | | <el-input |
|---|
| | | size="medium" |
|---|
| | | placeholder="ä¾:api/表å/getPageData" |
|---|
| | | v-model="currentItem.url" |
|---|
| | | /> |
|---|
| | | </div> |
|---|
| | | <div |
|---|
| | | class="attr-item" |
|---|
| | | v-show=" |
|---|
| | | currentItem.type != 'table' && currentItem.hasOwnProperty('url') |
|---|
| | | " |
|---|
| | | > |
|---|
| | | <div class="text">ä¸ä¼ æ¥å£å°å(åå°æ¥å£)</div> |
|---|
| | | <el-input |
|---|
| | | size="medium" |
|---|
| | | placeholder="å¯ç¨æ¡æ¶å°å:api/表å/upload" |
|---|
| | | v-model="currentItem.url" |
|---|
| | | /> |
|---|
| | | <div class="text" style="margin-top: 10px">æ件大å°éå¶(M)</div> |
|---|
| | | <el-input size="medium" v-model="currentItem.maxSize" /> |
|---|
| | | <div class="text" style="margin-top: 10px">æ¯å¦å¤æ件ä¸ä¼ </div> |
|---|
| | | <el-switch |
|---|
| | | v-model="currentItem.multiple" |
|---|
| | | style="width: 100%" |
|---|
| | | active-color="#13ce66" |
|---|
| | | inactive-color="rgb(165 165 165)" |
|---|
| | | :active-value="true" |
|---|
| | | :inactive-value="false" |
|---|
| | | > |
|---|
| | | </el-switch> |
|---|
| | | <div class="text" style="margin-top: 10px">æ¯å¦èªå¨ä¸ä¼ </div> |
|---|
| | | <el-switch |
|---|
| | | v-model="currentItem.autoUpload" |
|---|
| | | style="width: 100%" |
|---|
| | | active-color="#13ce66" |
|---|
| | | inactive-color="rgb(165 165 165)" |
|---|
| | | :active-value="true" |
|---|
| | | :inactive-value="false" |
|---|
| | | > |
|---|
| | | </el-switch> |
|---|
| | | </div> |
|---|
| | | <div class="attr-item" v-show="currentItem.data"> |
|---|
| | | <div class="text">æ°æ®æº(ä¸ææ¡ç»å®è®¾ç½®ä¸ç»´æ¤)</div> |
|---|
| | | |
|---|
| | | <!-- dicList --> |
|---|
| | | <el-select |
|---|
| | | style="width: 100%" |
|---|
| | | v-model="currentItem.key" |
|---|
| | | size="medium" |
|---|
| | | @change="dicChange" |
|---|
| | | placeholder="请éæ©æ°æ®æºåå
¸" |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="item in dicList" |
|---|
| | | :key="item.key" |
|---|
| | | :label="item.value" |
|---|
| | | :value="item.key" |
|---|
| | | > |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </div> |
|---|
| | | <div class="attr-item" v-show="currentItem.type != 'table'"> |
|---|
| | | <div class="text">æ ç¾å®½åº¦</div> |
|---|
| | | <el-slider |
|---|
| | | style="width: 90%" |
|---|
| | | :min="20" |
|---|
| | | v-model="colWidth" |
|---|
| | | :step="10" |
|---|
| | | show-stops |
|---|
| | | > |
|---|
| | | </el-slider> |
|---|
| | | </div> |
|---|
| | | <div class="attr-item attr2" v-show="currentItem.type != 'table'"> |
|---|
| | | <div> |
|---|
| | | <div class="text">å¿
å¡«</div> |
|---|
| | | <el-switch |
|---|
| | | v-model="currentItem.required" |
|---|
| | | style="width: 100%" |
|---|
| | | active-color="#13ce66" |
|---|
| | | inactive-color="rgb(165 165 165)" |
|---|
| | | :active-value="true" |
|---|
| | | :inactive-value="false" |
|---|
| | | > |
|---|
| | | </el-switch> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div> |
|---|
| | | <!-- active-text="æ¯" |
|---|
| | | inactive-text="å¦" --> |
|---|
| | | <div class="text">åªè¯»</div> |
|---|
| | | <el-switch |
|---|
| | | v-model="currentItem.readonly" |
|---|
| | | style="width: 100%" |
|---|
| | | active-color="#13ce66" |
|---|
| | | inactive-color="rgb(165 165 165)" |
|---|
| | | :active-value="true" |
|---|
| | | :inactive-value="false" |
|---|
| | | > |
|---|
| | | </el-switch> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div v-show="currentItem.type == 'table'"> |
|---|
| | | <div class="attr-item"> |
|---|
| | | <div class="text">æ¯å¦ä½¿ç¨é项å¡(tabs)</div> |
|---|
| | | <div> |
|---|
| | | <el-switch |
|---|
| | | v-model="currentItem.tabs" |
|---|
| | | style="width: 100%" |
|---|
| | | active-text="æ¯" |
|---|
| | | inactive-text="å¦" |
|---|
| | | active-color="#13ce66" |
|---|
| | | inactive-color="rgb(165 165 165)" |
|---|
| | | :active-value="true" |
|---|
| | | :inactive-value="false" |
|---|
| | | > |
|---|
| | | </el-switch> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="attr-item attr2"> |
|---|
| | | <el-button |
|---|
| | | style="width: 100%" |
|---|
| | | @click="openTableModel" |
|---|
| | | type="primary" |
|---|
| | | size="medium" |
|---|
| | | >tableé
ç½®</el-button |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <vol-box |
|---|
| | | v-model="model" |
|---|
| | | :height="300" |
|---|
| | | :width="550" |
|---|
| | | :lazy="true" |
|---|
| | | title="å¼¹åºæ¡" |
|---|
| | | > |
|---|
| | | <template #content> |
|---|
| | | <div>å¼¹åºæ¡å
容</div> |
|---|
| | | </template> |
|---|
| | | <template #footer> |
|---|
| | | <div> |
|---|
| | | <el-button type="primary" size="mini" @click="model = false" |
|---|
| | | ><i class="el-icon-close"></i>ç¹å»å
³é</el-button |
|---|
| | | > |
|---|
| | | <el-button size="mini" @click="model = false" |
|---|
| | | ><i class="el-icon-close"></i>å
³é</el-button |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </vol-box> |
|---|
| | | |
|---|
| | | <vol-box |
|---|
| | | v-model="previewModel" |
|---|
| | | :height="600" |
|---|
| | | :width="1300" |
|---|
| | | :lazy="true" |
|---|
| | | :padding="1" |
|---|
| | | :close="false" |
|---|
| | | title="é¢è§" |
|---|
| | | > |
|---|
| | | <preview style="height:600px" :options="viewFormData"></preview> |
|---|
| | | </vol-box> |
|---|
| | | |
|---|
| | | <vol-box |
|---|
| | | v-model="tableModel" |
|---|
| | | :height="600" |
|---|
| | | :width="1300" |
|---|
| | | :lazy="true" |
|---|
| | | :padding="0" |
|---|
| | | :title="currentItem.name" |
|---|
| | | > |
|---|
| | | <template #content> |
|---|
| | | <div style="height:600px" > |
|---|
| | | <el-alert title="å
³äºtableé
ç½®" type="info" :closable="false" show-icon> |
|---|
| | | æ¤å¤tableæ¯å¯¹æ¡æ¶voltableåºæ¬æä½çé
ç½®,å¦æéè¦äºä»¶è§¦åãæ°æ®å è½½çæ´å¤åè½ï¼è¯·å¨çæåç代ç æ·»å éè¦çåè½ï¼å®æ´é
ç½®è§ææ¡£<a |
|---|
| | | href="http://v2.volcore.xyz/document/api" |
|---|
| | | style="color: #1e88e5; margin-left: 9px" |
|---|
| | | target="_blank" |
|---|
| | | >voltable</a |
|---|
| | | > |
|---|
| | | </el-alert> |
|---|
| | | <div class="btns"> |
|---|
| | | <div class="btns-left"> |
|---|
| | | è¡¨æ ¼é»è®¤åè½æé®ï¼ |
|---|
| | | <el-checkbox |
|---|
| | | v-for="item in currentItem.buttons" |
|---|
| | | :label="item.name" |
|---|
| | | :key="item.name" |
|---|
| | | >{{ item.name }}</el-checkbox |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | <div class="btns-right"> |
|---|
| | | <el-button type="primary" size="mini" @click="addRow" |
|---|
| | | ><i class="el-icon-plus"></i>æ·»å å段</el-button |
|---|
| | | > |
|---|
| | | <el-button type="primary" size="mini" @click="delRow" |
|---|
| | | ><i class="el-icon-delete"></i>å é¤å段</el-button |
|---|
| | | > |
|---|
| | | <el-button type="primary" size="mini" @click="sortRow" |
|---|
| | | ><i class="el-icon-sort"></i>éæ°æå</el-button |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <vol-table |
|---|
| | | :load-key="true" |
|---|
| | | :tableData="currnetTableData" |
|---|
| | | :columns="currentTableOption" |
|---|
| | | :height="448" |
|---|
| | | ref="table" |
|---|
| | | :index="true" |
|---|
| | | :pagination-hide="true" |
|---|
| | | :column-index="true" |
|---|
| | | :ck="true" |
|---|
| | | ></vol-table> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <template #footer> |
|---|
| | | <div style="text-align: center"> |
|---|
| | | <el-button size="mini" @click="tableModel = false" |
|---|
| | | ><i class="el-icon-close"></i>å
³é</el-button |
|---|
| | | > |
|---|
| | | <el-button type="primary" size="mini" @click="saveConfigOptions" |
|---|
| | | ><i class="el-icon-check"></i>ä¿å</el-button |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </vol-box> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import { h, resolveComponent } from "vue"; |
|---|
| | | // import draggable from "vuedraggable"; |
|---|
| | | import { VueDraggableNext } from "vue-draggable-next"; |
|---|
| | | import VolWangEditor from "@/components/editor/VolWangEditor.vue"; |
|---|
| | | import VolUpload from "./../VolUpload"; |
|---|
| | | import VolTable from "./../VolTable"; |
|---|
| | | import VolBox from "./../VolBox"; |
|---|
| | | import VolFormPreview from "./VolFormPreview"; |
|---|
| | | import { components, tableOption } from "./options"; |
|---|
| | | import { options1, options2, options3 } from "./formTemplate"; |
|---|
| | | import downloadForm from "./DownloadForm"; |
|---|
| | | export default { |
|---|
| | | props: { |
|---|
| | | userComponents: { |
|---|
| | | type: Array, |
|---|
| | | default: () => { |
|---|
| | | return []; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | components: { |
|---|
| | | draggable: VueDraggableNext, |
|---|
| | | "vol-upload": VolUpload, |
|---|
| | | "vol-wang-editor": VolWangEditor, |
|---|
| | | "vol-table": VolTable, |
|---|
| | | "vol-box": VolBox, |
|---|
| | | preview: VolFormPreview, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | options:{}, |
|---|
| | | options1: options1, |
|---|
| | | options2: options2, |
|---|
| | | options3: options3, |
|---|
| | | colWidth: 100, |
|---|
| | | currentIndex: -1, |
|---|
| | | currentItem: {}, |
|---|
| | | currnetTableData: [], |
|---|
| | | currentTableOption: tableOption, |
|---|
| | | //å®ä¹è¦è¢«ææ½å¯¹è±¡çæ°ç» |
|---|
| | | components: components, |
|---|
| | | currentComponents: [], |
|---|
| | | dicList: [], |
|---|
| | | model: false, |
|---|
| | | tableModel: false, |
|---|
| | | previewModel: false, |
|---|
| | | viewFormData: { fields: {}, formOptions: [], tables: [] }, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | watch: { |
|---|
| | | colWidth(newVal) { |
|---|
| | | if (this.currentIndex != -1) { |
|---|
| | | this.currentComponents[this.currentIndex].width = newVal; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | userComponents: { |
|---|
| | | handler(newVal) { |
|---|
| | | this.currentComponents = newVal; |
|---|
| | | }, |
|---|
| | | immediate: true, |
|---|
| | | deep: true, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | created() { |
|---|
| | | this.currentComponents = this.userComponents; |
|---|
| | | this.http |
|---|
| | | .post("api/Sys_Dictionary/GetBuilderDictionary", {}, false) |
|---|
| | | .then((x) => { |
|---|
| | | this.dicList = x.map((c) => { |
|---|
| | | return { key: c, value: c }; |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | getFormOptions(item) { |
|---|
| | | let _option = {}; |
|---|
| | | _option.field = item.field; |
|---|
| | | _option.title = item.name; |
|---|
| | | _option.type = item.type; |
|---|
| | | _option.required = item.required; |
|---|
| | | _option.readonly = item.readonly; |
|---|
| | | if (item.type == "line") { |
|---|
| | | _option.title = ""; |
|---|
| | | let title = item.name; |
|---|
| | | _option.render = (h) => { |
|---|
| | | return h( |
|---|
| | | "div", |
|---|
| | | { |
|---|
| | | style: { |
|---|
| | | "line-height": "25px", |
|---|
| | | "font-weight": "bold", |
|---|
| | | "margin-left": "15px", |
|---|
| | | "border-bottom": "1px solid #dadada", |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | title |
|---|
| | | //ä¹å¯ä»¥å¨è¿éæ¾ä¸äºç»ä»¶ï¼ä¾å¦ï¼ |
|---|
| | | // resolveComponent("el-tooltip"), |
|---|
| | | // { |
|---|
| | | // content: "è¿éæ¯æ示çå
容", |
|---|
| | | // props: { effect: "dark", placement: "top-start" }, |
|---|
| | | // style: {}, |
|---|
| | | // }, |
|---|
| | | // [h("a", { style: { color: "#2a92ff" } }, "æ示信æ¯")] |
|---|
| | | ); |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | if (item.type == "editor") { |
|---|
| | | _option.height = item.height; |
|---|
| | | } |
|---|
| | | if (item.width == 100) { |
|---|
| | | _option.colSize = 12; |
|---|
| | | } else { |
|---|
| | | _option.colSize = (_option.width * 12) / 100; |
|---|
| | | } |
|---|
| | | if (["img", "excel", "file"].indexOf(item.type) != -1) { |
|---|
| | | _option.maxSize = item.maxSize; |
|---|
| | | _option.fileInfo = item.fileInfo; |
|---|
| | | _option.multiple = item.multiple; |
|---|
| | | _option.autoUpload = item.autoUpload; |
|---|
| | | _option.maxFile = item.maxFile; |
|---|
| | | } |
|---|
| | | if ( |
|---|
| | | ["img", "excel", "file", "editor", "table"].indexOf(item.type) != -1 |
|---|
| | | ) { |
|---|
| | | _option.url = item.url; |
|---|
| | | } |
|---|
| | | if (item.data) { |
|---|
| | | _option.data = item.data; |
|---|
| | | _option.dataKey = item.key; |
|---|
| | | } |
|---|
| | | return _option; |
|---|
| | | }, |
|---|
| | | getLineFormOptions(index) { |
|---|
| | | let _index = index; |
|---|
| | | let endIndex = index; |
|---|
| | | let width = 0; |
|---|
| | | let _options = []; |
|---|
| | | for (index; index < this.filterCurrentComponents().length; index++) { |
|---|
| | | const item = this.currentComponents[index]; |
|---|
| | | if (item.width + width <= 100) { |
|---|
| | | width = item.width + width; |
|---|
| | | endIndex = index; |
|---|
| | | _options.push(this.getFormOptions(item)); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | return { options: _options, index: _index, endIndex: endIndex }; |
|---|
| | | }, |
|---|
| | | filterCurrentComponents() { |
|---|
| | | return this.currentComponents.filter((x) => { |
|---|
| | | return x.type != "table"; |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | setSpan() {}, |
|---|
| | | preview(isPre) { |
|---|
| | | let _fields = {}; |
|---|
| | | let _formOptions = []; |
|---|
| | | let endIndex = -1; |
|---|
| | | this.filterCurrentComponents().forEach((item, index) => { |
|---|
| | | if (item.hasOwnProperty("values")) { |
|---|
| | | _fields[item.field] = []; |
|---|
| | | } else { |
|---|
| | | _fields[item.field] = null; |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (item.width == 100) { |
|---|
| | | _formOptions.push([this.getFormOptions(item)]); |
|---|
| | | } else { |
|---|
| | | if (endIndex == -1) { |
|---|
| | | let lineOptions = this.getLineFormOptions(index); |
|---|
| | | endIndex = lineOptions.endIndex; |
|---|
| | | _formOptions.push(lineOptions.options); |
|---|
| | | endIndex--; |
|---|
| | | } else { |
|---|
| | | endIndex--; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | // _fields[item.field] = null;xc |
|---|
| | | // let _option = {}; |
|---|
| | | // _option.field = item.field; |
|---|
| | | // _option.title = item.name; |
|---|
| | | // _option.type = item.type; |
|---|
| | | // _option.required = item.required; |
|---|
| | | // _option.readonly = item.readonly; |
|---|
| | | // if (["img", "excel", "file"].indexOf(item.type) != -1) { |
|---|
| | | // _option.maxSize = item.maxSize; |
|---|
| | | // _option.fileInfo = item.fileInfo; |
|---|
| | | // _option.multiple = item.multiple; |
|---|
| | | // _option.autoUpload = item.autoUpload; |
|---|
| | | // _option.maxFile = item.maxFile; |
|---|
| | | // } |
|---|
| | | // if ( |
|---|
| | | // ["img", "excel", "file", "editor", "table"].indexOf(item.type) != -1 |
|---|
| | | // ) { |
|---|
| | | // _option.url = item.url; |
|---|
| | | // } |
|---|
| | | // if (item.data) { |
|---|
| | | // _option.data = item.data; |
|---|
| | | // _option.dataKey = item.key; |
|---|
| | | // } |
|---|
| | | // _formOptions.push(_option); |
|---|
| | | }); |
|---|
| | | this.viewFormData.fields = _fields; |
|---|
| | | // console.log(JSON.stringify(_formOptions)) |
|---|
| | | this.viewFormData.formOptions = _formOptions; |
|---|
| | | if (isPre) { |
|---|
| | | this.previewModel = true; |
|---|
| | | } |
|---|
| | | let tableIndex = 0; |
|---|
| | | let keys = []; |
|---|
| | | let tables = this.currentComponents |
|---|
| | | .filter((x) => { |
|---|
| | | return x.type == "table"; |
|---|
| | | }) |
|---|
| | | .map((m) => { |
|---|
| | | m.pagination = !m.url; |
|---|
| | | if (m.name == "è¡¨æ ¼") { |
|---|
| | | tableIndex++; |
|---|
| | | } |
|---|
| | | return { |
|---|
| | | name: m.name + (m.name == "è¡¨æ ¼" ? tableIndex : ""), |
|---|
| | | url: m.url, |
|---|
| | | tabs: m.tabs, |
|---|
| | | pagination: m.pagination, |
|---|
| | | buttons: m.buttons, |
|---|
| | | columns: m.columns.map((c) => { |
|---|
| | | let obj = { |
|---|
| | | title: c.title, |
|---|
| | | field: c.field, |
|---|
| | | hidden: !c.show, |
|---|
| | | width: c.width, |
|---|
| | | required: c.required, |
|---|
| | | }; |
|---|
| | | |
|---|
| | | if (c.dataSource) { |
|---|
| | | obj.bind = { key: c.dataSource, data: [] }; |
|---|
| | | } |
|---|
| | | if (c.dataSource) { |
|---|
| | | keys.push(c.dataSource); |
|---|
| | | } |
|---|
| | | if (c.edit) { |
|---|
| | | if (!obj.bind) { |
|---|
| | | obj.bind = { key: "", data: [] }; |
|---|
| | | } |
|---|
| | | obj.edit = { type: c.editType }; |
|---|
| | | } |
|---|
| | | return obj; |
|---|
| | | }), |
|---|
| | | tableData: [{}, {}, {}], |
|---|
| | | }; |
|---|
| | | }); |
|---|
| | | this.viewFormData.tables = tables.filter((x) => { |
|---|
| | | return !x.tabs; |
|---|
| | | }); |
|---|
| | | this.viewFormData.tabs = tables.filter((x) => { |
|---|
| | | return x.tabs; |
|---|
| | | }); |
|---|
| | | this.getDicKeys(keys); |
|---|
| | | this.options = this.viewFormData; |
|---|
| | | }, |
|---|
| | | getDicKeys(keys) { |
|---|
| | | if (!keys.length) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | this.http |
|---|
| | | .post("api/Sys_Dictionary/GetVueDictionary", keys, true) |
|---|
| | | .then((result) => { |
|---|
| | | result.forEach((c) => { |
|---|
| | | this.viewFormData.tables.forEach((t) => { |
|---|
| | | let _option = t.columns.find((x) => { |
|---|
| | | return x.bind && x.bind.key == c.dicNo; |
|---|
| | | }); |
|---|
| | | if (_option) { |
|---|
| | | _option.bind.data = c.data; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | this.viewFormData.tabs.forEach((t) => { |
|---|
| | | let _option = t.columns.find((x) => { |
|---|
| | | return x.bind && x.bind.key == c.dicNo; |
|---|
| | | }); |
|---|
| | | if (_option) { |
|---|
| | | _option.bind.data = c.data; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | save() { |
|---|
| | | this.preview(false); |
|---|
| | | this.$emit("save", { |
|---|
| | | daraggeOptions: this.currentComponents, |
|---|
| | | formOptions: this.viewFormData, |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | download() { |
|---|
| | | this.preview(false); |
|---|
| | | downloadForm.call(this); |
|---|
| | | }, |
|---|
| | | openTableModel() { |
|---|
| | | let dataSource = this.currentTableOption.find((x) => { |
|---|
| | | return x.field == "dataSource"; |
|---|
| | | }); |
|---|
| | | if (!dataSource.bind.data.length) { |
|---|
| | | dataSource.bind.data = this.dicList; |
|---|
| | | } |
|---|
| | | this.currnetTableData = JSON.parse( |
|---|
| | | JSON.stringify(this.currentItem.columns) |
|---|
| | | ); |
|---|
| | | this.tableModel = true; |
|---|
| | | }, |
|---|
| | | addRow() { |
|---|
| | | this.currnetTableData.push({ field: this.getField() }); |
|---|
| | | }, |
|---|
| | | delRow() { |
|---|
| | | this.$confirm("确认è¦å é¤éæ©çæ°æ®å?", "è¦å", { |
|---|
| | | confirmButtonText: "ç¡®å®", |
|---|
| | | cancelButtonText: "åæ¶", |
|---|
| | | type: "warning", |
|---|
| | | center: true, |
|---|
| | | }).then(() => { |
|---|
| | | this.$refs.table.delRow(); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | sortRow() { |
|---|
| | | this.currnetTableData = this.currnetTableData.sort((a, b) => { |
|---|
| | | return a.orderNo - b.orderNo; |
|---|
| | | }); //.reverse(); |
|---|
| | | this.$Message.success("åæ¾ç¤ºé¡ºåºå·²éæ°æå,ç¹å»é¢è§å¯æ¥ç"); |
|---|
| | | }, |
|---|
| | | saveConfigOptions() { |
|---|
| | | this.currentItem.columns = JSON.parse( |
|---|
| | | JSON.stringify(this.currnetTableData) |
|---|
| | | ); |
|---|
| | | this.tableModel = false; |
|---|
| | | }, |
|---|
| | | copyItem(item) { |
|---|
| | | let itemClone = JSON.parse(JSON.stringify(item)); |
|---|
| | | itemClone.field = "field" + new Date().valueOf(); |
|---|
| | | this.currentComponents.push(itemClone); |
|---|
| | | }, |
|---|
| | | removeItem(index) { |
|---|
| | | this.currentComponents.splice(index, 1); |
|---|
| | | this.colWidth = 100; |
|---|
| | | this.currentIndex = -1; |
|---|
| | | this.currentItem = {}; |
|---|
| | | }, |
|---|
| | | clearItems() { |
|---|
| | | this.currentComponents.length = 0; |
|---|
| | | this.colWidth = 100; |
|---|
| | | this.currentIndex = -1; |
|---|
| | | this.currentItem = {}; |
|---|
| | | }, |
|---|
| | | itemClick(item, index) { |
|---|
| | | this.currentIndex = index; |
|---|
| | | this.colWidth = this.currentComponents[this.currentIndex].width; |
|---|
| | | this.currentItem = this.currentComponents[this.currentIndex]; |
|---|
| | | }, |
|---|
| | | //å¼å§ææ½äºä»¶ |
|---|
| | | onStart(e, e1) { |
|---|
| | | this.drag = true; |
|---|
| | | }, |
|---|
| | | getField() { |
|---|
| | | return "field" + new Date().valueOf(); |
|---|
| | | }, |
|---|
| | | //左边å¾å³è¾¹æå¨æ¶çäºä»¶ |
|---|
| | | end1(e) { |
|---|
| | | if (1 == 1 && e.from !== e.to) { |
|---|
| | | let obj = JSON.parse(JSON.stringify(this.components[e.oldIndex])); |
|---|
| | | obj.field = this.getField(); |
|---|
| | | obj.width = 100; |
|---|
| | | obj.readonly = false; |
|---|
| | | obj.required = false; |
|---|
| | | this.currentComponents.splice(e.newIndex, 1, obj); |
|---|
| | | this.userComponents.splice(0); |
|---|
| | | this.userComponents.push(...this.currentComponents); |
|---|
| | | // this.currentComponents = this.currentComponents.filter((x) => { |
|---|
| | | // return x.hasOwnProperty("field"); |
|---|
| | | // }); |
|---|
| | | this.colWidth = 100; |
|---|
| | | this.currentIndex = e.newIndex; //this.currentComponents.length - 1; |
|---|
| | | this.currentItem = this.currentComponents[this.currentIndex]; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | //å³è¾¹å¾å·¦è¾¹æå¨æ¶çäºä»¶ |
|---|
| | | end2(e) {}, |
|---|
| | | onMove1(e, originalEvent) { |
|---|
| | | // this.moveId = e.relatedContext.element.id; |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | //moveåè°æ¹æ³ |
|---|
| | | onMove(e, originalEvent) { |
|---|
| | | console.log(JSON.stringify(this.currentComponents)); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | dicChange(key) { |
|---|
| | | this.http |
|---|
| | | .post("api/Sys_Dictionary/GetVueDictionary", [key], true) |
|---|
| | | .then((result) => { |
|---|
| | | this.currentItem.data = result[0].data; |
|---|
| | | if (result[0].data.length) { |
|---|
| | | if (this.currentItem.type == "select") { |
|---|
| | | this.currentItem.value = result[0].data[0].value; |
|---|
| | | } else { |
|---|
| | | this.currentItem.values = [result[0].data[0].value]; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | example1() { |
|---|
| | | this.currentComponents = this.options1; |
|---|
| | | }, |
|---|
| | | example2() { |
|---|
| | | this.currentComponents = this.options2; |
|---|
| | | }, |
|---|
| | | example3() { |
|---|
| | | this.currentComponents = this.options3; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | tabsTable() { |
|---|
| | | return this.currentComponents.filter((x) => { |
|---|
| | | return x.type == "table" && x.tabs == true; |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | * { |
|---|
| | | box-sizing: border-box; |
|---|
| | | } |
|---|
| | | .drag-container { |
|---|
| | | /* padding: 20px; */ |
|---|
| | | display: flex; |
|---|
| | | height: 100%; |
|---|
| | | position: absolute; |
|---|
| | | width: 100%; |
|---|
| | | box-sizing: border-box; |
|---|
| | | } |
|---|
| | | .drag-left { |
|---|
| | | width: 250px; |
|---|
| | | display: flex; |
|---|
| | | border-right: 1px solid #eee; |
|---|
| | | flex-direction: column; |
|---|
| | | } |
|---|
| | | .left-title { |
|---|
| | | height: 42px; |
|---|
| | | text-align: left; |
|---|
| | | border-right: 1px solid #eee; |
|---|
| | | padding: 10px 0 10px 11px; |
|---|
| | | border-bottom: 1px solid #eee; |
|---|
| | | } |
|---|
| | | .drag-center { |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | .left-draggable-item { |
|---|
| | | // flex: 1; |
|---|
| | | display: inline-block; |
|---|
| | | padding: 5px; |
|---|
| | | // border-right: 1px solid #eee; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .left-draggable-item .item { |
|---|
| | | cursor: move; |
|---|
| | | float: left; |
|---|
| | | width: 111px; |
|---|
| | | /* height: 20px; */ |
|---|
| | | text-align: center; |
|---|
| | | border: 1px solid #eeeeee; |
|---|
| | | padding: 2px 13px; |
|---|
| | | text-align: left; |
|---|
| | | line-height: 28px; |
|---|
| | | margin: 4px; |
|---|
| | | border-radius: 3px; |
|---|
| | | background: #f0f9eb; |
|---|
| | | font-size: 13px; |
|---|
| | | } |
|---|
| | | // .drag-center-item { |
|---|
| | | // display: inline-block; |
|---|
| | | // width: 100%; |
|---|
| | | // height: calc(100vh - 122px); |
|---|
| | | // padding: 10px; |
|---|
| | | // } |
|---|
| | | .draggable-container { |
|---|
| | | display: inline-block; |
|---|
| | | width: 100%; |
|---|
| | | height: calc(100vh - 215px); |
|---|
| | | padding: 10px 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .item2 { |
|---|
| | | position: relative; |
|---|
| | | cursor: move; |
|---|
| | | padding: 18px 10px 10px 10px; |
|---|
| | | text-align: left; |
|---|
| | | float: left; |
|---|
| | | margin-bottom: 10px; |
|---|
| | | } |
|---|
| | | .item2 .el-icon-delete, |
|---|
| | | .item2 .el-icon-document-copy { |
|---|
| | | position: absolute; |
|---|
| | | right: 10px; |
|---|
| | | top: 2px; |
|---|
| | | padding: 5px; |
|---|
| | | display: none; |
|---|
| | | color: red; |
|---|
| | | cursor: pointer; |
|---|
| | | } |
|---|
| | | .item2 .el-icon-document-copy { |
|---|
| | | right: 35px; |
|---|
| | | } |
|---|
| | | .item2:hover, |
|---|
| | | .actived { |
|---|
| | | background: #f0f9eb; |
|---|
| | | } |
|---|
| | | .item:hover { |
|---|
| | | border: 1px dashed #787be8; |
|---|
| | | color: #787be8; |
|---|
| | | } |
|---|
| | | .item2:hover .el-icon-delete, |
|---|
| | | .item2:hover .el-icon-document-copy { |
|---|
| | | display: block; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .drag-right { |
|---|
| | | background: #f7fbff3d; |
|---|
| | | width: 250px; |
|---|
| | | border-left: 1px solid #eee; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .center-top { |
|---|
| | | height: 42px; |
|---|
| | | line-height: 41px; |
|---|
| | | background: #f2f5fb; |
|---|
| | | border-bottom: 1px solid #eee; |
|---|
| | | text-align: left; |
|---|
| | | padding: 0 10px; |
|---|
| | | font-size: 12px; |
|---|
| | | color: #3391f3; |
|---|
| | | } |
|---|
| | | .center-top span { |
|---|
| | | margin-right: 10px; |
|---|
| | | } |
|---|
| | | .attr { |
|---|
| | | padding: 0px 15px 15px 15px; |
|---|
| | | } |
|---|
| | | .attr-item { |
|---|
| | | text-align: left; |
|---|
| | | margin-top: 12px; |
|---|
| | | font-size: 14px; |
|---|
| | | } |
|---|
| | | .attr-item .text { |
|---|
| | | padding: 0 0 5px 5px; |
|---|
| | | } |
|---|
| | | .attr2 { |
|---|
| | | display: flex; |
|---|
| | | } |
|---|
| | | .attr2 > div { |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | .tips { |
|---|
| | | position: absolute; |
|---|
| | | font-size: 26px; |
|---|
| | | letter-spacing: 6px; |
|---|
| | | left: 0px; |
|---|
| | | right: 0px; |
|---|
| | | top: 150px; |
|---|
| | | width: 500px; |
|---|
| | | margin: auto; |
|---|
| | | color: #c5c5c5; |
|---|
| | | } |
|---|
| | | .col-line { |
|---|
| | | line-height: 25px; |
|---|
| | | font-weight: bold; |
|---|
| | | border-bottom: 1px solid rgb(218 218 218); |
|---|
| | | } |
|---|
| | | .drag-container ::v-deep(.el-col) { |
|---|
| | | width: 100%; |
|---|
| | | } |
|---|
| | | .drag-center ::v-deep(.el-form-item__label) { |
|---|
| | | line-height: 0 !important; |
|---|
| | | } |
|---|
| | | .drag-center ::v-deep(.el-scrollbar__wrap) { |
|---|
| | | overflow-x: hidden; |
|---|
| | | } |
|---|
| | | .drag-center ::v-deep(.el-form-item) { |
|---|
| | | margin-bottom: 10px; |
|---|
| | | } |
|---|
| | | .drag-center ::v-deep(.el-date-editor) { |
|---|
| | | width: 100%; |
|---|
| | | } |
|---|
| | | .drag-center ::v-deep(.el-checkbox) { |
|---|
| | | margin-right: 15px; |
|---|
| | | } |
|---|
| | | .drag-center ::v-deep(.el-checkbox__label) { |
|---|
| | | padding-left: 5px; |
|---|
| | | } |
|---|
| | | .drag-center ::v-deep(.hello > div) { |
|---|
| | | z-index: 500 !important; |
|---|
| | | } |
|---|
| | | .drag-center ::v-deep(th), |
|---|
| | | .drag-center ::v-deep(td) { |
|---|
| | | padding: 6px 0; |
|---|
| | | } |
|---|
| | | .example { |
|---|
| | | margin-top: 8px; |
|---|
| | | > div { |
|---|
| | | cursor: pointer; |
|---|
| | | padding: 14px 20px; |
|---|
| | | border-top: 1px solid #eee; |
|---|
| | | font-size: 13px; |
|---|
| | | color: #646465; |
|---|
| | | position: relative; |
|---|
| | | } |
|---|
| | | > div:hover { |
|---|
| | | background: rgb(231, 231, 231); |
|---|
| | | } |
|---|
| | | i { |
|---|
| | | position: absolute; |
|---|
| | | right: 20px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .btns { |
|---|
| | | padding: 8px 0; |
|---|
| | | display: flex; |
|---|
| | | > div { |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | .btns-left { |
|---|
| | | padding-top: 8px; |
|---|
| | | color: black; |
|---|
| | | font-weight: bold; |
|---|
| | | } |
|---|
| | | .btns-right { |
|---|
| | | text-align: right; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div style="padding: 15px 20px 15px 5px"> |
|---|
| | | <div class="pre-text">{{ text }}</div> |
|---|
| | | <vol-form |
|---|
| | | ref="form" |
|---|
| | | :labelWidth="80" |
|---|
| | | :load-key="false" |
|---|
| | | :formFields="options.fields" |
|---|
| | | :formRules="options.formOptions" |
|---|
| | | > |
|---|
| | | </vol-form> |
|---|
| | | <div class="tables"> |
|---|
| | | <div |
|---|
| | | class="table-item" |
|---|
| | | v-for="(item, index) in options.tables" |
|---|
| | | :key="index" |
|---|
| | | > |
|---|
| | | <div class="table-header"> |
|---|
| | | <div class="header-text"> |
|---|
| | | {{ item.name }} |
|---|
| | | </div> |
|---|
| | | <div class="header-btns"> |
|---|
| | | <el-button |
|---|
| | | type="primary" |
|---|
| | | size="small" |
|---|
| | | :key="bindex" |
|---|
| | | plain |
|---|
| | | @click="tableBtnClick(item, bindex, index)" |
|---|
| | | :icon="btnItem.icon" |
|---|
| | | v-for="(btnItem, bindex) in item.buttons" |
|---|
| | | > |
|---|
| | | {{ btnItem.name }} |
|---|
| | | </el-button> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <vol-table |
|---|
| | | :url="item.url" |
|---|
| | | :load-key="false" |
|---|
| | | :index="true" |
|---|
| | | :ref="'table' + index" |
|---|
| | | :tableData="item.tableData" |
|---|
| | | :columns="item.columns" |
|---|
| | | :max-height="250" |
|---|
| | | :pagination-hide="item.pagination" |
|---|
| | | :column-index="true" |
|---|
| | | :ck="true" |
|---|
| | | ></vol-table> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div class="tables" style="padding-bottom: 10px"> |
|---|
| | | <el-tabs |
|---|
| | | v-model="tabsModel" |
|---|
| | | v-show="options.tabs.length" |
|---|
| | | @tab-click="() => {}" |
|---|
| | | > |
|---|
| | | <el-tab-pane |
|---|
| | | style="padding: 0" |
|---|
| | | class="table-item" |
|---|
| | | v-for="(item, index) in options.tabs" |
|---|
| | | :label="item.name" |
|---|
| | | :name="index" |
|---|
| | | :key="index" |
|---|
| | | > |
|---|
| | | <div class="table-header"> |
|---|
| | | <div class="header-text"> |
|---|
| | | {{ item.name }} |
|---|
| | | </div> |
|---|
| | | <div class="header-btns"> |
|---|
| | | <el-button |
|---|
| | | type="primary" |
|---|
| | | size="small" |
|---|
| | | :key="bindex" |
|---|
| | | :icon="btnItem.icon" |
|---|
| | | plain |
|---|
| | | @click="tabsTableBtnClick(item, bindex, index)" |
|---|
| | | v-for="(btnItem, bindex) in item.buttons" |
|---|
| | | > |
|---|
| | | {{ btnItem.name }} |
|---|
| | | </el-button> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <vol-table |
|---|
| | | :url="item.url" |
|---|
| | | :load-key="false" |
|---|
| | | :index="true" |
|---|
| | | :ref="'tabsTable' + index" |
|---|
| | | :tableData="item.tableData" |
|---|
| | | :columns="item.columns" |
|---|
| | | :max-height="250" |
|---|
| | | :pagination-hide="item.pagination" |
|---|
| | | :column-index="true" |
|---|
| | | :ck="true" |
|---|
| | | ></vol-table> |
|---|
| | | </el-tab-pane> |
|---|
| | | </el-tabs> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div class="form-btns"> |
|---|
| | | <el-button type="primary" @click="submit" icon="el-icon-check" size="small" |
|---|
| | | >æ交</el-button |
|---|
| | | > |
|---|
| | | <el-button |
|---|
| | | type="primary" |
|---|
| | | @click="reset" |
|---|
| | | plain |
|---|
| | | icon="el-icon-refresh-right" |
|---|
| | | size="small" |
|---|
| | | >éç½®</el-button |
|---|
| | | > |
|---|
| | | <el-button |
|---|
| | | type="primary" |
|---|
| | | @click="download" |
|---|
| | | plain |
|---|
| | | icon="el-icon-refresh-right" |
|---|
| | | size="small" |
|---|
| | | >ä¸è½½ä»£ç </el-button |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import VolTable from "./../VolTable"; |
|---|
| | | import VolBox from "./../VolBox"; |
|---|
| | | import VolForm from "./../VolForm"; |
|---|
| | | import downloadForm from "./DownloadForm"; |
|---|
| | | export default { |
|---|
| | | props: { |
|---|
| | | options: { |
|---|
| | | type: Object, |
|---|
| | | default: () => { |
|---|
| | | return { fields: {}, formOptions: [], tables: [], tabs: [] }; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | text: "", |
|---|
| | | tabsModel: 0, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | created() {}, |
|---|
| | | methods: { |
|---|
| | | tableBtnClick(item, btnIndex, index) { |
|---|
| | | if (item.buttons[btnIndex].value == "add") { |
|---|
| | | this.$refs["table" + index].addRow({}); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | if (item.buttons[btnIndex].value == "del") { |
|---|
| | | this.$refs["table" + index].delRow(); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | tabsTableBtnClick(item, btnIndex, index) { |
|---|
| | | if (item.buttons[btnIndex].value == "add") { |
|---|
| | | this.$refs["tabsTable" + index].addRow({}); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | if (item.buttons[btnIndex].value == "del") { |
|---|
| | | this.$refs["tabsTable" + index].delRow(); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | submit() {}, |
|---|
| | | reset() { |
|---|
| | | this.$refs.form.reset(); |
|---|
| | | this.$Message.success("表åå·²éç½®"); |
|---|
| | | }, |
|---|
| | | download() { |
|---|
| | | downloadForm.call(this); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | components: { |
|---|
| | | "vol-table": VolTable, |
|---|
| | | "vol-box": VolBox, |
|---|
| | | "vol-form": VolForm, |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | |
|---|
| | | VolForm; |
|---|
| | | </script> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .form-btns { |
|---|
| | | text-align: center; |
|---|
| | | } |
|---|
| | | .tables { |
|---|
| | | padding-left: 15px; |
|---|
| | | .table-item { |
|---|
| | | padding: 10px; |
|---|
| | | } |
|---|
| | | .table-header { |
|---|
| | | display: flex; |
|---|
| | | margin-bottom: 8px; |
|---|
| | | } |
|---|
| | | .header-text { |
|---|
| | | position: relative; |
|---|
| | | bottom: -9px; |
|---|
| | | flex: 1; |
|---|
| | | font-weight: bold; |
|---|
| | | } |
|---|
| | | .header-btns { |
|---|
| | | text-align: right; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | |
|---|
| | | |
|---|
| | | let options1 = [ |
|---|
| | | { |
|---|
| | | "id": 1, |
|---|
| | | "name": "è¾å
¥æ¡", |
|---|
| | | "type": "text", |
|---|
| | | "value": "", |
|---|
| | | "icon": "el-icon-document", |
|---|
| | | "field": "field1630258884671", |
|---|
| | | "width": 20, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 3, |
|---|
| | | "name": "æ¥æ", |
|---|
| | | "type": "date", |
|---|
| | | "icon": "el-icon-date", |
|---|
| | | "value": null, |
|---|
| | | "field": "field1630258891760", |
|---|
| | | "width": 20, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 7, |
|---|
| | | "name": "ä¸ææ¡", |
|---|
| | | "value": null, |
|---|
| | | "key": "", |
|---|
| | | "data": [ |
|---|
| | | { |
|---|
| | | "label": "请设置æ°æ®æº", |
|---|
| | | "value": "请设置æ°æ®æº" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "type": "select", |
|---|
| | | "icon": "el-icon-arrow-down", |
|---|
| | | "field": "field1630258904862", |
|---|
| | | "width": 30, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 8, |
|---|
| | | "name": "ä¸æå¤é", |
|---|
| | | "type": "selectList", |
|---|
| | | "key": "", |
|---|
| | | "values": [], |
|---|
| | | "data": [ |
|---|
| | | { |
|---|
| | | "label": "请设置æ°æ®æº", |
|---|
| | | "value": "请设置æ°æ®æº" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "icon": "el-icon-arrow-down", |
|---|
| | | "field": "field1630258924442", |
|---|
| | | "width": 30, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 81, |
|---|
| | | "name": "级è", |
|---|
| | | "type": "cascader", |
|---|
| | | "icon": "el-icon-share", |
|---|
| | | "values": [], |
|---|
| | | "key": "", |
|---|
| | | "data": [ |
|---|
| | | { |
|---|
| | | "value": "请é
ç½®æ°æ®æº", |
|---|
| | | "label": "请é
ç½®æ°æ®æº", |
|---|
| | | "children": [ |
|---|
| | | { |
|---|
| | | "value": "å
·ä½", |
|---|
| | | "label": "èå:ä¸ææ¡ç»å®è®¾ç½®" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "value": "color", |
|---|
| | | "label": "å¯åç
§åå
¸ç¼å·[tree_roles]" |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "field": "field1630259518082", |
|---|
| | | "width": 20, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 6, |
|---|
| | | "name": "å¤é", |
|---|
| | | "values": [ |
|---|
| | | "åè´§" |
|---|
| | | ], |
|---|
| | | "type": "checkbox", |
|---|
| | | "key": "ordertype", |
|---|
| | | "data": [ |
|---|
| | | { |
|---|
| | | "key": "1", |
|---|
| | | "value": "åè´§" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "key": "2", |
|---|
| | | "value": "éè´§" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "key": "3", |
|---|
| | | "value": "è¿å" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "icon": "el-icon-circle-check", |
|---|
| | | "field": "field1630259033241", |
|---|
| | | "width": 30, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 5, |
|---|
| | | "name": "åé", |
|---|
| | | "type": "radio", |
|---|
| | | "icon": "el-icon-aim", |
|---|
| | | "value": 0, |
|---|
| | | "data": [ |
|---|
| | | { |
|---|
| | | "key": "0", |
|---|
| | | "value": "å¦" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "key": "2", |
|---|
| | | "value": "xx11" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "key": "1", |
|---|
| | | "value": "æ¯" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "key": "enable", |
|---|
| | | "field": "field1630259538490", |
|---|
| | | "width": 30, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false, |
|---|
| | | "values": [ |
|---|
| | | "å¦" |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 4, |
|---|
| | | "name": "switch", |
|---|
| | | "type": "switch", |
|---|
| | | "icon": "el-icon-turn-off", |
|---|
| | | "value": 0, |
|---|
| | | "field": "field1630259172794", |
|---|
| | | "width": 20, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 12, |
|---|
| | | "name": "å段信æ¯", |
|---|
| | | "type": "line", |
|---|
| | | "icon": "el-icon-guide", |
|---|
| | | "field": "field1630259600186", |
|---|
| | | "width": 100, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 9, |
|---|
| | | "name": "å¾ç", |
|---|
| | | "type": "img", |
|---|
| | | "url": "api/SellOrder/upload", |
|---|
| | | "maxSize": 3, |
|---|
| | | "fileInfo": [], |
|---|
| | | "multiple": false, |
|---|
| | | "autoUpload": false, |
|---|
| | | "maxFile": 5, |
|---|
| | | "icon": "el-icon-picture-outline", |
|---|
| | | "field": "field1630259295154", |
|---|
| | | "width": 100, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 10, |
|---|
| | | "name": "excel", |
|---|
| | | "url": "api/SellOrder/upload", |
|---|
| | | "maxSize": 3, |
|---|
| | | "multiple": false, |
|---|
| | | "autoUpload": true, |
|---|
| | | "maxFile": 5, |
|---|
| | | "fileInfo": [], |
|---|
| | | "type": "excel", |
|---|
| | | "icon": "el-icon-upload", |
|---|
| | | "field": "field1630259610476", |
|---|
| | | "width": 100, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 5, |
|---|
| | | "name": "åé", |
|---|
| | | "type": "radio", |
|---|
| | | "icon": "el-icon-aim", |
|---|
| | | "value": 0, |
|---|
| | | "data": [ |
|---|
| | | { |
|---|
| | | "key": "0", |
|---|
| | | "value": "å®¡æ ¸ä¸" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "key": "1", |
|---|
| | | "value": "å®¡æ ¸éè¿" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "key": "2", |
|---|
| | | "value": "å®¡æ ¸æªéè¿" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "key": "audit", |
|---|
| | | "field": "field1630258969346", |
|---|
| | | "width": 40, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false, |
|---|
| | | "values": [ |
|---|
| | | "å®¡æ ¸ä¸" |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | ]; |
|---|
| | | let options2=[ |
|---|
| | | { |
|---|
| | | "id": 1, |
|---|
| | | "name": "è¾å
¥æ¡", |
|---|
| | | "type": "text", |
|---|
| | | "value": "", |
|---|
| | | "icon": "el-icon-document", |
|---|
| | | "field": "field1630258884671", |
|---|
| | | "width": 20, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 3, |
|---|
| | | "name": "æ¥æ", |
|---|
| | | "type": "date", |
|---|
| | | "icon": "el-icon-date", |
|---|
| | | "value": null, |
|---|
| | | "field": "field1630258891760", |
|---|
| | | "width": 20, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 7, |
|---|
| | | "name": "ä¸ææ¡", |
|---|
| | | "value": null, |
|---|
| | | "key": "", |
|---|
| | | "data": [ |
|---|
| | | { |
|---|
| | | "label": "请设置æ°æ®æº", |
|---|
| | | "value": "请设置æ°æ®æº" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "type": "select", |
|---|
| | | "icon": "el-icon-arrow-down", |
|---|
| | | "field": "field1630258904862", |
|---|
| | | "width": 30, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 8, |
|---|
| | | "name": "ä¸æå¤é", |
|---|
| | | "type": "selectList", |
|---|
| | | "key": "", |
|---|
| | | "values": [], |
|---|
| | | "data": [ |
|---|
| | | { |
|---|
| | | "label": "请设置æ°æ®æº", |
|---|
| | | "value": "请设置æ°æ®æº" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "icon": "el-icon-arrow-down", |
|---|
| | | "field": "field1630258924442", |
|---|
| | | "width": 30, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 2, |
|---|
| | | "name": "textarea", |
|---|
| | | "type": "textarea", |
|---|
| | | "value": "", |
|---|
| | | "icon": "el-icon-document-copy", |
|---|
| | | "field": "field1630260207393", |
|---|
| | | "width": 100, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 13, |
|---|
| | | "name": "è¡¨æ ¼", |
|---|
| | | "type": "table", |
|---|
| | | "tabs": true, |
|---|
| | | "columns": [ |
|---|
| | | { |
|---|
| | | "title": "è¿åå·", |
|---|
| | | "field": "TranNo", |
|---|
| | | "show": true, |
|---|
| | | "required": false, |
|---|
| | | "edit": true, |
|---|
| | | "dataType": null, |
|---|
| | | "dataSource": null, |
|---|
| | | "width": "140", |
|---|
| | | "orderNo": null, |
|---|
| | | "elementIndex": 0 |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "title": "éå®è®¢åå·", |
|---|
| | | "field": "SellNo", |
|---|
| | | "show": true, |
|---|
| | | "required": false, |
|---|
| | | "edit": true, |
|---|
| | | "dataType": null, |
|---|
| | | "dataSource": null, |
|---|
| | | "width": "140", |
|---|
| | | "orderNo": null, |
|---|
| | | "elementIndex": 1 |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "title": "订åç±»å", |
|---|
| | | "field": "OrderType", |
|---|
| | | "show": true, |
|---|
| | | "required": false, |
|---|
| | | "edit": true, |
|---|
| | | "dataType": null, |
|---|
| | | "dataSource": "ordertype", |
|---|
| | | "width": 120, |
|---|
| | | "orderNo": null, |
|---|
| | | "elementIndex": 2, |
|---|
| | | "editType": "select" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "title": "éå®æ°é", |
|---|
| | | "field": "Qty", |
|---|
| | | "show": true, |
|---|
| | | "required": false, |
|---|
| | | "edit": true, |
|---|
| | | "dataType": null, |
|---|
| | | "dataSource": null, |
|---|
| | | "width": "80", |
|---|
| | | "orderNo": null, |
|---|
| | | "elementIndex": 3 |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "field": "CreateDate", |
|---|
| | | "elementIndex": 4, |
|---|
| | | "show": 1, |
|---|
| | | "required": 0, |
|---|
| | | "edit": 0, |
|---|
| | | "title": "订åæ¶é´", |
|---|
| | | "dataType": "date", |
|---|
| | | "width": "100" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "tableData": [ |
|---|
| | | { |
|---|
| | | "field1": "field1", |
|---|
| | | "field2": "field2", |
|---|
| | | "field3": "field3", |
|---|
| | | "field4": "field4" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "field1": "field1", |
|---|
| | | "field2": "field2", |
|---|
| | | "field3": "field3", |
|---|
| | | "field4": "field4" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "field1": "field1", |
|---|
| | | "field2": "field2", |
|---|
| | | "field3": "field3", |
|---|
| | | "field4": "field4" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "height": 200, |
|---|
| | | "icon": "el-icon-c-scale-to-original", |
|---|
| | | "url": "api/SellOrder/getPageData", |
|---|
| | | "index": false, |
|---|
| | | "columnIndex": false, |
|---|
| | | "ck": true, |
|---|
| | | "buttons": [ |
|---|
| | | { |
|---|
| | | "name": "æ·»å è¡", |
|---|
| | | "ck": false, |
|---|
| | | "icon": "el-icon-plus", |
|---|
| | | "value": "add" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "name": "å é¤è¡", |
|---|
| | | "ck": false, |
|---|
| | | "icon": "el-icon-delete", |
|---|
| | | "value": "del" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "name": "å·æ°", |
|---|
| | | "ck": false, |
|---|
| | | "icon": "el-icon-refresh-right", |
|---|
| | | "value": "ref" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "field": "field1630260242867", |
|---|
| | | "width": 100, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false, |
|---|
| | | "pagination": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 13, |
|---|
| | | "name": "è¡¨æ ¼", |
|---|
| | | "type": "table", |
|---|
| | | "tabs": true, |
|---|
| | | "columns": [ |
|---|
| | | { |
|---|
| | | "title": "å段1", |
|---|
| | | "field": "field1", |
|---|
| | | "show": true, |
|---|
| | | "required": false, |
|---|
| | | "edit": false, |
|---|
| | | "dataType": null, |
|---|
| | | "dataSource": null, |
|---|
| | | "width": 120, |
|---|
| | | "orderNo": null |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "title": "å段2", |
|---|
| | | "field": "field2", |
|---|
| | | "show": true, |
|---|
| | | "required": false, |
|---|
| | | "edit": false, |
|---|
| | | "dataType": null, |
|---|
| | | "dataSource": null, |
|---|
| | | "width": 120, |
|---|
| | | "orderNo": null |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "title": "å段3", |
|---|
| | | "field": "field3", |
|---|
| | | "show": true, |
|---|
| | | "required": false, |
|---|
| | | "edit": false, |
|---|
| | | "dataType": null, |
|---|
| | | "dataSource": null, |
|---|
| | | "width": 120, |
|---|
| | | "orderNo": null |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "title": "å段4", |
|---|
| | | "field": "field4", |
|---|
| | | "show": true, |
|---|
| | | "required": false, |
|---|
| | | "edit": false, |
|---|
| | | "dataType": null, |
|---|
| | | "dataSource": null, |
|---|
| | | "width": 120, |
|---|
| | | "orderNo": null |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "tableData": [ |
|---|
| | | { |
|---|
| | | "field1": "field1", |
|---|
| | | "field2": "field2", |
|---|
| | | "field3": "field3", |
|---|
| | | "field4": "field4" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "field1": "field1", |
|---|
| | | "field2": "field2", |
|---|
| | | "field3": "field3", |
|---|
| | | "field4": "field4" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "field1": "field1", |
|---|
| | | "field2": "field2", |
|---|
| | | "field3": "field3", |
|---|
| | | "field4": "field4" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "height": 200, |
|---|
| | | "icon": "el-icon-c-scale-to-original", |
|---|
| | | "url": null, |
|---|
| | | "index": false, |
|---|
| | | "columnIndex": false, |
|---|
| | | "ck": true, |
|---|
| | | "buttons": [ |
|---|
| | | { |
|---|
| | | "name": "æ·»å è¡", |
|---|
| | | "ck": false, |
|---|
| | | "icon": "el-icon-plus", |
|---|
| | | "value": "add" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "name": "å é¤è¡", |
|---|
| | | "ck": false, |
|---|
| | | "icon": "el-icon-delete", |
|---|
| | | "value": "del" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "name": "å·æ°", |
|---|
| | | "ck": false, |
|---|
| | | "icon": "el-icon-refresh-right", |
|---|
| | | "value": "ref" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "field": "field1630260481283", |
|---|
| | | "width": 100, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false, |
|---|
| | | "pagination": true |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | |
|---|
| | | let options3=[ |
|---|
| | | { |
|---|
| | | "id": 1, |
|---|
| | | "name": "è¾å
¥æ¡", |
|---|
| | | "type": "text", |
|---|
| | | "value": "", |
|---|
| | | "icon": "el-icon-document", |
|---|
| | | "field": "field1630258884671", |
|---|
| | | "width": 20, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 3, |
|---|
| | | "name": "æ¥æ", |
|---|
| | | "type": "date", |
|---|
| | | "icon": "el-icon-date", |
|---|
| | | "value": null, |
|---|
| | | "field": "field1630258891760", |
|---|
| | | "width": 20, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 7, |
|---|
| | | "name": "ä¸ææ¡", |
|---|
| | | "value": null, |
|---|
| | | "key": "", |
|---|
| | | "data": [ |
|---|
| | | { |
|---|
| | | "label": "请设置æ°æ®æº", |
|---|
| | | "value": "请设置æ°æ®æº" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "type": "select", |
|---|
| | | "icon": "el-icon-arrow-down", |
|---|
| | | "field": "field1630258904862", |
|---|
| | | "width": 30, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 8, |
|---|
| | | "name": "ä¸æå¤é", |
|---|
| | | "type": "selectList", |
|---|
| | | "key": "", |
|---|
| | | "values": [], |
|---|
| | | "data": [ |
|---|
| | | { |
|---|
| | | "label": "请设置æ°æ®æº", |
|---|
| | | "value": "请设置æ°æ®æº" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "icon": "el-icon-arrow-down", |
|---|
| | | "field": "field1630258924442", |
|---|
| | | "width": 30, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 5, |
|---|
| | | "name": "åé", |
|---|
| | | "type": "radio", |
|---|
| | | "icon": "el-icon-aim", |
|---|
| | | "value": 0, |
|---|
| | | "data": [ |
|---|
| | | { |
|---|
| | | "key": "0", |
|---|
| | | "value": "å¦" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "key": "2", |
|---|
| | | "value": "xx11" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "key": "1", |
|---|
| | | "value": "æ¯" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "key": "enable", |
|---|
| | | "field": "field1630260669595", |
|---|
| | | "width": 50, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false, |
|---|
| | | "values": [ |
|---|
| | | "å¦" |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 6, |
|---|
| | | "name": "å¤é", |
|---|
| | | "values": [ |
|---|
| | | "å¦" |
|---|
| | | ], |
|---|
| | | "type": "checkbox", |
|---|
| | | "key": "enable", |
|---|
| | | "data": [ |
|---|
| | | { |
|---|
| | | "key": "0", |
|---|
| | | "value": "å¦" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "key": "2", |
|---|
| | | "value": "xx11" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "key": "1", |
|---|
| | | "value": "æ¯" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | "icon": "el-icon-circle-check", |
|---|
| | | "field": "field1630260695322", |
|---|
| | | "width": 50, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 2, |
|---|
| | | "name": "textarea", |
|---|
| | | "type": "textarea", |
|---|
| | | "value": "", |
|---|
| | | "icon": "el-icon-document-copy", |
|---|
| | | "field": "field1630260207393", |
|---|
| | | "width": 100, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": 13, |
|---|
| | | "name": "ç¼è¾å¨", |
|---|
| | | "type": "editor", |
|---|
| | | "value": "", |
|---|
| | | "url": "", |
|---|
| | | "height": 200, |
|---|
| | | "icon": "el-icon-notebook-2", |
|---|
| | | "field": "field1630260646842", |
|---|
| | | "width": 100, |
|---|
| | | "readonly": false, |
|---|
| | | "required": false |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | export { options1, options2,options3 } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | import VolFormDraggable from './VolFormDraggable' |
|---|
| | | |
|---|
| | | export default VolFormDraggable; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | const components = [ |
|---|
| | | { |
|---|
| | | id: 1, |
|---|
| | | name: "è¾å
¥æ¡", |
|---|
| | | type: "text", |
|---|
| | | value: "", |
|---|
| | | icon: "el-icon-document", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | id: 2, |
|---|
| | | name: "textarea", |
|---|
| | | type: "textarea", |
|---|
| | | value: "", |
|---|
| | | icon: "el-icon-document-copy", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | id: 3, |
|---|
| | | name: "æ¥æ", |
|---|
| | | type: "date", |
|---|
| | | icon: "el-icon-date", |
|---|
| | | value: null, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | id: 4, |
|---|
| | | name: "switch", |
|---|
| | | type: "switch", |
|---|
| | | icon: "el-icon-turn-off", |
|---|
| | | value: 0, |
|---|
| | | }, |
|---|
| | | { id: 5, name: "åé", type: "radio", icon: "el-icon-aim", value: 0, data: [{ label: "0", value: "请设置æ°æ®æº1" }, { label: "1", value: "请设置æ°æ®æº2" }], key: "" }, |
|---|
| | | { |
|---|
| | | id: 6, |
|---|
| | | name: "å¤é", |
|---|
| | | values: [], |
|---|
| | | type: "checkbox", |
|---|
| | | key: "", |
|---|
| | | data: [{ label: "请设置æ°æ®æº", value: "请设置æ°æ®æº" }], |
|---|
| | | icon: "el-icon-circle-check", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | id: 7, |
|---|
| | | name: "ä¸ææ¡", |
|---|
| | | value: null, |
|---|
| | | key: "", |
|---|
| | | data: [{ label: "请设置æ°æ®æº", value: "请设置æ°æ®æº" }], |
|---|
| | | type: "select", |
|---|
| | | icon: "el-icon-arrow-down", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | id: 8, |
|---|
| | | name: "ä¸ææ¡å¤é", |
|---|
| | | type: "selectList", |
|---|
| | | key: "", |
|---|
| | | values: [], |
|---|
| | | data: [{ label: "请设置æ°æ®æº", value: "请设置æ°æ®æº" }], |
|---|
| | | icon: "el-icon-arrow-down", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | id: 81, |
|---|
| | | name: "级è", |
|---|
| | | type: "cascader", |
|---|
| | | icon: "el-icon-share", |
|---|
| | | values: [], |
|---|
| | | key: "", |
|---|
| | | data: [ |
|---|
| | | { |
|---|
| | | value: "请é
ç½®æ°æ®æº", |
|---|
| | | label: "请é
ç½®æ°æ®æº", |
|---|
| | | children: [ |
|---|
| | | { |
|---|
| | | value: "å
·ä½", |
|---|
| | | label: "èå:ä¸ææ¡ç»å®è®¾ç½®", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | value: "color", |
|---|
| | | label: "å¯åç
§åå
¸ç¼å·[tree_roles]", |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | id: 9, |
|---|
| | | name: "å¾çä¸ä¼ ", |
|---|
| | | type: "img", |
|---|
| | | url: "", |
|---|
| | | maxSize: 3, |
|---|
| | | fileInfo: [], |
|---|
| | | multiple: false, |
|---|
| | | autoUpload: false, |
|---|
| | | maxFile: 5, |
|---|
| | | icon: "el-icon-picture-outline", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | id: 10, |
|---|
| | | name: "excelä¸ä¼ ", |
|---|
| | | url: "", |
|---|
| | | maxSize: 3, |
|---|
| | | multiple: false, |
|---|
| | | autoUpload: false, |
|---|
| | | maxFile: 5, //æå¤å¯ä¸ä¼ 5个æ件 |
|---|
| | | fileInfo: [], |
|---|
| | | type: "excel", |
|---|
| | | icon: "el-icon-upload", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | id: 11, |
|---|
| | | name: "æ件ä¸ä¼ ", |
|---|
| | | type: "file", |
|---|
| | | url: "", |
|---|
| | | maxSize: 3, |
|---|
| | | multiple: false, |
|---|
| | | autoUpload: false, |
|---|
| | | maxFile: 5, |
|---|
| | | fileInfo: [], |
|---|
| | | icon: "el-icon-folder-opened", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | id: 12, |
|---|
| | | name: "å段信æ¯", |
|---|
| | | type: "line", |
|---|
| | | icon: "el-icon-guide", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | id: 13, |
|---|
| | | name: "ç¼è¾å¨", |
|---|
| | | type: "editor", |
|---|
| | | value: "", |
|---|
| | | url: "", |
|---|
| | | height: 200, |
|---|
| | | icon: "el-icon-notebook-2", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | id: 13, |
|---|
| | | name: "å¼¹åºæ¡", |
|---|
| | | type: "box", |
|---|
| | | value: "", |
|---|
| | | url: "", |
|---|
| | | height: 250, |
|---|
| | | icon: "el-icon-notebook-2", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | id: 13, |
|---|
| | | name: "è¡¨æ ¼", |
|---|
| | | type: "table", |
|---|
| | | tabs: false, |
|---|
| | | columns: [ |
|---|
| | | { title: "å段1", field: "field1", show: true, required: false, edit: false, dataType: null, dataSource: null, width: 120, orderNo: null }, |
|---|
| | | { title: "å段2", field: "field2", show: true, required: false, edit: false, dataType: null, dataSource: null, width: 120, orderNo: null }, |
|---|
| | | { title: "å段3", field: "field3", show: true, required: false, edit: false, dataType: null, dataSource: null, width: 120, orderNo: null }, |
|---|
| | | { title: "å段4", field: "field4", show: true, required: false, edit: false, dataType: null, dataSource: null, width: 120, orderNo: null }, |
|---|
| | | // { title: "å段5", field: "Field5", width: 120 }, |
|---|
| | | ], |
|---|
| | | tableData: [ |
|---|
| | | { |
|---|
| | | field1: "field1", |
|---|
| | | field2: "field2", |
|---|
| | | field3: "field3", |
|---|
| | | field4: "field4", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field1: "field1", |
|---|
| | | field2: "field2", |
|---|
| | | field3: "field3", |
|---|
| | | field4: "field4", |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field1: "field1", |
|---|
| | | field2: "field2", |
|---|
| | | field3: "field3", |
|---|
| | | field4: "field4", |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | height: 150, |
|---|
| | | icon: "el-icon-c-scale-to-original", |
|---|
| | | url: null, |
|---|
| | | index: false, //item.index, |
|---|
| | | height: 200, |
|---|
| | | index: false, |
|---|
| | | columnIndex: false, |
|---|
| | | ck: true, |
|---|
| | | buttons: [ |
|---|
| | | { name: 'æ·»å è¡', ck: false, icon: 'el-icon-plus',value:'add' }, |
|---|
| | | { name: 'å é¤è¡', ck: false, icon: 'el-icon-delete',value:'del' }, |
|---|
| | | { name: 'å·æ°', ck: false ,icon:'el-icon-refresh-right',value:'ref'}], |
|---|
| | | }, |
|---|
| | | ] |
|---|
| | | const tableOption = [ |
|---|
| | | { field: 'field', title: 'å段', edit: { type: "text", keep: true }, width: 160 }, |
|---|
| | | { field: 'title', title: 'å段ä¸æå', edit: { type: "text", keep: true }, width: 120 }, |
|---|
| | | { field: 'show', title: 'æ¯å¦æ¾ç¤º', edit: { type: "switch", keep: true }, width: 90 }, |
|---|
| | | { |
|---|
| | | field: 'dataType', title: 'æ¾ç¤ºç±»å', edit: { type: "select", keep: true }, width: 120, bind: { |
|---|
| | | key: '', data: [ |
|---|
| | | { "key": "switch", "value": "åé" }, |
|---|
| | | { "key": "date", "value": "å¹´ææ¥" }, |
|---|
| | | { "key": "img", "value": "å¾ç" }, |
|---|
| | | { "key": "excel", "value": "excel" }, |
|---|
| | | { "key": "file", "value": "æ件" } |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | { field: 'required', title: 'æ¯å¦å¿
å¡«', edit: { type: "switch", keep: true }, width: 90 }, |
|---|
| | | { field: 'edit', title: 'æ¯å¦å¯ç¼è¾', edit: { type: "switch", keep: true }, width: 90 }, |
|---|
| | | { |
|---|
| | | field: 'editType', title: 'ç¼è¾ç±»å', edit: { type: "select", keep: true, }, width: 120, bind: { |
|---|
| | | key: '', data: [{ "key": "text", "value": "è¾å
¥æ¡" }, |
|---|
| | | { "key": "switch", "value": "åé" }, |
|---|
| | | { "key": "select", "value": "ä¸ææ¡" }, |
|---|
| | | { "key": "selectList", "value": "ä¸ææ¡å¤é" }, |
|---|
| | | { "key": "date", "value": "æ¥æ" }, |
|---|
| | | { "key": "datetime", "value": "æ¥ææ¶åç§" }, |
|---|
| | | { "key": "checkbox", "value": "å¤éæ¡å¤é" }, |
|---|
| | | { "key": "mail", "value": "é®ç®±å°å" }, |
|---|
| | | { "key": "number", "value": "æ°å" }, |
|---|
| | | { "key": "decimal", "value": "å°æ°" }, |
|---|
| | | { "key": "phone", "value": "ææºå·" }, |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { field: 'dataSource', title: 'æ°æ®æº', edit: { type: "select", keep: true, data: [] }, bind: { key: '', data: [] }, width: 120 }, |
|---|
| | | { field: 'width', title: 'å宽度', edit: { type: "text", keep: true }, width: 80 }, |
|---|
| | | { field: 'orderNo', title: 'åæ¾ç¤ºé¡ºåº', edit: { type: "text", keep: true }, width: 100 } |
|---|
| | | ]; |
|---|
| | | export { components, tableOption } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | var code = `<template> |
|---|
| | | <div style="padding: 15px 20px 15px 5px"> |
|---|
| | | <div class="pre-text">{{ text }}</div> |
|---|
| | | <vol-form ref="form" |
|---|
| | | :labelWidth="80" |
|---|
| | | :load-key="false" |
|---|
| | | :formFields="fields" |
|---|
| | | :formRules="formOptions"> |
|---|
| | | </vol-form> |
|---|
| | | {#tables} |
|---|
| | | {#tabs} |
|---|
| | | |
|---|
| | | <div class="form-btns"> |
|---|
| | | <el-button type="primary" |
|---|
| | | @click="submit" |
|---|
| | | icon="el-icon-check" |
|---|
| | | size="mini">æ交</el-button> |
|---|
| | | <el-button type="primary" |
|---|
| | | @click="reset" |
|---|
| | | plain |
|---|
| | | icon="el-icon-refresh-right" |
|---|
| | | size="mini">éç½®</el-button> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | // 使ç¨æ¹å¼ï¼ |
|---|
| | | // 1ãæ°å»ºä¸ä¸ªvue页é¢ï¼ææ¤é¡µé¢å
容å¤å¶è¿å» |
|---|
| | | // 2ãrouter->index.jsé
置路ç±ï¼é¡µé¢ä¸è¾å
¥å°åå³å¯çå°æ°æ®(ä¹å¯ä»¥æèåé
ç½®ä¸) |
|---|
| | | // 3ãæè
åç
§è¡¨å设计页é¢åå¨æé¡µé¢ |
|---|
| | | //**表å设计å¨çtableä¸è½½è¿å¨å¼åä¸ |
|---|
| | | {import_VolTable} |
|---|
| | | import VolForm from '@/components/basic/VolForm' |
|---|
| | | export default { |
|---|
| | | components: {"vol-form": VolForm,{component_table}}, |
|---|
| | | data () { |
|---|
| | | return { |
|---|
| | | text: "", |
|---|
| | | tabsModel: "0", |
|---|
| | | fields: {#fields}, |
|---|
| | | formOptions: [{#formOptions}], |
|---|
| | | tables: [{#tableOptions}], |
|---|
| | | tabs: [{#tabsOptions}] |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | created () { |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods: {{table_ms} |
|---|
| | | submit () { |
|---|
| | | this.$Message.success("submit") |
|---|
| | | return; |
|---|
| | | this.http.post("url",this.fields,true).then(result=>{ |
|---|
| | | |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | reset () { |
|---|
| | | this.$refs.form.reset(); |
|---|
| | | this.$Message.success("表åå·²éç½®") |
|---|
| | | }, |
|---|
| | | download () { |
|---|
| | | this.$Message.info("111") |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | |
|---|
| | | VolForm; |
|---|
| | | </script> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .form-btns { |
|---|
| | | text-align: center; |
|---|
| | | } |
|---|
| | | .tables { |
|---|
| | | padding-left: 15px; |
|---|
| | | .table-item { |
|---|
| | | padding: 10px; |
|---|
| | | } |
|---|
| | | .table-header { |
|---|
| | | display: flex; |
|---|
| | | margin-bottom: 8px; |
|---|
| | | } |
|---|
| | | .header-text { |
|---|
| | | position: relative; |
|---|
| | | bottom: -9px; |
|---|
| | | flex: 1; |
|---|
| | | font-weight: bold; |
|---|
| | | } |
|---|
| | | .header-btns { |
|---|
| | | text-align: right; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style>` |
|---|
| | | |
|---|
| | | export default code |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="v-header"> |
|---|
| | | <div class="v-left-text"> |
|---|
| | | <!-- <i size="20" :class="icon" class="h-icon"/> --> |
|---|
| | | <span>{{ title || text }}</span> |
|---|
| | | </div> |
|---|
| | | <div class="content"> |
|---|
| | | <slot name="content"></slot> |
|---|
| | | </div> |
|---|
| | | <div class="v-right-content"> |
|---|
| | | <slot></slot> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | export default { |
|---|
| | | props: { |
|---|
| | | icon: { |
|---|
| | | type: String, |
|---|
| | | default: '' |
|---|
| | | }, |
|---|
| | | title: { |
|---|
| | | type: String, |
|---|
| | | default: '' |
|---|
| | | }, |
|---|
| | | text: { |
|---|
| | | type: String, |
|---|
| | | default: 'æªå®ä¹å称' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .v-header { |
|---|
| | | display: flex; |
|---|
| | | border-bottom: 1px solid #dcdee2; |
|---|
| | | .v-left-text { |
|---|
| | | margin-top: 3px; |
|---|
| | | padding-bottom: 6px; |
|---|
| | | font-weight: bold; |
|---|
| | | font-size: 15px; |
|---|
| | | color: #484848; |
|---|
| | | white-space: nowrap; |
|---|
| | | border-bottom: 2px solid #676767; |
|---|
| | | margin-bottom: -1px; |
|---|
| | | letter-spacing: 1px; |
|---|
| | | > span { |
|---|
| | | position: relative; |
|---|
| | | top: 2px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .content { |
|---|
| | | line-height: 25px; |
|---|
| | | padding-left: 10px; |
|---|
| | | padding: 6px 0 0 10px; |
|---|
| | | } |
|---|
| | | .v-right-content { |
|---|
| | | flex: 1; |
|---|
| | | text-align: right; |
|---|
| | | } |
|---|
| | | .h-icon { |
|---|
| | | position: relative; |
|---|
| | | top: 2px; |
|---|
| | | margin-right: 3px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <!-- 2021.11.18移é¤voltableæ¹æ³@cell-mouse-leave="rowEndEdit" --> |
|---|
| | | <div |
|---|
| | | class="vol-table" |
|---|
| | | :class="[ |
|---|
| | | textInline ? 'text-inline' : '', |
|---|
| | | fxRight ? 'fx-right' : '', |
|---|
| | | isChrome ? 'chrome' : '' |
|---|
| | | ]" |
|---|
| | | > |
|---|
| | | <div class="mask" v-show="loading"></div> |
|---|
| | | <div class="message" v-show="loading">å è½½ä¸.....</div> |
|---|
| | | <el-table |
|---|
| | | :show-summary="summary" |
|---|
| | | :summary-method="getSummaryData" |
|---|
| | | :row-key="rowKey" |
|---|
| | | :key="randomTableKey" |
|---|
| | | lazy |
|---|
| | | stripe |
|---|
| | | :load="loadTreeChildren" |
|---|
| | | @select="userSelect" |
|---|
| | | @select-all="userSelect" |
|---|
| | | @selection-change="selectionChange" |
|---|
| | | @row-dblclick="rowDbClick" |
|---|
| | | @row-click="rowClick" |
|---|
| | | @header-click="headerClick" |
|---|
| | | :highlight-current-row="highlightCurrentRow" |
|---|
| | | ref="table" |
|---|
| | | class="v-table" |
|---|
| | | @sort-change="sortChange" |
|---|
| | | tooltip-effect="dark" |
|---|
| | | :height="realHeight" |
|---|
| | | :max-height="realMaxHeight" |
|---|
| | | :data="url ? rowData : tableData" |
|---|
| | | border |
|---|
| | | :row-class-name="initIndex" |
|---|
| | | :cell-style="getCellStyle" |
|---|
| | | style="width: 100%" |
|---|
| | | :scrollbar-always-on="true" |
|---|
| | | > |
|---|
| | | <el-table-column |
|---|
| | | v-if="columnIndex" |
|---|
| | | type="index" |
|---|
| | | :fixed="fixed" |
|---|
| | | width="55" |
|---|
| | | ></el-table-column> |
|---|
| | | <el-table-column |
|---|
| | | v-if="ck" |
|---|
| | | type="selection" |
|---|
| | | :fixed="fixed" |
|---|
| | | :selectable="selectable" |
|---|
| | | width="55" |
|---|
| | | ></el-table-column> |
|---|
| | | |
|---|
| | | <!-- 2020.10.10移é¤table第ä¸è¡å¼ºå¶æåº --> |
|---|
| | | <el-table-column |
|---|
| | | v-for="(column, cindex) in filterColumns" |
|---|
| | | :prop="column.field" |
|---|
| | | :label="column.title" |
|---|
| | | :min-width="column.width" |
|---|
| | | :formatter="formatter" |
|---|
| | | :fixed="column.fixed" |
|---|
| | | :key="column.field + cindex" |
|---|
| | | :align="column.align" |
|---|
| | | :sortable="column.sort ? 'custom' : false" |
|---|
| | | :show-overflow-tooltip="column.showOverflowTooltip" |
|---|
| | | > |
|---|
| | | <template #header> |
|---|
| | | <span |
|---|
| | | v-if="(column.require || column.required) && column.edit" |
|---|
| | | class="column-required" |
|---|
| | | >*</span |
|---|
| | | >{{ column.title }} |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <template #default="scope"> |
|---|
| | | <!-- 2022.01.08å¢å å¤è¡¨å¤´ï¼ç°å¨åªæ¯æ常ç¨åè½æ¸²æï¼ä¸æ¯æç¼è¾åè½(æ¶åå°ç»ä»¶éå) --> |
|---|
| | | <el-table-column |
|---|
| | | style="border: none" |
|---|
| | | v-for="columnChildren in filterChildrenColumn(column.children)" |
|---|
| | | :key="columnChildren.field" |
|---|
| | | :min-width="columnChildren.width" |
|---|
| | | :class-name="columnChildren.class" |
|---|
| | | :prop="columnChildren.field" |
|---|
| | | :align="columnChildren.align" |
|---|
| | | :label="columnChildren.title" |
|---|
| | | > |
|---|
| | | <template #default="scopeChildren"> |
|---|
| | | <a |
|---|
| | | href="javascript:void(0)" |
|---|
| | | style="text-decoration: none" |
|---|
| | | @click="link(scopeChildren.row, columnChildren, $event)" |
|---|
| | | v-if="column.link" |
|---|
| | | v-text="scopeChildren.row[columnChildren.field]" |
|---|
| | | ></a> |
|---|
| | | <div |
|---|
| | | v-else-if="columnChildren.formatter" |
|---|
| | | @click=" |
|---|
| | | columnChildren.click && |
|---|
| | | columnChildren.click( |
|---|
| | | scopeChildren.row, |
|---|
| | | columnChildren, |
|---|
| | | scopeChildren.$index |
|---|
| | | ) |
|---|
| | | " |
|---|
| | | v-html=" |
|---|
| | | columnChildren.formatter( |
|---|
| | | scopeChildren.row, |
|---|
| | | columnChildren, |
|---|
| | | scopeChildren.$index |
|---|
| | | ) |
|---|
| | | " |
|---|
| | | ></div> |
|---|
| | | <div v-else-if="column.bind"> |
|---|
| | | {{ formatter(scopeChildren.row, columnChildren, true) }} |
|---|
| | | </div> |
|---|
| | | <span v-else-if="column.type == 'date'">{{ |
|---|
| | | formatterDate(scopeChildren.row, columnChildren) |
|---|
| | | }}</span> |
|---|
| | | <template v-else> |
|---|
| | | {{ scopeChildren.row[columnChildren.field] }} |
|---|
| | | </template> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | <!-- 2020.06.18å¢å render渲æèªå®ä¹å
容 --> |
|---|
| | | <table-render |
|---|
| | | v-if="column.render && typeof column.render == 'function'" |
|---|
| | | :row="scope.row" |
|---|
| | | key="rd-01" |
|---|
| | | :index="scope.$index" |
|---|
| | | :column="column" |
|---|
| | | :render="column.render" |
|---|
| | | ></table-render> |
|---|
| | | <!-- å¯ç¨åå»ç¼è¾åè½ï¼å¸¦ç¼è¾åè½çä¸ä¼æ¸²æä¸ææ¡ææ¬èæ¯é¢è² --> |
|---|
| | | <!-- @click="rowBeginEdit(scope.$index,cindex)" --> |
|---|
| | | <!-- 2021.09.21å¢å ç¼è¾æ¶å¯¹readonlyå±æ§å¤æ --> |
|---|
| | | <template v-else-if="column.edit&&!column.readonly&&['file', 'img','excel'].indexOf(column.edit.type) != -1" > |
|---|
| | | <div style="display:flex;align-items: center;" @click.stop> |
|---|
| | | <i style="padding: 3px;margin-right: 10px;color:#8f9293;cursor: pointer;" @click="showUpload(scope.row, column)" class="el-icon-upload"></i> |
|---|
| | | <img |
|---|
| | | v-if="column.edit.type == 'img'" |
|---|
| | | v-for="(file, imgIndex) in getFilePath( |
|---|
| | | scope.row[column.field], |
|---|
| | | column |
|---|
| | | )" |
|---|
| | | :key="imgIndex" |
|---|
| | | :onerror="defaultImg" |
|---|
| | | @click="viewImg(scope.row, column, file.path, $event)" |
|---|
| | | class="table-img" |
|---|
| | | :src="file.path" |
|---|
| | | /> |
|---|
| | | <a |
|---|
| | | style="margin-right: 8px" |
|---|
| | | v-else |
|---|
| | | class="t-file" |
|---|
| | | v-for="(file, fIndex) in getFilePath( |
|---|
| | | scope.row[column.field], |
|---|
| | | column |
|---|
| | | )" |
|---|
| | | :key="fIndex" |
|---|
| | | @click="dowloadFile(file)" |
|---|
| | | >{{ file.name }}</a |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <div |
|---|
| | | v-else-if=" |
|---|
| | | column.edit && |
|---|
| | | !column.readonly && |
|---|
| | | (column.edit.keep || edit.rowIndex == scope.$index) |
|---|
| | | " |
|---|
| | | class="edit-el" |
|---|
| | | > |
|---|
| | | <div @click.stop class="e-item"> |
|---|
| | | <div> |
|---|
| | | <!-- 2020.07.24å¢å æ¥æonChangeäºä»¶ --> |
|---|
| | | <el-date-picker |
|---|
| | | clearable |
|---|
| | | size="default" |
|---|
| | | style="width: 100%" |
|---|
| | | v-if="['date', 'datetime'].indexOf(column.edit.type) != -1" |
|---|
| | | v-model="scope.row[column.field]" |
|---|
| | | @change=" |
|---|
| | | (val) => { |
|---|
| | | column.onChange && |
|---|
| | | column.onChange(scope.row, column, val); |
|---|
| | | } |
|---|
| | | " |
|---|
| | | :type="column.edit.type" |
|---|
| | | :placeholder="column.placeholder || column.title" |
|---|
| | | :disabledDate="(val) => getDateOptions(val, column)" |
|---|
| | | :value-format="getDateFormat(column)" |
|---|
| | | :disabled="initColumnDisabled(scope.row, column)" |
|---|
| | | > |
|---|
| | | </el-date-picker> |
|---|
| | | <el-time-picker |
|---|
| | | clearable |
|---|
| | | size="default" |
|---|
| | | style="width: 100%" |
|---|
| | | v-else-if="column.edit.type == 'time'" |
|---|
| | | v-model="scope.row[column.field]" |
|---|
| | | @change=" |
|---|
| | | (val) => { |
|---|
| | | column.onChange && |
|---|
| | | column.onChange(scope.row, column, val); |
|---|
| | | } |
|---|
| | | " |
|---|
| | | :placeholder="column.placeholder || column.title" |
|---|
| | | :value-format="column.format || 'HH:mm:ss'" |
|---|
| | | :disabled="initColumnDisabled(scope.row, column)" |
|---|
| | | > |
|---|
| | | </el-time-picker> |
|---|
| | | <el-switch |
|---|
| | | v-else-if="column.edit.type == 'switch'" |
|---|
| | | v-model="scope.row[column.field]" |
|---|
| | | active-color="#0f84ff" |
|---|
| | | inactive-color="rgb(194 194 194)" |
|---|
| | | @change=" |
|---|
| | | (val) => { |
|---|
| | | switchChange(val, scope.row, column); |
|---|
| | | } |
|---|
| | | " |
|---|
| | | :active-value=" |
|---|
| | | typeof scope.row[column.field] == 'boolean' |
|---|
| | | ? true |
|---|
| | | : typeof scope.row[column.field] == 'string' |
|---|
| | | ? '1' |
|---|
| | | : 1 |
|---|
| | | " |
|---|
| | | :inactive-value=" |
|---|
| | | typeof scope.row[column.field] == 'boolean' |
|---|
| | | ? false |
|---|
| | | : typeof scope.row[column.field] == 'string' |
|---|
| | | ? '0' |
|---|
| | | : 0 |
|---|
| | | " |
|---|
| | | :disabled="initColumnDisabled(scope.row, column)" |
|---|
| | | > |
|---|
| | | </el-switch> |
|---|
| | | <template |
|---|
| | | v-else-if=" |
|---|
| | | ['select', 'selectList'].indexOf(column.edit.type) != -1 |
|---|
| | | " |
|---|
| | | > |
|---|
| | | <el-select-v2 |
|---|
| | | style="width: 100%" |
|---|
| | | :size="size" |
|---|
| | | v-if="column.bind.data.length >= select2Count" |
|---|
| | | v-model="scope.row[column.field]" |
|---|
| | | filterable |
|---|
| | | :multiple="column.edit.type == 'select' ? false : true" |
|---|
| | | :placeholder="column.placeholder || column.title" |
|---|
| | | :autocomplete="column.autocomplete" |
|---|
| | | :options="column.bind.data" |
|---|
| | | @change=" |
|---|
| | | column.onChange && column.onChange(scope.row, column) |
|---|
| | | " |
|---|
| | | clearable |
|---|
| | | :disabled="initColumnDisabled(scope.row, column)" |
|---|
| | | > |
|---|
| | | <template #default="{ item }"> |
|---|
| | | {{ item.label }} |
|---|
| | | </template> |
|---|
| | | </el-select-v2> |
|---|
| | | |
|---|
| | | <el-select |
|---|
| | | size="default" |
|---|
| | | style="width: 100%" |
|---|
| | | v-else |
|---|
| | | v-model="scope.row[column.field]" |
|---|
| | | :filterable=" |
|---|
| | | column.filter || column.bind.data.length > 10 |
|---|
| | | ? true |
|---|
| | | : false |
|---|
| | | " |
|---|
| | | :multiple="column.edit.type == 'select' ? false : true" |
|---|
| | | :placeholder="column.placeholder || column.title" |
|---|
| | | :autocomplete="column.autocomplete" |
|---|
| | | @change=" |
|---|
| | | column.onChange && column.onChange(scope.row, column) |
|---|
| | | " |
|---|
| | | clearable |
|---|
| | | :disabled="initColumnDisabled(scope.row, column)" |
|---|
| | | > |
|---|
| | | <el-option |
|---|
| | | v-for="item in column.bind.data" |
|---|
| | | :key="item.key" |
|---|
| | | v-show="!item.hidden" |
|---|
| | | :disabled="item.disabled" |
|---|
| | | :label="item.value" |
|---|
| | | :value="item.key" |
|---|
| | | >{{ item.value }} |
|---|
| | | </el-option> |
|---|
| | | </el-select> |
|---|
| | | </template> |
|---|
| | | <el-input |
|---|
| | | v-else-if="column.edit.type == 'textarea'" |
|---|
| | | type="textarea" |
|---|
| | | :placeholder="column.placeholder || column.title" |
|---|
| | | v-model="scope.row[column.field]" |
|---|
| | | :disabled="initColumnDisabled(scope.row, column)" |
|---|
| | | > |
|---|
| | | </el-input> |
|---|
| | | <input |
|---|
| | | class="table-input" |
|---|
| | | v-else-if="!column.summary && !column.onKeyPress" |
|---|
| | | v-model.lazy="scope.row[column.field]" |
|---|
| | | :disabled="initColumnDisabled(scope.row, column)" |
|---|
| | | /> |
|---|
| | | <el-input |
|---|
| | | v-else |
|---|
| | | @change="inputKeyPress(scope.row, column, $event)" |
|---|
| | | @input="inputKeyPress(scope.row, column, $event)" |
|---|
| | | @keyup.enter="inputKeyPress(scope.row, column, $event)" |
|---|
| | | size="default" |
|---|
| | | v-model="scope.row[column.field]" |
|---|
| | | :placeholder="column.placeholder || column.title" |
|---|
| | | :disabled="initColumnDisabled(scope.row, column)" |
|---|
| | | ></el-input> |
|---|
| | | </div> |
|---|
| | | <div |
|---|
| | | class="extra" |
|---|
| | | v-if="column.extra && edit.rowIndex == scope.$index" |
|---|
| | | > |
|---|
| | | <a |
|---|
| | | :style="column.extra.style" |
|---|
| | | style="text-decoration: none" |
|---|
| | | @click="extraClick(scope.row, column)" |
|---|
| | | > |
|---|
| | | <i v-if="column.extra.icon" :class="[column.extra.icon]" /> |
|---|
| | | {{ column.extra.text }} |
|---|
| | | </a> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <!--没æç¼è¾åè½çç´æ¥æ¸²ææ ç¾--> |
|---|
| | | <template v-else> |
|---|
| | | <a |
|---|
| | | href="javascript:void(0)" |
|---|
| | | style="text-decoration: none" |
|---|
| | | @click="link(scope.row, column, $event)" |
|---|
| | | v-if="column.link" |
|---|
| | | v-text="scope.row[column.field]" |
|---|
| | | ></a> |
|---|
| | | <img |
|---|
| | | v-else-if="column.type == 'img'" |
|---|
| | | v-for="(file, imgIndex) in getFilePath( |
|---|
| | | scope.row[column.field], |
|---|
| | | column |
|---|
| | | )" |
|---|
| | | :key="imgIndex" |
|---|
| | | :onerror="defaultImg" |
|---|
| | | @click="viewImg(scope.row, column, file.path, $event)" |
|---|
| | | class="table-img" |
|---|
| | | :src="file.path" |
|---|
| | | /> |
|---|
| | | <a |
|---|
| | | style="margin-right: 8px" |
|---|
| | | v-else-if="column.type == 'file' || column.type == 'excel'" |
|---|
| | | class="t-file" |
|---|
| | | v-for="(file, fIndex) in getFilePath( |
|---|
| | | scope.row[column.field], |
|---|
| | | column |
|---|
| | | )" |
|---|
| | | :key="fIndex" |
|---|
| | | @click="dowloadFile(file)" |
|---|
| | | >{{ file.name }}</a |
|---|
| | | > |
|---|
| | | <span v-else-if="column.type == 'date'">{{ |
|---|
| | | formatterDate(scope.row, column) |
|---|
| | | }}</span> |
|---|
| | | <div |
|---|
| | | v-else-if="column.formatter" |
|---|
| | | @click="formatterClick(scope.row, column, $event)" |
|---|
| | | v-html="column.formatter(scope.row, column)" |
|---|
| | | ></div> |
|---|
| | | <!-- 2021.11.18ä¿®å¤tableæ°æ®æºè®¾ç½®ä¸ºnormalåç¹å»è¡$event缺失çé®é¢ --> |
|---|
| | | <div |
|---|
| | | v-else-if="column.bind && (column.normal || column.edit)" |
|---|
| | | @click="formatterClick(scope.row, column, $event)" |
|---|
| | | :style="column.getStyle && column.getStyle(scope.row, column)" |
|---|
| | | > |
|---|
| | | {{ formatter(scope.row, column, true) }} |
|---|
| | | </div> |
|---|
| | | <div |
|---|
| | | v-else-if="column.click && !column.bind" |
|---|
| | | @click="formatterClick(scope.row, column)" |
|---|
| | | > |
|---|
| | | {{ scope.row[column.field] }} |
|---|
| | | </div> |
|---|
| | | <div |
|---|
| | | @click=" |
|---|
| | | () => { |
|---|
| | | column.click && formatterClick(scope.row, column); |
|---|
| | | } |
|---|
| | | " |
|---|
| | | v-else-if="column.bind" |
|---|
| | | > |
|---|
| | | <el-tag |
|---|
| | | v-if="useTag" |
|---|
| | | :class="[isEmptyTag(scope.row, column)]" |
|---|
| | | :type="getColor(scope.row, column)" |
|---|
| | | :effect="column.effect" |
|---|
| | | >{{ formatter(scope.row, column, true) }}</el-tag |
|---|
| | | > |
|---|
| | | <template v-else>{{ |
|---|
| | | formatter(scope.row, column, true) |
|---|
| | | }}</template> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <span v-else>{{ formatter(scope.row, column, true) }}</span> |
|---|
| | | </template> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | </el-table> |
|---|
| | | <template v-if="!paginationHide"> |
|---|
| | | <div class="block pagination" key="pagination-01" style="display: flex"> |
|---|
| | | <div style="flex: 1"></div> |
|---|
| | | <el-pagination |
|---|
| | | key="pagination-02" |
|---|
| | | @size-change="handleSizeChange" |
|---|
| | | @current-change="handleCurrentChange" |
|---|
| | | :current-page="paginations.page" |
|---|
| | | :page-sizes="paginations.sizes" |
|---|
| | | :page-size="paginations.size" |
|---|
| | | layout="total, sizes, prev, pager, next, jumper" |
|---|
| | | :total="paginations.total" |
|---|
| | | ></el-pagination> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <VolBox |
|---|
| | | v-model="uploadModel" |
|---|
| | | title="ä¸ä¼ " |
|---|
| | | :height="228" |
|---|
| | | :width="500" |
|---|
| | | :padding="15" |
|---|
| | | lazy |
|---|
| | | > |
|---|
| | | <!-- ä¸ä¼ å¾çãexcelæå
¶ä»æ件ãæ件æ°éã大å°éå¶é½å¯ä»¥ï¼åç
§voluploadç»ä»¶api --> |
|---|
| | | <div style="height: 200px;display: flex;align-items: center;"> |
|---|
| | | <VolUpload |
|---|
| | | style="text-align: center; " |
|---|
| | | :autoUpload="currentColumn.edit.autoUpload" |
|---|
| | | :multiple="currentColumn.edit.multiple" |
|---|
| | | :url="uploadUrl" |
|---|
| | | :max-file="currentColumn.edit.maxFile" |
|---|
| | | :img="currentColumn.edit.type == 'img'" |
|---|
| | | :excel="currentColumn.edit.type == 'excel'" |
|---|
| | | :fileTypes="currentColumn.edit.fileTypes ? currentColumn.edit.fileTypes : []" |
|---|
| | | :fileInfo="fileInfo" |
|---|
| | | :upload-after="uploadAfter" |
|---|
| | | > |
|---|
| | | <div>{{ currentColumn.message}}</div> |
|---|
| | | </VolUpload> |
|---|
| | | </div> |
|---|
| | | <template #footer> |
|---|
| | | <div style="text-align: center; "> |
|---|
| | | <el-button type="default" size="small" @click="uploadModel=false">å
³é</el-button > |
|---|
| | | <el-button type="primary" size="small" @click="saveUpload" >ä¿å</el-button > |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </VolBox> |
|---|
| | | |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import VolTableRender from './VolTable/VolTableRender'; |
|---|
| | | let _errMsg; |
|---|
| | | import { defineComponent,defineAsyncComponent } from 'vue'; |
|---|
| | | export default defineComponent({ |
|---|
| | | //https://github.com/element-plus/element-plus/issues/1483 |
|---|
| | | //没æåå
çselectionå±æ§äºï¼çissueä¸ä½¿ç¨select/selectallè·å |
|---|
| | | //çå¬æ°ç»é¿åº¦ï¼å¦æå é¤äºæ°æ®ï¼ç°å¨åªè½è¢«è¿«æ¸
é¤ææéä¸çè¡ |
|---|
| | | watch: { |
|---|
| | | 'tableData.length': { |
|---|
| | | handler(newLen, oldLen) { |
|---|
| | | this.watchRowSelectChange(newLen, oldLen); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | 'rowData.length': { |
|---|
| | | handler(newLen, oldLen) { |
|---|
| | | this.watchRowSelectChange(newLen, oldLen); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | components: { 'table-render': VolTableRender, |
|---|
| | | VolUpload: defineAsyncComponent(() =>import("@/components/basic/VolUpload.vue") ), |
|---|
| | | VolBox: defineAsyncComponent(() => import("@/components/basic/VolBox.vue")), |
|---|
| | | }, |
|---|
| | | props: { |
|---|
| | | rowKey: { |
|---|
| | | // æ å½¢ç»æç主é®å段ï¼å¦æ设置å¼é»è®¤ä¼å¼å¯æ å½¢tableï¼æ³¨ærowKeyå段çå¼å¿
é¡»æ¯å¯ä¸ï¼2021.05.02ï¼ |
|---|
| | | typeof: String, |
|---|
| | | default: undefined |
|---|
| | | }, |
|---|
| | | loadTreeChildren: { |
|---|
| | | // æ å½¢ç»æå è½½åèç¹ |
|---|
| | | type: Function, |
|---|
| | | default: (tree, treeNode, resolve) => { |
|---|
| | | return resolve([]); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | textInline: { |
|---|
| | | // è¡¨æ ¼å
容è¶
åºåæ¯å¦æ¢è¡æ¾ç¤ºï¼2020.01.16ï¼ |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | tableData: { |
|---|
| | | // 表æ°æ®æº,é
ç½®äºurlå°±ä¸ç¨ä¼ è¿ä¸ªåæ°äº |
|---|
| | | type: Array, |
|---|
| | | default: () => { |
|---|
| | | return []; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | columns: { |
|---|
| | | type: Array, |
|---|
| | | default: [] |
|---|
| | | }, |
|---|
| | | height: { |
|---|
| | | type: Number, |
|---|
| | | default: 0 |
|---|
| | | }, |
|---|
| | | maxHeight: { |
|---|
| | | type: Number, |
|---|
| | | default: 0 |
|---|
| | | }, |
|---|
| | | linkView: { |
|---|
| | | type: Function, |
|---|
| | | default: function() { |
|---|
| | | return 1; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | pagination: { |
|---|
| | | type: Object, |
|---|
| | | default: function() { |
|---|
| | | return { total: 0, size: 30, sortName: '' }; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | url: { |
|---|
| | | type: String, |
|---|
| | | default: '' |
|---|
| | | }, |
|---|
| | | paginationHide: { |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | color: { |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | index: { |
|---|
| | | // æ¯å¦å建索å¼å·,å¦æéè¦è¡¨æ ¼ç¼è¾åè½ï¼è¿ééè¦è®¾ç½®ä¸ºtrue |
|---|
| | | type: Boolean, |
|---|
| | | default: false |
|---|
| | | }, |
|---|
| | | allowEmpty: { |
|---|
| | | // è¡¨æ ¼æ°æ®ä¸ºç©ºæ¶æ¯å¦é»è®¤ä¸º-- |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | defaultLoadPage: { |
|---|
| | | // ä¼ å
¥äºurlï¼æ¯å¦é»è®¤å è½½è¡¨æ ¼æ°æ® |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | loadKey: { |
|---|
| | | // æ¯å¦èªå¨ä»åå°å è½½æ°æ®æº |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | single: { |
|---|
| | | type: Boolean, // æ¯å¦åé |
|---|
| | | default: false |
|---|
| | | }, |
|---|
| | | doubleEdit: { |
|---|
| | | type: Boolean, // æ¯å¦åå»å¯ç¨ç¼è¾åè½ |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | beginEdit: { |
|---|
| | | // ç¼è¾å¼å§ |
|---|
| | | type: Function, |
|---|
| | | default: function(row, column, index) { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | endEditBefore: { |
|---|
| | | // ç»æç¼è¾å |
|---|
| | | type: Function, |
|---|
| | | default: function(row, column, index) { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | endEditAfter: { |
|---|
| | | // ç»æç¼è¾å |
|---|
| | | type: Function, |
|---|
| | | default: function(row, column, index) { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | ck: { |
|---|
| | | // æ¯å¦æ¾ç¤ºcheckbox |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | columnIndex: { |
|---|
| | | // æ¯å¦æ¾ç¤ºè¡å·(2020..11.1) |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | highlightCurrentRow: { |
|---|
| | | //å¢å éä¸è¡é«äº®æ¾ç¤º(2022.10.07) |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | select2Count: { |
|---|
| | | //è¶
åºæ°éæ¾ç¤ºselect2ç»ä»¶ |
|---|
| | | type: Number, |
|---|
| | | default: 500 |
|---|
| | | }, |
|---|
| | | selectable: { |
|---|
| | | type: Function, |
|---|
| | | default: (row, index) => { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | fixed: false, //æ¯åºå®è¡å·ä¸checkbox |
|---|
| | | clickEdit: true, //2021.07.17设置为ç¹å»è¡ç»æç¼è¾ |
|---|
| | | randomTableKey: 1, |
|---|
| | | visiblyColumns: [], |
|---|
| | | key: '', |
|---|
| | | realHeight: 0, |
|---|
| | | realMaxHeight: 0, |
|---|
| | | enableEdit: false, // æ¯å¦å¯è¡¨æ ¼ç¨ç¼è¾åè½ |
|---|
| | | empty: this.allowEmpty ? '' : '--', |
|---|
| | | defaultImg: 'this.src="' + require('@/assets/imgs/error.png') + '"', |
|---|
| | | loading: false, |
|---|
| | | footer: {}, |
|---|
| | | total: 0, |
|---|
| | | formatConfig: {}, |
|---|
| | | // defaultColor: "", |
|---|
| | | // 2020.09.06è°æ´tableåæ°æ®æºçèæ¯é¢è² |
|---|
| | | colors: ['', 'warning', 'success', 'danger', 'info'], |
|---|
| | | rule: { |
|---|
| | | phone: /^[1][3,4,5,6,7,8,9][0-9]{9}$/, |
|---|
| | | decimal: /(^[\-0-9][0-9]*(.[0-9]+)?)$/, |
|---|
| | | number: /(^[\-0-9][0-9]*([0-9]+)?)$/ |
|---|
| | | }, |
|---|
| | | columnNames: [], |
|---|
| | | rowData: [], |
|---|
| | | paginations: { |
|---|
| | | sort: '', |
|---|
| | | order: 'desc', |
|---|
| | | Foots: '', |
|---|
| | | total: 0, |
|---|
| | | // 2020.08.29å¢å èªå®ä¹å页æ¡å¤§å° |
|---|
| | | sizes: [30, 60, 100, 120], |
|---|
| | | size: 30, // é»è®¤åé¡µå¤§å° |
|---|
| | | Wheres: [], |
|---|
| | | page: 1, |
|---|
| | | rows: 30 |
|---|
| | | }, |
|---|
| | | errorFiled: '', |
|---|
| | | edit: { columnIndex: -1, rowIndex: -1 }, // å½ååå»ç¼è¾çè¡ä¸ååæ |
|---|
| | | editStatus: {}, |
|---|
| | | summary: false, // æ¯å¦æ¾ç¤ºå计 |
|---|
| | | // ç®ååªæ¯æä»åå°è¿åçsummaryDataæ°æ® |
|---|
| | | summaryData: [], |
|---|
| | | summaryIndex: {}, |
|---|
| | | remoteColumns: [], // éè¦æ¯æ¬¡å·æ°æå页åä»åå°å è½½åå
¸æ°æ®æºçåé
ç½® |
|---|
| | | cellStyleColumns: {}, // æèæ¯é¢è²çé
ç½® |
|---|
| | | fxRight: false, //æ¯å¦æå³è¾¹åºå®è¡¨å¤´ |
|---|
| | | selectRows: [], //å½åéä¸çè¡ |
|---|
| | | isChrome: false, |
|---|
| | | //vol-table带æ°æ®æºçåå
æ ¼æ¯å¦å¯ç¨tagæ ç¾(ä¸ææ¡çåå
æ ¼ä»¥tagæ ç¾æ¾ç¤º) |
|---|
| | | //2023.04.02æ´æ°voltableä¸main.js |
|---|
| | | useTag: true, |
|---|
| | | currentRow:{}, |
|---|
| | | currentColumn:[], |
|---|
| | | fileInfo:[], |
|---|
| | | uploadUrl:"", |
|---|
| | | uploadModel:false |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | created() { |
|---|
| | | try { |
|---|
| | | this.useTag = this.$global.table.useTag; |
|---|
| | | } catch (error) { |
|---|
| | | console.log(error.message); |
|---|
| | | } |
|---|
| | | //2021.06.19å¤æè°·æå
æ ¸æµè§éæ°è®¡ç®tableé«åº¦ |
|---|
| | | // if ( |
|---|
| | | // navigator.userAgent.indexOf('Chrome') != -1 || |
|---|
| | | // navigator.userAgent.indexOf('Edge') != -1 |
|---|
| | | // ) { |
|---|
| | | // this.isChrome = true; |
|---|
| | | // } |
|---|
| | | this.realHeight = this.getHeight(); |
|---|
| | | this.realMaxHeight = this.getMaxHeight(); |
|---|
| | | this.fxRight = this.columns.some((x) => { |
|---|
| | | return x.fixed == 'right'; |
|---|
| | | }); |
|---|
| | | //2021.09.21移é¤å¼ºå¶åºå®è¡å·ä¸checkboxå |
|---|
| | | if ( |
|---|
| | | this.columns.some((x) => { |
|---|
| | | return x.fixed && x.fixed != 'right'; |
|---|
| | | }) |
|---|
| | | ) { |
|---|
| | | this.fixed = true; |
|---|
| | | } |
|---|
| | | //2022.04.06ä¼åtableå计åºå®åæ¾ç¤º |
|---|
| | | // if ( |
|---|
| | | // this.columns.some((x) => { |
|---|
| | | // return x.summary; |
|---|
| | | // }) |
|---|
| | | // ) { |
|---|
| | | // this.columns.forEach((x) => { |
|---|
| | | // if (x.fixed && x.fixed != 'right') { |
|---|
| | | // x.fixed = false; |
|---|
| | | // } |
|---|
| | | // }); |
|---|
| | | // this.fixed = false; |
|---|
| | | // } |
|---|
| | | |
|---|
| | | // ä»åå°å ä¸ææ¡ç[æ¯å¦å¯ç¨ç]æ°æ®æº |
|---|
| | | let keys = []; |
|---|
| | | let columnBind = []; |
|---|
| | | this.summaryData.push('å计'); |
|---|
| | | if (this.columnIndex) { |
|---|
| | | this.summaryData.push(' '); |
|---|
| | | } |
|---|
| | | this.columns.forEach((x, _index) => { |
|---|
| | | if (x.cellStyle) { |
|---|
| | | this.cellStyleColumns[x.field] = x.cellStyle; |
|---|
| | | } |
|---|
| | | if (!x.hidden) { |
|---|
| | | // this.summaryIndex[x.field] = _index; |
|---|
| | | // 2020.10.11ä¿®å¤æ±ååéä½çé®é¢ |
|---|
| | | this.summaryData.push(''); |
|---|
| | | this.summaryIndex[x.field] = this.summaryData.length - 1; |
|---|
| | | } |
|---|
| | | // æ±å |
|---|
| | | if (x.summary && !this.summary) { |
|---|
| | | this.summary = true; |
|---|
| | | } |
|---|
| | | if (x.bind && x.bind.key && (!x.bind.data || x.bind.data.length == 0)) { |
|---|
| | | // åå
¥è¿ç¨ |
|---|
| | | if (!x.bind.data) x.bind.data = []; |
|---|
| | | if (x.bind.remote) { |
|---|
| | | this.remoteColumns.push(x); |
|---|
| | | } else if (this.loadKey) { |
|---|
| | | keys.push(x.bind.key); |
|---|
| | | x.bind.valueTyoe = x.type; |
|---|
| | | columnBind.push(x.bind); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | if (keys.length > 0) { |
|---|
| | | this.http |
|---|
| | | .post('/api/Sys_Dictionary/GetVueDictionary', keys) |
|---|
| | | .then((dic) => { |
|---|
| | | dic.forEach((x) => { |
|---|
| | | if (x.data.length > this.select2Count) { |
|---|
| | | x.data.forEach((item) => { |
|---|
| | | item.label = item.value; |
|---|
| | | item.value = item.key; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | columnBind.forEach((c) => { |
|---|
| | | // 转æ¢æ°æ®æºçç±»åä¸åçç±»åä¸è´(2020.04.04) |
|---|
| | | if ( |
|---|
| | | c.key == x.dicNo && |
|---|
| | | (c.valueTyoe == 'int' || c.valueTyoe == 'sbyte') |
|---|
| | | ) { |
|---|
| | | x.data.forEach((d) => { |
|---|
| | | // 2020.09.01å¢å 对æ°åç±»åçäºæ¬¡å¤æ |
|---|
| | | if (!isNaN(d.key)) { |
|---|
| | | d.key = ~~d.key; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | if (c.key == x.dicNo) c.data.push(...x.data); |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | |
|---|
| | | this.paginations.sort = this.pagination.sortName; |
|---|
| | | // 2020.08.29å¢å èªå®ä¹å页æ¡å¤§å° |
|---|
| | | Object.assign(this.paginations, this.pagination); |
|---|
| | | if (this.pagination.size) { |
|---|
| | | this.paginations.rows = this.pagination.size; |
|---|
| | | } |
|---|
| | | this.enableEdit = this.columns.some((x) => { |
|---|
| | | return x.hasOwnProperty('edit'); |
|---|
| | | }); |
|---|
| | | let keyColumn = this.columns.find((x) => { |
|---|
| | | return x.isKey; |
|---|
| | | }); |
|---|
| | | if (keyColumn) { |
|---|
| | | this.key = keyColumn.field; |
|---|
| | | } |
|---|
| | | this.defaultLoadPage && this.load(); |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | filterColumns() { |
|---|
| | | return this.columns.filter((x, index) => { |
|---|
| | | if (!x.field) { |
|---|
| | | x.field = x.title + index; |
|---|
| | | } |
|---|
| | | return !x.hidden; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | watchRowSelectChange(newLen, oldLen) { |
|---|
| | | if (newLen < oldLen && this.selectRows.length) { |
|---|
| | | this.selectRows = []; |
|---|
| | | this.$refs.table.clearSelection(); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | switchChange(val, row, column) { |
|---|
| | | //è¿éå¨åå§åçæ¶åä¹ä¼è§¦åchangeäºä»¶ |
|---|
| | | if (Object.keys(row).length <= 1) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | if (column.onChange) { |
|---|
| | | column.onChange(val, row, column); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | inputKeyPress(row, column, $event, $e) { |
|---|
| | | column.onKeyPress && column.onKeyPress(row, column, $event); |
|---|
| | | this.getInputSummaries(null, null, $event, column); |
|---|
| | | }, |
|---|
| | | extraClick(row, column) { |
|---|
| | | column.extra.click && |
|---|
| | | column.extra.click( |
|---|
| | | row, |
|---|
| | | column, |
|---|
| | | this.url ? this.rowData : this.tableData |
|---|
| | | ); |
|---|
| | | }, |
|---|
| | | headerClick(column, event) { |
|---|
| | | if (this.clickEdit && this.edit.rowIndex != -1) { |
|---|
| | | if ( |
|---|
| | | this.rowEndEdit( |
|---|
| | | this.url |
|---|
| | | ? this.rowData[this.edit.rowIndex] |
|---|
| | | : this.tableData[this.edit.rowIndex], |
|---|
| | | column |
|---|
| | | ) |
|---|
| | | ) { |
|---|
| | | this.edit.rowIndex = -1; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | // this.edit.rowIndex = -1; |
|---|
| | | }, |
|---|
| | | rowDbClick(row, column, event) { |
|---|
| | | //2021.05.23å¢å åå»è¡äºä»¶ |
|---|
| | | this.$emit('rowDbClick', { row, column, event }); |
|---|
| | | }, |
|---|
| | | rowClick(row, column, event) { |
|---|
| | | //2022.02.20å¢å ç¹å»æ¶è¡¨æ ¼åæ°å¤æ |
|---|
| | | if (!column) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | //æ£å¨ç¼è¾æ¶ï¼ç¦æ¢åºårowClickäºä»¶ |
|---|
| | | if (this.edit.rowIndex == -1) { |
|---|
| | | this.$emit('rowClick', { row, column, event }); |
|---|
| | | } |
|---|
| | | // ç¹å»è¡äºä»¶(2020.11.07) |
|---|
| | | |
|---|
| | | if (!this.doubleEdit) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | // ç¹å»å
¶ä»è¡æ¶ï¼å¦æç¹å»çè¡ä¸æ£å¨ç¼è¾çè¡ç¸åï¼ä¿æç¼è¾ç¶æ |
|---|
| | | if (this.clickEdit && this.edit.rowIndex != -1) { |
|---|
| | | if (row.elementIndex == this.edit.rowIndex) { |
|---|
| | | // ç¹å»çåå
æ ¼å¦æä¸å¯ä»¥ç¼è¾ï¼ç´æ¥ç»æç¼è¾ |
|---|
| | | // 2020.10.12ä¿®å¤ç»æç¼è¾æ¶ï¼element tableé«çæ¬å±æ§è·åä¸å°çé®é¢ |
|---|
| | | let _col = this.columns.find((x) => { |
|---|
| | | return x.field == ((event && event.property) || column.property); |
|---|
| | | }); |
|---|
| | | if (_col && (!_col.edit || _col.readonly)) { |
|---|
| | | if (this.rowEndEdit(row, event)) { |
|---|
| | | this.edit.rowIndex = -1; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | if (this.rowEndEdit(row, event && event.property ? event : column)) { |
|---|
| | | this.edit.rowIndex = -1; |
|---|
| | | } |
|---|
| | | //å½æ£å¨ç¼è¾ï¼ä¸ç¹å»å°å
¶ä»è¡æ¶ï¼å¨åç¼è¾çè¡ç»æç¼è¾åï¼è§¦åæ°è¡çrowClickäºä»¶ |
|---|
| | | //æ£å¨ç¼è¾æ¶ï¼ç¦æ¢åºårowClickäºä»¶ |
|---|
| | | if (this.edit.rowIndex == -1) { |
|---|
| | | this.$emit('rowClick', { row, column, event }); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | this.rowBeginEdit(row, column); |
|---|
| | | }, |
|---|
| | | dowloadFile(file) { |
|---|
| | | this.base.dowloadFile( |
|---|
| | | file.path, |
|---|
| | | file.name, |
|---|
| | | { |
|---|
| | | Authorization: this.$store.getters.getToken() |
|---|
| | | }, |
|---|
| | | this.http.ipAddress |
|---|
| | | ); |
|---|
| | | }, |
|---|
| | | getFilePath(pathSring, column) { |
|---|
| | | // è·å表çå¾çä¸æ件æ¾ç¤º |
|---|
| | | if (!pathSring) return []; |
|---|
| | | // å¢å å¾çèªå®ä¹æä½ |
|---|
| | | // è¿åæ ¼å¼å¿
é¡»æ¯[{name:"æ件å",path:"å¾çå
¨è·¯å¾æbase64æ ¼å¼"}] |
|---|
| | | if (column.formatter) { |
|---|
| | | return column.formatter(pathSring); |
|---|
| | | } |
|---|
| | | let filePath; |
|---|
| | | if (column.base64 && pathSring.indexOf('data') != -1) { |
|---|
| | | filePath = (',' + pathSring) |
|---|
| | | .split(',data') |
|---|
| | | .filter((x) => { |
|---|
| | | return x; |
|---|
| | | }) |
|---|
| | | .map((m) => { |
|---|
| | | return 'data' + m; |
|---|
| | | }); |
|---|
| | | } else { |
|---|
| | | filePath = pathSring.replace(/\\/g, '/').split(','); |
|---|
| | | } |
|---|
| | | |
|---|
| | | let fileInfo = []; |
|---|
| | | for (let index = 0; index < filePath.length; index++) { |
|---|
| | | let file = filePath[index]; |
|---|
| | | // 2020.12.19å¢å base64å¾çæ¾ç¤º |
|---|
| | | if (column.base64) { |
|---|
| | | fileInfo.push({ |
|---|
| | | name: '', |
|---|
| | | path: |
|---|
| | | (file.indexOf('data') == -1 ? 'data:image/png;base64,' : '') + |
|---|
| | | file |
|---|
| | | }); |
|---|
| | | } else if (file.indexOf('.') != -1) { |
|---|
| | | let splitFile = file.split('/'); |
|---|
| | | if (splitFile.length > 0) { |
|---|
| | | fileInfo.push({ |
|---|
| | | name: splitFile[splitFile.length - 1], |
|---|
| | | path: this.base.isUrl(file) ? file : this.http.ipAddress + file |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | return fileInfo; |
|---|
| | | }, |
|---|
| | | // éç½®table |
|---|
| | | reset() { |
|---|
| | | if (this.tableData && this.tableData.length > 0) { |
|---|
| | | this.tableData.splice(0); |
|---|
| | | } |
|---|
| | | if (this.rowData && this.rowData.length > 0) { |
|---|
| | | this.rowData.splice(0); |
|---|
| | | } |
|---|
| | | if (!this.paginationHide) { |
|---|
| | | this.paginations.page = 1; |
|---|
| | | // this.paginations.rows = 30; |
|---|
| | | if (this.paginations.wheres && this.paginations.wheres.length > 0) { |
|---|
| | | this.paginations.wheres.splice(0); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | this.errorFiled = ''; |
|---|
| | | this.edit.columnIndex = -1; |
|---|
| | | this.edit.rowIndex = -1; |
|---|
| | | }, |
|---|
| | | getHeight() { |
|---|
| | | // 没æå®ä¹é«åº¦ä¸æ大é«åº¦ï¼ä½¿ç¨tableé»è®¤å¼ |
|---|
| | | if (!this.height && !this.maxHeight) { |
|---|
| | | return null; |
|---|
| | | } |
|---|
| | | // å®ä¹äºæ大é«åº¦åä¸ä½¿ç¨é«åº¦ |
|---|
| | | if (this.maxHeight) { |
|---|
| | | return null; |
|---|
| | | } |
|---|
| | | // 使ç¨å½åå®ä¹çé«åº¦ |
|---|
| | | return this.height; |
|---|
| | | }, |
|---|
| | | getMaxHeight() { |
|---|
| | | // 没æå®ä¹é«åº¦ä¸æ大é«åº¦ï¼ä½¿ç¨tableé»è®¤å¼ |
|---|
| | | if (!this.height && !this.maxHeight) { |
|---|
| | | return null; |
|---|
| | | } |
|---|
| | | // å®ä¹äºæ大é«åº¦ä½¿ç¨æ大é«åº¦ |
|---|
| | | if (this.maxHeight) { |
|---|
| | | return this.maxHeight; |
|---|
| | | } |
|---|
| | | // ä¸ä½¿ç¨æ大é«åº¦ |
|---|
| | | return null; |
|---|
| | | }, |
|---|
| | | getSelectedOptions(column) { |
|---|
| | | if (column.bind && column.bind.data && column.bind.data.length > 0) { |
|---|
| | | return column.bind.data; |
|---|
| | | } |
|---|
| | | return []; |
|---|
| | | }, |
|---|
| | | formatterClick(row, column, event) { |
|---|
| | | if (column.click) { |
|---|
| | | column.click(row, column, event); |
|---|
| | | event.stopPropagation && event.stopPropagation(); |
|---|
| | | } else { |
|---|
| | | this.rowClick(row, column, event); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | initIndex({ row, rowIndex }) { |
|---|
| | | if (this.index) { |
|---|
| | | row.elementIndex = rowIndex; |
|---|
| | | } |
|---|
| | | // if (rowIndex%2!==0) { |
|---|
| | | // return "even-row"; |
|---|
| | | // } |
|---|
| | | return; |
|---|
| | | }, |
|---|
| | | toggleEdit(event) {}, |
|---|
| | | setEditStatus(status) { |
|---|
| | | // this.columns.forEach((x) => { |
|---|
| | | // if (x.hasOwnProperty("edit")) { |
|---|
| | | // this.$set(x.edit, "status", status); |
|---|
| | | // } |
|---|
| | | // }); |
|---|
| | | }, |
|---|
| | | // éè¿buttonæé®å¯ç¨ç¼è¾ |
|---|
| | | beginWithButtonEdit(scope) { |
|---|
| | | // url?rowData:tableData |
|---|
| | | this.rowBeginEdit(scope.row, this.columns[scope.$index]); |
|---|
| | | }, |
|---|
| | | rowBeginEdit(row, column) { |
|---|
| | | if (this.edit.rowIndex != -1) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | let _row = this.columns.find((x) => x.field == column.property); |
|---|
| | | if (_row) { |
|---|
| | | if (_row.readonly) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | if ( |
|---|
| | | //ä¸è½ç¼è¾çå段ãswitchï¼ç¹å»ä¸å¼å¯å¯ç¼è¾åè½ |
|---|
| | | !_row.edit || |
|---|
| | | (_row.edit.keep && _row.edit.type == 'switch') |
|---|
| | | ) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | if (!this.enableEdit) return; |
|---|
| | | _errMsg = ''; |
|---|
| | | // ç¼è¾å |
|---|
| | | this.columns |
|---|
| | | .filter((x) => { |
|---|
| | | return x.bind && x.bind.data && x.bind.data.length; |
|---|
| | | }) |
|---|
| | | .forEach((column) => { |
|---|
| | | let val = row[column.field]; |
|---|
| | | if (typeof column.bind.data[0].key == 'string') { |
|---|
| | | if (typeof val == 'number') { |
|---|
| | | row[column.field] = row[column.field] + ''; |
|---|
| | | } |
|---|
| | | } else { |
|---|
| | | if (typeof val == 'string' && val) { |
|---|
| | | let _val = val * 1; |
|---|
| | | if (_val + '' === val) { |
|---|
| | | row[column.field] = _val; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | if (!this.beginEdit(row, column, row.elementIndex)) return; |
|---|
| | | if (row.hasOwnProperty('elementIndex')) { |
|---|
| | | if (this.edit.rowIndex == row.elementIndex) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | this.edit.rowIndex = row.elementIndex; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | rowEndEdit(row, column, event) { |
|---|
| | | if (this.clickEdit && event) { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | if (!this.enableEdit) { |
|---|
| | | if (!this.errorFiled) { |
|---|
| | | if ( |
|---|
| | | this.edit.rowIndex != -1 && |
|---|
| | | !this.endEditAfter(row, column, this.edit.rowIndex) |
|---|
| | | ) { |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | this.edit.rowIndex = -1; |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | if (!this.doubleEdit && event) { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | let _row = this.url |
|---|
| | | ? this.rowData[this.edit.rowIndex] |
|---|
| | | : this.tableData[this.edit.rowIndex]; |
|---|
| | | // ç»æç¼è¾å |
|---|
| | | if (!this.endEditBefore(_row, column, this.edit.rowIndex)) return false; |
|---|
| | | if (this.edit.rowIndex != -1) { |
|---|
| | | //2022.06.26ä¿®å¤è¡¨æ ¼å
容åæ¢åè¡æ°ä¸ä¸è´æ¶ä¸è½ç¼è¾çé®é¢ |
|---|
| | | if (this.edit.rowIndex - 1 > (this.rowData || this.tableData).length) { |
|---|
| | | this.edit.rowIndex = -1; |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | let row = (this.url ? this.rowData : this.tableData)[ |
|---|
| | | this.edit.rowIndex |
|---|
| | | ]; |
|---|
| | | for (let index = 0; index < this.columns.length; index++) { |
|---|
| | | const _column = this.columns[index]; |
|---|
| | | if (_column.edit) { |
|---|
| | | if (!this.validateRow(row, _column)) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | if (!this.endEditAfter(_row, column, this.edit.rowIndex)) return false; |
|---|
| | | this.edit.rowIndex = -1; |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | validateRow(row, option1) { |
|---|
| | | if (!this.validateColum(option1, row)) { |
|---|
| | | this.errorFiled = option1.field; |
|---|
| | | // 2022.05.06 ä¿®æ¹é误信æ¯éå¤çé®é¢ |
|---|
| | | this.$message.error(option1.title + _errMsg); |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | this.errorFiled = ''; |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | validateColum(option, data) { |
|---|
| | | if (option.hidden || option.bind) return true; |
|---|
| | | let val = data[option.field]; |
|---|
| | | if (option.require || option.required) { |
|---|
| | | if (val != '0' && (val === '' || val === undefined)) { |
|---|
| | | if (!this.errorFiled) { |
|---|
| | | _errMsg = 'ä¸è½ä¸ºç©º'; |
|---|
| | | } |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | if (!option.edit) { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | let editType = option.edit.type; |
|---|
| | | // éªè¯æ°å |
|---|
| | | if (editType == 'int' || editType == 'decimal' || editType == 'number') { |
|---|
| | | if (val == '' || val == undefined) return true; |
|---|
| | | if (editType == 'decimal') { |
|---|
| | | if (!this.rule.decimal.test(val)) { |
|---|
| | | _errMsg = 'åªè½æ¯æ°å'; |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | } else if (!this.rule.decimal.test(val)) { |
|---|
| | | _errMsg = 'åªè½æ¯æ°å'; |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | if ( |
|---|
| | | option.edit.min != undefined && |
|---|
| | | typeof option.edit.min === 'number' && |
|---|
| | | val < option.edit.min |
|---|
| | | ) { |
|---|
| | | _errMsg = 'ä¸è½å°äº' + option.edit.min; |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | if ( |
|---|
| | | option.edit.max != undefined && |
|---|
| | | typeof option.edit.max === 'number' && |
|---|
| | | val > option.edit.max |
|---|
| | | ) { |
|---|
| | | _errMsg = 'ä¸è½å¤§äº' + option.edit.max; |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | |
|---|
| | | // éªè¯å符串 |
|---|
| | | if (val && (editType == 'text' || editType == 'string')) { |
|---|
| | | if ( |
|---|
| | | option.edit.min != undefined && |
|---|
| | | typeof option.edit.min === 'number' && |
|---|
| | | val.length < option.edit.min |
|---|
| | | ) { |
|---|
| | | _errMsg = 'è³å°' + option.edit.min + '个å符'; |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | if ( |
|---|
| | | option.edit.max != undefined && |
|---|
| | | typeof option.edit.max === 'number' && |
|---|
| | | val.length > option.edit.max |
|---|
| | | ) { |
|---|
| | | _errMsg = 'æå¤' + option.edit.max + '个å符'; |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | delRow() { |
|---|
| | | let rows = this.getSelected(); |
|---|
| | | if (rows.length == 0) return this.$Message.error('请éæ©è¦å é¤çè¡!'); |
|---|
| | | |
|---|
| | | let data = this.url ? this.rowData : this.tableData; |
|---|
| | | let indexArr = this.getSelectedIndex(); |
|---|
| | | if (indexArr.length == 0) { |
|---|
| | | return this.$Message.error( |
|---|
| | | "å é¤æä½å¿
须设置VolTableçå±æ§index='true'" |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | // if (indexArr.length == 0 || !this.key) { |
|---|
| | | // return this.$message.error( |
|---|
| | | // "请设置index=trueå±æ§ææcolumnsçå段为key" |
|---|
| | | // ); |
|---|
| | | // } |
|---|
| | | if (indexArr.length == 0) { |
|---|
| | | // let keyValues=[] |
|---|
| | | // rows.forEach(x=>{ |
|---|
| | | // if (x[this.key]) { |
|---|
| | | // } |
|---|
| | | // keyValues.push(x[this.key]) |
|---|
| | | // }) |
|---|
| | | // data.find(x=>) |
|---|
| | | } else { |
|---|
| | | for (let i = data.length - 1; i >= 0; i--) { |
|---|
| | | if (indexArr.indexOf(i) != -1) { |
|---|
| | | data.splice(i, 1); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | this.edit.rowIndex = -1; |
|---|
| | | return rows; |
|---|
| | | }, |
|---|
| | | addRow(row) { |
|---|
| | | if (!row) { |
|---|
| | | row = {}; |
|---|
| | | } |
|---|
| | | this.columns.forEach((x) => { |
|---|
| | | // 2022.05.06 æ·»å è¡æ¶ï¼å¦æåæç¼è¾å±æ§ï¼è®¾ç½®å¼å¯ç¼è¾(é¿å
å
³éç¼è¾åï¼æ æ³å次å¯ç¨ç¼è¾)?? |
|---|
| | | //x.readonly = false; |
|---|
| | | if (!row.hasOwnProperty(x.field)) { |
|---|
| | | if (x.edit && x.edit.type == 'switch') { |
|---|
| | | row[x.field] = x.type == 'bool' ? false : 0; |
|---|
| | | } else if (!row.hidden) { |
|---|
| | | // 2020.09.06æ·»å è¡æ¶ï¼è®¾ç½®é»è®¤å段 |
|---|
| | | row[x.field] = undefined; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | if (!this.url) { |
|---|
| | | this.tableData.push(row); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | this.rowData.push(row); |
|---|
| | | }, |
|---|
| | | viewImg(row, column, url, $event) { |
|---|
| | | $event.stopPropagation(); |
|---|
| | | this.base.previewImg(url); |
|---|
| | | // window.open(row[column.field]); |
|---|
| | | }, |
|---|
| | | link(row, column, $e) { |
|---|
| | | $e.stopPropagation(); |
|---|
| | | this.$props.linkView(row, column); |
|---|
| | | }, |
|---|
| | | getSelected() { |
|---|
| | | return this.selectRows; |
|---|
| | | }, |
|---|
| | | getSelectedIndex() { |
|---|
| | | if (!this.index) { |
|---|
| | | // åªæ设置äºå±æ§indexææç´¢å¼è¡ |
|---|
| | | return []; |
|---|
| | | } |
|---|
| | | let indexArr = this.selectRows.map((x) => { |
|---|
| | | return x.elementIndex; |
|---|
| | | }); |
|---|
| | | return indexArr || []; |
|---|
| | | }, |
|---|
| | | GetTableDictionary(rows) { |
|---|
| | | // å页æå·æ°æéæ°ç»å®æ°æ®æº |
|---|
| | | if (this.remoteColumns.length == 0 || !rows || rows.length == 0) return; |
|---|
| | | let remoteInfo = {}; |
|---|
| | | for (let index = 0; index < this.remoteColumns.length; index++) { |
|---|
| | | const column = this.remoteColumns[index]; |
|---|
| | | // column.bind.data.splice(0); |
|---|
| | | let key = column.bind.key; |
|---|
| | | let data = []; |
|---|
| | | rows.forEach((row) => { |
|---|
| | | if (row[column.field] || row[column.field] == '0') { |
|---|
| | | if (data.indexOf(row[column.field]) == -1) { |
|---|
| | | data.push(row[column.field]); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | if (data.length > 0) { |
|---|
| | | remoteInfo[key] = data; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | if (remoteInfo.length == 0) return; |
|---|
| | | // ha= Object.assign([], ha, hb) |
|---|
| | | this.http |
|---|
| | | .post('/api/Sys_Dictionary/GetTableDictionary', remoteInfo) |
|---|
| | | .then((dic) => { |
|---|
| | | dic.forEach((x) => { |
|---|
| | | this.remoteColumns.forEach((column) => { |
|---|
| | | if (column.bind.key == x.key) { |
|---|
| | | column.bind.data = Object.assign([], column.bind.data, x.data); |
|---|
| | | // column.bind.data.push(...x.data); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | this.$emit('dicInited', dic); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | load(query, isResetPage) { |
|---|
| | | // isResetPageéç½®å页æ°æ® |
|---|
| | | if (!this.url) return; |
|---|
| | | if (isResetPage) { |
|---|
| | | this.resetPage(); |
|---|
| | | } |
|---|
| | | let param = { |
|---|
| | | page: this.paginations.page, |
|---|
| | | rows: this.paginations.rows, |
|---|
| | | sort: this.paginations.sort, |
|---|
| | | order: this.paginations.order, |
|---|
| | | wheres: [] // æ¥è¯¢æ¡ä»¶ï¼æ ¼å¼ä¸º[{ name: "å段", value: "xx" }] |
|---|
| | | }; |
|---|
| | | let status = true; |
|---|
| | | // å并æ¥è¯¢ä¿¡æ¯(å
æ¥è¯¢å页ãæåºãæ¥è¯¢æ¡ä»¶ç) |
|---|
| | | if (query) { |
|---|
| | | param = Object.assign(param, query); |
|---|
| | | } |
|---|
| | | /* æ¥è¯¢åå¤ç(å¦æéè¦æ¥è¯¢æ¡ä»¶ï¼å®ç°ç»ä»¶æ¹æ³loadBeforeæ¹æ³å³å¯: |
|---|
| | | loadBefore=(param, callBack)=>{ |
|---|
| | | param.wheres = [{ name: "PhoneNo", value: "13419098211" }]; |
|---|
| | | callBack(true); |
|---|
| | | }) |
|---|
| | | */ |
|---|
| | | this.$emit('loadBefore', param, (result) => { |
|---|
| | | status = result; |
|---|
| | | }); |
|---|
| | | if (!status) return; |
|---|
| | | |
|---|
| | | if (param.wheres && param.wheres instanceof Array) { |
|---|
| | | param.wheres = JSON.stringify(param.wheres); |
|---|
| | | } |
|---|
| | | this.loading = true; |
|---|
| | | this.http.post(this.url, param).then( |
|---|
| | | (data) => { |
|---|
| | | //2021.06.04ä¿®å¤treeä¸å·æ°çé®é¢ |
|---|
| | | if (this.rowKey) { |
|---|
| | | this.randomTableKey++; |
|---|
| | | this.rowData.splice(0); |
|---|
| | | } |
|---|
| | | this.loading = false; |
|---|
| | | // æ¥è¯¢è¿åç»æåå¤ç |
|---|
| | | // 2020.10.30å¢å æ¥è¯¢åè¿åææçæ¥è¯¢ä¿¡æ¯ |
|---|
| | | this.$emit( |
|---|
| | | 'loadAfter', |
|---|
| | | data.rows || [], |
|---|
| | | (result) => { |
|---|
| | | status = result; |
|---|
| | | }, |
|---|
| | | data |
|---|
| | | ); |
|---|
| | | if (!status) return; |
|---|
| | | this.GetTableDictionary(data.rows); |
|---|
| | | this.rowData = data.rows || []; |
|---|
| | | this.paginations.total = data.total; |
|---|
| | | // å计 |
|---|
| | | this.getSummaries(data); |
|---|
| | | // this.$nextTick(() => { |
|---|
| | | // this.$refs.table.doLayout(); |
|---|
| | | // }); |
|---|
| | | }, |
|---|
| | | (error) => { |
|---|
| | | this.loading = false; |
|---|
| | | // this.$Message.error(error || "ç½ç»å¼å¸¸"); |
|---|
| | | } |
|---|
| | | ); |
|---|
| | | }, // è·åç»è®¡ |
|---|
| | | getSummaries(data) { |
|---|
| | | if (!this.summary || !data.summary) return; |
|---|
| | | this.summaryData.splice(0); |
|---|
| | | // å¼å¯äºè¡å·çï¼+1 |
|---|
| | | if (this.columnIndex) { |
|---|
| | | this.summaryData.push(''); |
|---|
| | | } |
|---|
| | | // å¦ææcheckboxï¼åºè¯¥ç®ä½æ¯ç¬¬ä¸è¡ |
|---|
| | | if (this.ck) { |
|---|
| | | this.summaryData.push(''); |
|---|
| | | } |
|---|
| | | |
|---|
| | | this.columns.forEach((col) => { |
|---|
| | | if (col.children && col.children.length) { |
|---|
| | | col.children.forEach((item) => { |
|---|
| | | this.getColumnSummaries(item, data); |
|---|
| | | }); |
|---|
| | | } else { |
|---|
| | | this.getColumnSummaries(col, data); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | if (this.summaryData.length > 0 && this.summaryData[0] == '') { |
|---|
| | | this.summaryData[0] = 'å计'; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | getColumnSummaries(col, data) { |
|---|
| | | if (!col.hidden) { |
|---|
| | | if (data.summary.hasOwnProperty(col.field)) { |
|---|
| | | let sum = data.summary[col.field]; |
|---|
| | | if (sum) { |
|---|
| | | sum = |
|---|
| | | (sum * 1.0).toFixed(col.numberLength || 2).replace('.00', '') * |
|---|
| | | 1.0; |
|---|
| | | } |
|---|
| | | this.summaryData.push(sum); |
|---|
| | | } else { |
|---|
| | | this.summaryData.push(''); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | getInputChangeSummaries() {}, |
|---|
| | | handleSizeChange(val) { |
|---|
| | | this.paginations.size = val; |
|---|
| | | this.paginations.rows = val; |
|---|
| | | this.load(); |
|---|
| | | }, |
|---|
| | | handleCurrentChange(val) { |
|---|
| | | this.paginations.page = val; |
|---|
| | | this.load(); |
|---|
| | | }, |
|---|
| | | sortChange(sort) { |
|---|
| | | this.paginations.sort = sort.prop; |
|---|
| | | this.paginations.order = sort.order == 'ascending' ? 'asc' : 'desc'; |
|---|
| | | this.load(); |
|---|
| | | }, |
|---|
| | | resetPage() { |
|---|
| | | // éç½®æ¥è¯¢å页 |
|---|
| | | // this.paginations.rows = 30; |
|---|
| | | this.paginations.page = 1; |
|---|
| | | }, |
|---|
| | | selectionChange(selection) { |
|---|
| | | // console.log(selection); |
|---|
| | | // éæ©è¡äºä»¶,åªæåéæ触å |
|---|
| | | this.selectRows = selection; |
|---|
| | | if (this.single) { |
|---|
| | | if (selection.length == 1) { |
|---|
| | | this.$emit('rowChange', selection[0]); |
|---|
| | | } |
|---|
| | | if (selection.length > 1) { |
|---|
| | | let _row = selection[selection.length - 1]; |
|---|
| | | this.$refs.table.toggleRowSelection(selection[0]); |
|---|
| | | this.selectRows = [_row]; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | // å°selectionchangeæ´é²åºå» |
|---|
| | | this.$emit('selectionChange', selection); |
|---|
| | | }, |
|---|
| | | getColor(row, column) { |
|---|
| | | let val = row[column.field]; |
|---|
| | | if (column.getColor && typeof column.getColor === 'function') { |
|---|
| | | let _color = column.getColor(row, column); |
|---|
| | | if (_color) { |
|---|
| | | return _color; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | if (!val && val != '0') { |
|---|
| | | return ''; |
|---|
| | | } |
|---|
| | | if (!this.formatConfig[column.field]) { |
|---|
| | | this.formatConfig[column.field] = [val]; |
|---|
| | | return this.colors[0]; |
|---|
| | | } |
|---|
| | | let index = this.formatConfig[column.field].indexOf(val); |
|---|
| | | if (index != -1) { |
|---|
| | | return this.colors[index]; |
|---|
| | | } |
|---|
| | | if (this.formatConfig[column.field].length > 5) { |
|---|
| | | return ''; |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (index == -1) { |
|---|
| | | this.formatConfig[column.field].push(val); |
|---|
| | | index = this.formatConfig[column.field].length - 1; |
|---|
| | | } |
|---|
| | | return this.colors[index]; |
|---|
| | | }, |
|---|
| | | formatterDate(row, column) { |
|---|
| | | return (row[column.field] || '').substr(0, 10); |
|---|
| | | }, |
|---|
| | | formatter(row, column, template) { |
|---|
| | | if (!template) return row[column.property]; |
|---|
| | | let val = row[column.field]; |
|---|
| | | if (!val && val != 0) return val; |
|---|
| | | // æ¯å¦å¼ |
|---|
| | | if (column.edit && column.edit.type == 'switch') { |
|---|
| | | return val ? 'æ¯' : 'å¦'; |
|---|
| | | } |
|---|
| | | if (!column.bind || !column.bind.data) { |
|---|
| | | return row[column.field]; |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (column.edit && (column.edit.type == 'selectList'||column.edit.type=='treeSelect')) { |
|---|
| | | if (!Array.isArray(val)) { |
|---|
| | | row[column.field] = val.split(','); |
|---|
| | | } else { |
|---|
| | | val = val.join(','); |
|---|
| | | } |
|---|
| | | return this.getSelectFormatter(column, val); |
|---|
| | | } |
|---|
| | | // ç¼è¾å¤étableæ¾ç¤º |
|---|
| | | if (column.bind.type == 'selectList' || column.bind.type == 'checkbox'||column.bind.type=='treeSelect') { |
|---|
| | | // if (typeof val === 'string' && val.indexOf(',') != -1) { |
|---|
| | | return this.getSelectFormatter(column, val+''); |
|---|
| | | // } |
|---|
| | | } |
|---|
| | | let source = column.bind.data.filter((x) => { |
|---|
| | | // return x.key != "" && x.key == val; |
|---|
| | | // 2020.06.06ä¿®å¤åç¬ä½¿ç¨tableç»ä»¶æ¶,key为æ°å0æ¶è½¬æ¢æææ¬å¤±è´¥çé®é¢ |
|---|
| | | return x.key !== '' && x.key !== undefined && x.key + '' === val + ''; |
|---|
| | | }); |
|---|
| | | if (source && source.length > 0) val = source[0].label || source[0].value; |
|---|
| | | return val; |
|---|
| | | }, |
|---|
| | | getSelectFormatter(column, val) { |
|---|
| | | // ç¼è¾å¤étableæ¾ç¤º |
|---|
| | | let valArr = val.split(","); |
|---|
| | | for (let index = 0; index < valArr.length; index++) { |
|---|
| | | ( column.bind.orginData&&column.bind.orginData.length |
|---|
| | | ?column.bind.orginData |
|---|
| | | :column.bind.data) |
|---|
| | | .forEach((x) => { |
|---|
| | | // 2020.06.06ä¿®å¤æ°æ®æºä¸ºselectListæ¶,key为æ°å0æ¶ä¸è½è½¬æ¢ææ¬çé®é¢ |
|---|
| | | if (x.key !== "" && x.key !== undefined && x.key + "" == valArr[index] + "") { |
|---|
| | | valArr[index] = x.label || x.value; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | return valArr.join(","); |
|---|
| | | }, |
|---|
| | | onChange(scope, val, event, column) { |
|---|
| | | // 2020.09.03ä¿®å¤onChangeä¸è§¦åçé®é¢ |
|---|
| | | let row = scope.row; |
|---|
| | | if (column.onChange && !column.onChange(row, val, event)) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | // è¾å
¥æ¡æ±åå®æ¶è®¡ç® |
|---|
| | | this.getInputSummaries(scope, val, event, column); |
|---|
| | | }, |
|---|
| | | // inputè¾å
¥å®æ¶æ±å |
|---|
| | | getInputSummaries(scope, val, event, column) { |
|---|
| | | // columnå设置äºsummaryå±æ§çæ计ç®å¼ |
|---|
| | | if (!column.summary) return; |
|---|
| | | let sum = 0; |
|---|
| | | // let _index = 0; |
|---|
| | | (this.url ? this.rowData : this.tableData).forEach((x, index) => { |
|---|
| | | if (x.hasOwnProperty(column.field) && !isNaN(x[column.field])) { |
|---|
| | | // _index = index; |
|---|
| | | sum += x[column.field] * 1; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | if (sum) { |
|---|
| | | if (column.summary == 'avg') { |
|---|
| | | sum = sum / (this.rowData.length || this.tableData.length || 1); |
|---|
| | | } |
|---|
| | | sum = |
|---|
| | | (sum * 1.0).toFixed(column.numberLength || 2).replace('.00', '') * |
|---|
| | | 1.0; |
|---|
| | | } |
|---|
| | | this.summaryData[this.summaryIndex[column.field]] = sum; |
|---|
| | | }, |
|---|
| | | getSummaryData({ columns, data }) { |
|---|
| | | return this.summaryData; |
|---|
| | | }, |
|---|
| | | getCellStyle(row) { |
|---|
| | | // 2020.12.13å¢å 设置åå
æ ¼é¢è² |
|---|
| | | if (row.column.property) { |
|---|
| | | return ( |
|---|
| | | this.cellStyleColumns[row.column.property] && |
|---|
| | | this.cellStyleColumns[row.column.property]( |
|---|
| | | row.row, |
|---|
| | | row.rowIndex, |
|---|
| | | row.columnIndex |
|---|
| | | ) |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | compareDate(date1, date2) { |
|---|
| | | if (!date2) { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | return ( |
|---|
| | | date1.valueOf() < |
|---|
| | | (typeof date2 == 'number' ? date2 : new Date(date2).valueOf()) |
|---|
| | | ); |
|---|
| | | }, |
|---|
| | | getDateOptions(date, item) { |
|---|
| | | //2021.07.17设置æ¶é´å¯éèå´ |
|---|
| | | if ((!item.min && !item.max) || !date) { |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | if (item.min && item.min.indexOf(' ') == -1) { |
|---|
| | | //ä¸è®¾ç½®æ¶åç§ï¼åé¢ä¼èªå¨å ä¸ 08:00 |
|---|
| | | item.min = item.min + ' 00:00:000'; |
|---|
| | | } |
|---|
| | | return ( |
|---|
| | | this.compareDate(date, item.min) || !this.compareDate(date, item.max) |
|---|
| | | ); |
|---|
| | | }, |
|---|
| | | getDateFormat(column) { |
|---|
| | | //è§https://day.js.org/docs/zh-CN/display/format |
|---|
| | | return column.edit.type == 'date' ? 'YYYY-MM-DD' : 'YYYY-MM-DD HH:mm:ss'; |
|---|
| | | }, |
|---|
| | | userSelect(selection, row) { |
|---|
| | | this.selectRows = selection; |
|---|
| | | if (!this.single) { |
|---|
| | | this.$emit('rowChange', { row, selection }); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | isEmptyTag(row, column) { |
|---|
| | | if (!row[column.field] && row[column.field] != '0') { |
|---|
| | | return 'empty-tag'; |
|---|
| | | } |
|---|
| | | return ''; |
|---|
| | | }, |
|---|
| | | filterChildrenColumn(children) { |
|---|
| | | if (!children) { |
|---|
| | | return []; |
|---|
| | | } |
|---|
| | | return children.filter((x) => { |
|---|
| | | return !x.hidden; |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | initColumnDisabled(row, column) { |
|---|
| | | return column.getDisabled && column.getDisabled(row, column); |
|---|
| | | }, |
|---|
| | | showUpload(row,column){ |
|---|
| | | this.fileInfo = (row[column.field] || '').split(",") |
|---|
| | | .filter(x => { return x }) |
|---|
| | | .map(item => { |
|---|
| | | return { path: item, name: "" }; |
|---|
| | | }) |
|---|
| | | this.currentRow=row; |
|---|
| | | this.currentColumn=column; |
|---|
| | | if (this.currentColumn.edit.autoUpload===undefined) { |
|---|
| | | this.currentColumn.edit.autoUpload=true; |
|---|
| | | } |
|---|
| | | if (this.currentColumn.edit.multiple===undefined) { |
|---|
| | | this.currentColumn.edit.multiple=false; |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (this.currentColumn.edit.url===undefined) { |
|---|
| | | this.uploadUrl='api/'+(this.url||'').replace('/api','api').split('/')[1]+'/upload' |
|---|
| | | }else{ |
|---|
| | | this.uploadUrl=this.currentColumn.edit.url; |
|---|
| | | } |
|---|
| | | this.uploadModel=true; |
|---|
| | | }, |
|---|
| | | uploadAfter(result, files) { |
|---|
| | | this.currentColumn.uploadAfter&&this.currentColumn.uploadAfter(result,files); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | saveUpload(){ |
|---|
| | | //çæä¿ååè¿åçè·¯å¾ |
|---|
| | | let arr = this.fileInfo.map((x) => { |
|---|
| | | if (x.path) { |
|---|
| | | return x.path; |
|---|
| | | } |
|---|
| | | return result.data + x.name; |
|---|
| | | }); |
|---|
| | | |
|---|
| | | this.currentRow[this.currentColumn.field] = arr.join(","); |
|---|
| | | this.uploadModel = false; |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .vol-table { |
|---|
| | | position: relative; |
|---|
| | | .mask { |
|---|
| | | opacity: 0.2; |
|---|
| | | position: absolute; |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | background: #d0d0d0; |
|---|
| | | z-index: 100; |
|---|
| | | } |
|---|
| | | .message { |
|---|
| | | text-align: center; |
|---|
| | | color: #635c5c; |
|---|
| | | font-size: 15px; |
|---|
| | | font-weight: 600; |
|---|
| | | background: #eee; |
|---|
| | | transform: translateY(-50%); |
|---|
| | | top: 50%; |
|---|
| | | position: absolute; |
|---|
| | | z-index: 200; |
|---|
| | | left: 0; |
|---|
| | | right: 0; |
|---|
| | | width: 150px; |
|---|
| | | margin: 0 auto; |
|---|
| | | line-height: 40px; |
|---|
| | | border-radius: 4px; |
|---|
| | | border: 1px solid #a09e9e; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .e-item { |
|---|
| | | display: flex; |
|---|
| | | > div:first-child { |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .vol-table ::v-deep(.el-pager .number) { |
|---|
| | | padding: 0 7px; |
|---|
| | | border-radius: 5px; |
|---|
| | | border: 1px solid #e6e6e6; |
|---|
| | | margin-left: 8px; |
|---|
| | | font-weight: 500; |
|---|
| | | min-width: 28px; |
|---|
| | | } |
|---|
| | | .vol-table ::v-deep(.el-pager .number.active) { |
|---|
| | | background: #ed4014; |
|---|
| | | color: #fff; |
|---|
| | | } |
|---|
| | | .vol-table .t-file { |
|---|
| | | color: #1e8cff; |
|---|
| | | cursor: pointer; |
|---|
| | | border-bottom: 1px solid; |
|---|
| | | padding-bottom: 2px; |
|---|
| | | } |
|---|
| | | .vol-table .empty-tag { |
|---|
| | | border: none; |
|---|
| | | background: none; |
|---|
| | | } |
|---|
| | | .v-table ::v-deep(.el-date-editor .el-icon-date), |
|---|
| | | .v-table ::v-deep(.el-date-editor .el-icon-time) { |
|---|
| | | width: 10px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .column-required { |
|---|
| | | position: relative; |
|---|
| | | color: #f20303; |
|---|
| | | font-size: 14px; |
|---|
| | | top: 2px; |
|---|
| | | right: 2px; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | |
|---|
| | | <style scoped> |
|---|
| | | /* .v-table ::v-deep(.even-row){ |
|---|
| | | background: rgb(245,247,250); |
|---|
| | | } */ |
|---|
| | | .pagination { |
|---|
| | | text-align: right; |
|---|
| | | padding: 2px 28px; |
|---|
| | | border: 1px solid #eee; |
|---|
| | | border-top: 0px; |
|---|
| | | } |
|---|
| | | /* .v-table ::v-deep(.el-input .el-input__inner) { |
|---|
| | | padding: 0 7px; |
|---|
| | | } */ |
|---|
| | | .v-table ::v-deep(.el-table__header th) { |
|---|
| | | /* padding: 0px !important; */ |
|---|
| | | background-color: #f8f8f9 !important; |
|---|
| | | font-size: 13px; |
|---|
| | | height: 46px; |
|---|
| | | color: #616161; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .v-table ::v-deep(.el-table__header th.is-sortable) { |
|---|
| | | padding: 3px !important; |
|---|
| | | } |
|---|
| | | .vol-table.text-inline ::v-deep(.el-table__body .cell), |
|---|
| | | .vol-table.text-inline ::v-deep(.el-table__header-wrapper .cell) { |
|---|
| | | word-break: inherit !important; |
|---|
| | | white-space: nowrap !important; |
|---|
| | | } |
|---|
| | | /* .v-table ::v-deep(.el-table__body td) { |
|---|
| | | padding: 9px 0 !important; |
|---|
| | | } */ |
|---|
| | | |
|---|
| | | .v-table ::v-deep(.el-table__footer td) { |
|---|
| | | padding: 7px 0 !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .vol-table ::v-deep(.el-table-column--selection .cell) { |
|---|
| | | display: inline; |
|---|
| | | } |
|---|
| | | .vol-table.text-inline ::v-deep(.el-table th > .cell) { |
|---|
| | | white-space: nowrap !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .vol-table .table-img { |
|---|
| | | height: 40px; |
|---|
| | | border-radius: 5px; |
|---|
| | | margin-right: 10px; |
|---|
| | | width: 40px; |
|---|
| | | object-fit: cover; |
|---|
| | | } |
|---|
| | | .vol-table .table-img:hover { |
|---|
| | | cursor: pointer; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .vol-table ::v-deep(.cell) { |
|---|
| | | padding: 2px 10px; |
|---|
| | | } |
|---|
| | | .vol-table ::v-deep(.cell .el-tag) { |
|---|
| | | padding: 5px 9px; |
|---|
| | | } |
|---|
| | | .table-input { |
|---|
| | | color: rgb(104, 103, 103); |
|---|
| | | padding: 3px 10px; |
|---|
| | | height: 32px; |
|---|
| | | line-height: 32px; |
|---|
| | | width: 100%; |
|---|
| | | border-radius: 4px; |
|---|
| | | border: 1px solid #dcdcdc; |
|---|
| | | } |
|---|
| | | .table-input:focus { |
|---|
| | | outline: 1px solid #49a3fd; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | import { h } from 'vue'; |
|---|
| | | export default { |
|---|
| | | name: "TableExpand", |
|---|
| | | functional: true, |
|---|
| | | props: { |
|---|
| | | render: Function, |
|---|
| | | row: {},//å½åè¡çæ°æ® |
|---|
| | | column: {},//å½åè¡çé
ç½®ä¿¡æ¯ |
|---|
| | | index: { type: Number, default: 0 }//å½åæå¨è¡ |
|---|
| | | }, |
|---|
| | | render: ({ render,row ,column,index }) => { |
|---|
| | | return render(h, {row ,column,index}); //h(); |
|---|
| | | } |
|---|
| | | }; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="upload-container"> |
|---|
| | | <div> |
|---|
| | | <div class="input-btns" style="margin-bottom: 10px"> |
|---|
| | | <input |
|---|
| | | ref="input" |
|---|
| | | type="file" |
|---|
| | | style="display: none" |
|---|
| | | @change="handleChange" |
|---|
| | | :multiple="multiple" |
|---|
| | | /> |
|---|
| | | <div v-if="img" class="upload-img"> |
|---|
| | | <!-- v-for="(file,index) in fileInfo.length>0?fileInfo: files" --> |
|---|
| | | <div v-for="(file, index) in files" :key="index" class="img-item"> |
|---|
| | | <div class="operation"> |
|---|
| | | <div class="action"> |
|---|
| | | <i class="el-icon-view view" @click="previewImg(index)"></i> |
|---|
| | | <i class="el-icon-delete remove" @click="removeFile(index)"></i> |
|---|
| | | </div> |
|---|
| | | <div class="mask"></div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <img :src="getImgSrc(file, index)" :onerror="errorImg" /> |
|---|
| | | </div> |
|---|
| | | <div |
|---|
| | | v-show="!autoUpload || (autoUpload && files.length < maxFile)" |
|---|
| | | class="img-selector" |
|---|
| | | :class="getSelector()" |
|---|
| | | > |
|---|
| | | <div class="selector" @click="handleClick"> |
|---|
| | | <i class="el-icon-camera-solid"></i> |
|---|
| | | </div> |
|---|
| | | <div |
|---|
| | | v-if="!autoUpload" |
|---|
| | | class="s-btn" |
|---|
| | | :class="{ readonly: changed }" |
|---|
| | | @click="upload" |
|---|
| | | > |
|---|
| | | <div>{{ loadText }}</div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <el-button v-else @click="handleClick" |
|---|
| | | >éæ©{{ img ? 'å¾ç' : 'æ件' }}</el-button |
|---|
| | | > |
|---|
| | | |
|---|
| | | <el-button |
|---|
| | | v-if="!autoUpload && !img" |
|---|
| | | type="info" |
|---|
| | | :disabled="changed" |
|---|
| | | @click="upload(true)" |
|---|
| | | :loading="loadingStatus" |
|---|
| | | >ä¸ä¼ æ件</el-button |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | <slot></slot> |
|---|
| | | <div v-if="desc"> |
|---|
| | | <el-alert |
|---|
| | | :title="getText() + 'æ件大å°ä¸è¶
è¿' + (maxSize || 50) + 'M'" |
|---|
| | | type="info" |
|---|
| | | show-icon |
|---|
| | | > |
|---|
| | | </el-alert> |
|---|
| | | </div> |
|---|
| | | <slot name="content"></slot> |
|---|
| | | <div v-if="!img"> |
|---|
| | | <ul class="upload-list" v-show="fileList"> |
|---|
| | | <li class="list-file" v-for="(file, index) in files" :key="index"> |
|---|
| | | <a> |
|---|
| | | <span @click="fileOnClick(index, file)"> |
|---|
| | | <i :class="format(file)"></i> |
|---|
| | | {{ file.name }} |
|---|
| | | </span> |
|---|
| | | </a> |
|---|
| | | <span @click="removeFile(index)" class="file-remove"> |
|---|
| | | <i class="el-icon-close"></i> |
|---|
| | | </span> |
|---|
| | | </li> |
|---|
| | | </ul> |
|---|
| | | </div> |
|---|
| | | <slot name="tip"></slot> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | let OSS = require('ali-oss'); |
|---|
| | | export default { |
|---|
| | | components: {}, |
|---|
| | | props: { |
|---|
| | | desc: { |
|---|
| | | //æ¯å¦æ¾ç¤ºé»è®¤ä»ç» |
|---|
| | | //æ¯å¦å¤é |
|---|
| | | type: Boolean, |
|---|
| | | default: false |
|---|
| | | }, |
|---|
| | | fileInfo: { |
|---|
| | | //ç¨äºæ¥æ¶ä¸ä¼ çæ件ï¼ä¹å¯ä»¥å 以é»è®¤å¼ï¼æ¾ç¤ºå·²ä¸ä¼ çæ件ï¼ç¨æ·ä¸ä¼ åä¼è¦çé»è®¤å¼ |
|---|
| | | type: Array, |
|---|
| | | default: () => { |
|---|
| | | return []; |
|---|
| | | } //æ ¼å¼[{name:'1.jpg',path:'127.0.01/1.jpg'}] |
|---|
| | | }, |
|---|
| | | downLoad: { |
|---|
| | | //æ¯å¦å¯ä»¥ç¹å»æ件ä¸è½½ |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | multiple: { |
|---|
| | | //æ¯å¦å¤é |
|---|
| | | type: Boolean, |
|---|
| | | default: false |
|---|
| | | }, |
|---|
| | | maxFile: { |
|---|
| | | //æå¤å¯éæ件æ°éï¼å¿
é¡»multiple=trueï¼æä¼çæ |
|---|
| | | type: Number, |
|---|
| | | default: 5 |
|---|
| | | }, |
|---|
| | | maxSize: { |
|---|
| | | //æ件éå¶å¤§å°3M |
|---|
| | | type: Number, |
|---|
| | | default: 50 |
|---|
| | | }, |
|---|
| | | |
|---|
| | | autoUpload: { |
|---|
| | | //éæ©æ件åæ¯å¦èªå¨ä¸ä¼ |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | img: { |
|---|
| | | //å¾çç±»å img>excel>fileTypesä¸ç§æ件类åä¼å
级 |
|---|
| | | type: Boolean, |
|---|
| | | default: false |
|---|
| | | }, |
|---|
| | | excel: { |
|---|
| | | //excelæ件 |
|---|
| | | type: Boolean, |
|---|
| | | default: false |
|---|
| | | }, |
|---|
| | | fileTypes: { |
|---|
| | | //æå®ä¸ä¼ æ件çç±»å |
|---|
| | | type: Array, |
|---|
| | | default: () => { |
|---|
| | | return []; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | url: { |
|---|
| | | //ä¸ä¼ çurl |
|---|
| | | type: String, |
|---|
| | | default: '' |
|---|
| | | }, |
|---|
| | | uploadBefore: { |
|---|
| | | //è¿åfalseä¼ä¸æ¢æ§è¡ |
|---|
| | | //ä¸ä¼ å |
|---|
| | | type: Function, |
|---|
| | | default: (files) => { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | uploadAfter: { |
|---|
| | | //è¿åfalseä¼ä¸æ¢æ§è¡ |
|---|
| | | //ä¸ä¼ å |
|---|
| | | type: Function, |
|---|
| | | default: (result, files) => { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | onChange: { |
|---|
| | | //éæ©æä»¶æ¶ //è¿åfalseä¼ä¸æ¢æ§è¡ |
|---|
| | | type: Function, |
|---|
| | | default: (files) => { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | // clear: { |
|---|
| | | // //ä¸ä¼ å®æåæ¯å¦æ¸
空æ件å表 |
|---|
| | | // type: Boolean, |
|---|
| | | // default: true |
|---|
| | | // }, |
|---|
| | | fileList: { |
|---|
| | | //æ¯å¦æ¾ç¤ºéæ©çæ件å表 |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | fileClick: { |
|---|
| | | //ç¹å»æ件äºä»¶ |
|---|
| | | type: Function, |
|---|
| | | default: (index, file, files) => { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | removeBefore: { |
|---|
| | | //移é¤æ件äºä»¶ |
|---|
| | | type: Function, |
|---|
| | | default: (index, file, files) => { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | append: { |
|---|
| | | //æ¤å±æ§å·²åºå¼ï¼å¤æ件ä¸ä¼ ï¼é»è®¤è¿½å æ件 |
|---|
| | | type: Boolean, |
|---|
| | | default: false |
|---|
| | | }, |
|---|
| | | compress: { |
|---|
| | | //å¼å¯å¾çå缩,åé¢æ ¹æ®éè¦åå®å |
|---|
| | | type: Boolean, |
|---|
| | | default: true |
|---|
| | | }, |
|---|
| | | compressMinSize: { |
|---|
| | | //å缩çæå°æ¯ä¾ |
|---|
| | | type: Number, |
|---|
| | | default: 0.1 |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | errorImg: 'this.src="' + require('@/assets/imgs/error-img.png') + '"', |
|---|
| | | changed: false, //æå¨ä¸ä¼ æååç¦æ¢éå¤ä¸ä¼ ï¼å¿
é¡»éæ°éæ© |
|---|
| | | model: true, |
|---|
| | | files: [], |
|---|
| | | bigImg: '', |
|---|
| | | imgTypes: ['gif', 'jpg', 'jpeg', 'png', 'bmp', 'webp', 'jfif'], |
|---|
| | | loadingStatus: false, |
|---|
| | | loadText: 'ä¸ä¼ æ件' |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | created() { |
|---|
| | | //é»è®¤æå¾ççç¦æ¢ä¸ä¼ æä½ |
|---|
| | | if (this.fileInfo) { |
|---|
| | | this.changed = true; |
|---|
| | | } |
|---|
| | | this.cloneFile(this.fileInfo); |
|---|
| | | }, |
|---|
| | | watch: { |
|---|
| | | fileInfo: { |
|---|
| | | handler(files) { |
|---|
| | | this.cloneFile(files); |
|---|
| | | }, |
|---|
| | | deep: true |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | cloneFile(files) { |
|---|
| | | this.files = files.map((x) => { |
|---|
| | | return { |
|---|
| | | name: x.name || this.getFileName(x.path), |
|---|
| | | path: x.path |
|---|
| | | }; |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | getFileName(path) { |
|---|
| | | if (!path) { |
|---|
| | | return 'æªå®ä¹æ件å'; |
|---|
| | | } |
|---|
| | | let _index = path.lastIndexOf('/'); |
|---|
| | | return path.substring(_index + 1); |
|---|
| | | }, |
|---|
| | | previewImg(index) { |
|---|
| | | //æ¥ç大å¾é¢è§æ¨¡å¼å¾
å® |
|---|
| | | this.base.previewImg(this.getImgSrc(this.files[index])); |
|---|
| | | // window.open(this.getImgSrc((this.files.length>0?this.files:this.fileInfo)[index])); |
|---|
| | | }, |
|---|
| | | getSelector() { |
|---|
| | | if (this.autoUpload) { |
|---|
| | | return 'auto-selector'; |
|---|
| | | } |
|---|
| | | return 'submit-selector'; |
|---|
| | | }, |
|---|
| | | getImgSrc(file, index) { |
|---|
| | | if (file.hasOwnProperty('path')) { |
|---|
| | | if (this.base.isUrl(file.path)) { |
|---|
| | | return file.path; |
|---|
| | | } |
|---|
| | | //2020.12.27å¢å base64å¾çæä½ |
|---|
| | | if (file.path.indexOf('/9j/') != -1) { |
|---|
| | | return 'data:image/jpeg;base64,' + file.path; |
|---|
| | | } |
|---|
| | | if (file.path.substr(0, 1) == '/') { |
|---|
| | | file.path = file.path.substr(1); |
|---|
| | | } |
|---|
| | | return this.http.ipAddress + file.path; |
|---|
| | | } |
|---|
| | | return window.URL.createObjectURL(file); |
|---|
| | | }, |
|---|
| | | fileOnClick(index, file) { |
|---|
| | | if (!this.fileClick(index, file, this.files)) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | //ç¹å»ä¸ä¸è½½ |
|---|
| | | if (!this.downLoad) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | if (!file.path) { |
|---|
| | | this.$message.error('请å
ä¸ä¼ æ件'); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | this.base.dowloadFile( |
|---|
| | | file.path, |
|---|
| | | file.name, |
|---|
| | | { |
|---|
| | | Authorization: this.$store.getters.getToken() |
|---|
| | | }, |
|---|
| | | this.http.ipAddress |
|---|
| | | ); |
|---|
| | | }, |
|---|
| | | getText() { |
|---|
| | | if (this.img) { |
|---|
| | | return 'åªè½ä¸ä¼ å¾ç,'; |
|---|
| | | } else if (this.excel) { |
|---|
| | | return 'åªè½ä¸ä¼ excelæ件,'; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | handleClick() { |
|---|
| | | this.$refs.input.click(); |
|---|
| | | }, |
|---|
| | | handleChange(e) { |
|---|
| | | //this.compresså¼å¯å¾çå缩,åé¢æ ¹æ®éè¦åå®å |
|---|
| | | // this.clearFiles(); |
|---|
| | | var result = this.checkFile(e.target.files); |
|---|
| | | if (!result) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | |
|---|
| | | this.changed = false; |
|---|
| | | //å¦æä¼ å
¥äºFileInfoéè¦èªè¡å¤ç移é¤FileInfo |
|---|
| | | if (!this.onChange(e.target.files)) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | for (let index = 0; index < e.target.files.length; index++) { |
|---|
| | | const element = e.target.files[index]; |
|---|
| | | element.input = true; |
|---|
| | | } |
|---|
| | | if (!this.multiple) { |
|---|
| | | this.files.splice(0); |
|---|
| | | } |
|---|
| | | this.files.push(...e.target.files); |
|---|
| | | |
|---|
| | | this.$refs.input.value = null; |
|---|
| | | if (this.autoUpload && result) { |
|---|
| | | this.upload(false); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | removeFile(index) { |
|---|
| | | //å¦æä¼ å
¥äºFileInfoéè¦èªè¡å¤ç移é¤FileInfo |
|---|
| | | //t移é¤æ件 |
|---|
| | | let removeFile = this.files[index]; |
|---|
| | | //å é¤çè¿æ²¡ä¸ä¼ çæ件 |
|---|
| | | if (removeFile.input) { |
|---|
| | | this.files.splice(index, 1); |
|---|
| | | } else { |
|---|
| | | this.fileInfo.splice(index, 1); |
|---|
| | | } |
|---|
| | | if (!this.removeBefore(index, removeFile, this.fileInfo)) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | clearFiles() { |
|---|
| | | this.files.splice(0); |
|---|
| | | }, |
|---|
| | | getFiles() { |
|---|
| | | return this.files; |
|---|
| | | }, |
|---|
| | | convertToFile(dataurl, filename) { |
|---|
| | | let arr = dataurl.split(','); |
|---|
| | | let mime = arr[0].match(/:(.*?);/)[1]; |
|---|
| | | let suffix = mime.split('/')[1]; |
|---|
| | | let bstr = atob(arr[1]); |
|---|
| | | let n = bstr.length; |
|---|
| | | let u8arr = new Uint8Array(n); |
|---|
| | | while (n--) { |
|---|
| | | u8arr[n] = bstr.charCodeAt(n); |
|---|
| | | } |
|---|
| | | // new Fileè¿åFile对象 第ä¸ä¸ªåæ°æ¯ ArraryBuffer æ Bolb æArrary 第äºä¸ªåæ°æ¯æ件å |
|---|
| | | // 第ä¸ä¸ªåæ°æ¯ è¦æ¾å°æ件ä¸çå
容ç MIME ç±»å |
|---|
| | | return new File([u8arr], `${filename}.${suffix}`, { |
|---|
| | | type: mime, |
|---|
| | | input: true |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | async compressImg(file) { |
|---|
| | | let fileSize = file.size / 1024 / 1024; |
|---|
| | | let read = new FileReader(); |
|---|
| | | read.readAsDataURL(file); |
|---|
| | | return new Promise((resolve, reject) => { |
|---|
| | | read.onload = (e) => { |
|---|
| | | let img = new Image(); |
|---|
| | | img.src = e.target.result; |
|---|
| | | let _this = this; |
|---|
| | | img.onload = function() { |
|---|
| | | //é»è®¤ææ¯ä¾å缩 |
|---|
| | | let w = this.width; |
|---|
| | | let h = this.height; |
|---|
| | | let canvas = document.createElement('canvas'); |
|---|
| | | let ctx = canvas.getContext('2d'); |
|---|
| | | canvas.setAttribute('width', w); |
|---|
| | | canvas.setAttribute('height', h); |
|---|
| | | ctx.drawImage(this, 0, 0, w, h); |
|---|
| | | let rate = 0.3; |
|---|
| | | if (fileSize > 2) { |
|---|
| | | rate = 0.1; |
|---|
| | | } else if (fileSize > 1) { |
|---|
| | | rate = 0.1; |
|---|
| | | } |
|---|
| | | if (_this.compressMinSize > rate) { |
|---|
| | | rate = _this.compressMinSize; |
|---|
| | | } |
|---|
| | | // rate=1; |
|---|
| | | let base64 = canvas.toDataURL('image/jpeg', rate); |
|---|
| | | resolve(_this.convertToFile(base64, file.name)); |
|---|
| | | }; |
|---|
| | | }; |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | async uploadOSS() { |
|---|
| | | this.http.get('api/alioss/getAccessToken', {}, false).then(async (x) => { |
|---|
| | | if (!x.status) return this.$Message.error(x.message); |
|---|
| | | let client = new OSS({ |
|---|
| | | // yourRegionå¡«åBucketæå¨å°åã以åä¸1ï¼æå·ï¼ä¸ºä¾ï¼Regionå¡«å为oss-cn-hangzhouã |
|---|
| | | region: x.data.region, |
|---|
| | | // ä»STSæå¡è·åç临æ¶è®¿é®å¯é¥ï¼AccessKey IDåAccessKey Secretï¼ã |
|---|
| | | accessKeyId: x.data.accessKeyId, |
|---|
| | | accessKeySecret: x.data.accessKeySecret, |
|---|
| | | // ä»STSæå¡è·åçå®å
¨ä»¤çï¼SecurityTokenï¼ã |
|---|
| | | stsToken: x.data.securityToken, |
|---|
| | | // å¡«åBucketå称ã |
|---|
| | | bucket: x.data.bucket |
|---|
| | | }); |
|---|
| | | console.log(this.files); |
|---|
| | | for (let index = 0; index < this.files.length; index++) { |
|---|
| | | const file = this.files[index]; |
|---|
| | | if (file.input) { |
|---|
| | | let result = await client.put( |
|---|
| | | x.data.bucketFolder + '/' + x.data.unique + file.name, |
|---|
| | | file |
|---|
| | | ); |
|---|
| | | file.path = result.url; |
|---|
| | | file.newName = x.data.unique + file.name; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | this.fileInfo.splice(0); |
|---|
| | | // } |
|---|
| | | let _files = this.files.map((file) => { |
|---|
| | | return { |
|---|
| | | name: file.newName || file.name, |
|---|
| | | path: file.path |
|---|
| | | }; |
|---|
| | | }); |
|---|
| | | this.fileInfo.push(..._files); |
|---|
| | | //2021.09.25ä¿®å¤æ件ä¸ä¼ åä¸è½åæ¶ä¸è½½çé®é¢ |
|---|
| | | this.files = _files; |
|---|
| | | }); |
|---|
| | | return; |
|---|
| | | }, |
|---|
| | | async upload(vail) { |
|---|
| | | if (vail && !this.checkFile()) return false; |
|---|
| | | if (!this.url) { |
|---|
| | | return this.$message.error('没æé
置好Url'); |
|---|
| | | } |
|---|
| | | if (!this.files || this.files.length == 0) { |
|---|
| | | return this.$message.error('请éæ©æ件'); |
|---|
| | | } |
|---|
| | | //å¢å ä¸ä¼ æ¶èªå®ä¹åæ°ï¼åå°ä½¿ç¨è·åUtilities.HttpContext.Current.Request.Query["å段"] |
|---|
| | | let params={}; |
|---|
| | | if (!this.uploadBefore(this.files,params)) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | let paramText=""; |
|---|
| | | if (Object.keys(params).length) { |
|---|
| | | paramText="?1=1"; |
|---|
| | | for (const key in params) { |
|---|
| | | let value=params[key]; |
|---|
| | | if(typeof(value)=='object'){ |
|---|
| | | value=JSON.stringify(value) |
|---|
| | | } |
|---|
| | | paramText+=`&${key}=${value}` |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | this.loadingStatus = true; |
|---|
| | | this.loadText = 'ä¸ä¼ ä¸..'; |
|---|
| | | if (window.oss && window.oss.ali.use) { |
|---|
| | | await this.uploadOSS(); |
|---|
| | | this.loadingStatus = false; |
|---|
| | | this.loadText = 'ä¸ä¼ æ件'; |
|---|
| | | if (!this.uploadAfter({status:true}, this.files)) { |
|---|
| | | this.changed = false; |
|---|
| | | return; |
|---|
| | | } else { |
|---|
| | | this.changed = true; |
|---|
| | | } |
|---|
| | | this.$message.success('ä¸ä¼ æå'); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | |
|---|
| | | var forms = new FormData(); |
|---|
| | | for (let index = 0; index < this.files.length; index++) { |
|---|
| | | let file = this.files[index]; |
|---|
| | | if (file.input) { |
|---|
| | | let name = file.name.split('.'); |
|---|
| | | name = name[name.length - 1].toLocaleLowerCase(); |
|---|
| | | let isImg = this.imgTypes.indexOf(name) != -1; |
|---|
| | | if (isImg && (name == 'jpg' || name == 'jpeg')) { |
|---|
| | | //>200KBçå¼å¯å缩 |
|---|
| | | if (isImg && file.size / 1024 / 1024 > 0.2) { |
|---|
| | | console.log('å缩å' + file.size); |
|---|
| | | file = await this.compressImg(file); |
|---|
| | | file.compress = true; |
|---|
| | | this.files[index] = file; |
|---|
| | | this.files[index].input = true; |
|---|
| | | console.log('å缩å' + file.size); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | forms.append('fileInput', file, file.name); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | // forms.append("fileInput", this.files); |
|---|
| | | |
|---|
| | | this.http |
|---|
| | | .post(this.url+paramText, forms, this.autoUpload ? 'æ£å¨ä¸ä¼ æ件' : '') |
|---|
| | | .then( |
|---|
| | | (x) => { |
|---|
| | | // this.$refs.uploadFile.clearFiles(); |
|---|
| | | this.loadingStatus = false; |
|---|
| | | this.loadText = 'ä¸ä¼ æ件'; |
|---|
| | | if (!this.uploadAfter(x, this.files)) { |
|---|
| | | this.changed = false; |
|---|
| | | return; |
|---|
| | | } else { |
|---|
| | | this.changed = true; |
|---|
| | | } |
|---|
| | | this.$message.success(x.message); |
|---|
| | | this.changed = x.status; |
|---|
| | | if (!x.status) { |
|---|
| | | // this.files = null; |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | //åéæ¸
é¤ä»¥åçæ°æ® |
|---|
| | | // if (!this.multiple) { |
|---|
| | | this.fileInfo.splice(0); |
|---|
| | | // } |
|---|
| | | let _files = this.files.map((file) => { |
|---|
| | | return { |
|---|
| | | name: file.name, |
|---|
| | | path: file.path || x.data + file.name |
|---|
| | | }; |
|---|
| | | }); |
|---|
| | | this.fileInfo.push(..._files); |
|---|
| | | //2021.09.25ä¿®å¤æ件ä¸ä¼ åä¸è½åæ¶ä¸è½½çé®é¢ |
|---|
| | | this.files = _files; |
|---|
| | | }, |
|---|
| | | (error) => { |
|---|
| | | this.loadText = 'ä¸ä¼ æ件'; |
|---|
| | | this.loadingStatus = false; |
|---|
| | | } |
|---|
| | | ); |
|---|
| | | }, |
|---|
| | | format(file, checkFileType) { |
|---|
| | | const format = |
|---|
| | | file.name |
|---|
| | | .split('.') |
|---|
| | | .pop() |
|---|
| | | .toLocaleLowerCase() || ''; |
|---|
| | | let fileIcon = 'el-icon-document'; |
|---|
| | | if (this.fileTypes.length > 0 && checkFileType != undefined) { |
|---|
| | | if (this.fileTypes.indexOf(format) != -1) { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | if ( |
|---|
| | | checkFileType && |
|---|
| | | !(checkFileType instanceof Array) && |
|---|
| | | checkFileType != 'img' && |
|---|
| | | checkFileType != 'excel' |
|---|
| | | ) { |
|---|
| | | if (checkFileType.indexOf(format) > -1) { |
|---|
| | | return true; |
|---|
| | | } else { |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (checkFileType == 'img' || this.imgTypes.indexOf(format) > -1) { |
|---|
| | | if (checkFileType == 'img') { |
|---|
| | | if (this.imgTypes.indexOf(format) > -1) { |
|---|
| | | return true; |
|---|
| | | } else { |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | fileIcon = 'el-icon-picture-outline'; |
|---|
| | | } |
|---|
| | | if ( |
|---|
| | | ['mp4', 'm3u8', 'rmvb', 'avi', 'swf', '3gp', 'mkv', 'flv'].indexOf( |
|---|
| | | format |
|---|
| | | ) > -1 |
|---|
| | | ) { |
|---|
| | | fileIcon = 'el-icon-document'; |
|---|
| | | } |
|---|
| | | if (['mp3', 'wav', 'wma', 'ogg', 'aac', 'flac'].indexOf(format) > -1) { |
|---|
| | | fileIcon = 'el-icon-document'; |
|---|
| | | } |
|---|
| | | if (['doc', 'txt', 'docx', 'pages', 'epub', 'pdf'].indexOf(format) > -1) { |
|---|
| | | fileIcon = 'el-icon-document'; |
|---|
| | | } |
|---|
| | | if ( |
|---|
| | | checkFileType == 'excel' || |
|---|
| | | ['numbers', 'csv', 'xls', 'xlsx'].indexOf(format) > -1 |
|---|
| | | ) { |
|---|
| | | if (checkFileType == 'excel') { |
|---|
| | | if (['numbers', 'csv', 'xls', 'xlsx'].indexOf(format) > -1) { |
|---|
| | | return true; |
|---|
| | | } else { |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | fileIcon = 'el-icon-document'; |
|---|
| | | } |
|---|
| | | return fileIcon; |
|---|
| | | }, |
|---|
| | | beforeUpload() {}, |
|---|
| | | checkFile(inputFiles) { |
|---|
| | | const files = this.files; |
|---|
| | | |
|---|
| | | if ( |
|---|
| | | this.multiple && |
|---|
| | | files.length + (inputFiles || []).length > (this.maxFile || 5) |
|---|
| | | ) { |
|---|
| | | this.$message.error( |
|---|
| | | 'æå¤åªè½éã' + |
|---|
| | | (this.maxFile || 5) + |
|---|
| | | 'ã' + |
|---|
| | | (this.img ? 'å¼ å¾ç' : '个æ件') + |
|---|
| | | '' |
|---|
| | | ); |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | if (!inputFiles) { |
|---|
| | | inputFiles = this.files.filter((x) => { |
|---|
| | | return x.input; |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | let names = []; |
|---|
| | | for (let index = 0; index < inputFiles.length; index++) { |
|---|
| | | const file = inputFiles[index]; |
|---|
| | | if (names.indexOf(file.name) != -1) { |
|---|
| | | file.name = '(' + index + ')' + file.name; |
|---|
| | | } |
|---|
| | | names.push(file.name); |
|---|
| | | if (this.img && !this.format(file, 'img')) { |
|---|
| | | this.$message.error('éæ©çæ件ã' + file.name + 'ãåªè½æ¯å¾çæ ¼å¼'); |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | if (this.excel && !this.format(file, 'excel')) { |
|---|
| | | this.$message.error('éæ©çæ件ã' + file.name + 'ãåªè½æ¯excelæ件'); |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | if ( |
|---|
| | | this.fileTypes && |
|---|
| | | this.fileTypes.length > 0 && |
|---|
| | | !this.format(file, this.fileTypes) |
|---|
| | | ) { |
|---|
| | | this.$message.error( |
|---|
| | | 'éæ©çæ件ã' + |
|---|
| | | file.name + |
|---|
| | | 'ãåªè½æ¯ã' + |
|---|
| | | this.fileTypes.join(',') + |
|---|
| | | 'ãæ ¼å¼' |
|---|
| | | ); |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | if (file.size > (this.maxSize || 50) * 1024 * 1024) { |
|---|
| | | this.$message.error( |
|---|
| | | 'éæ©çæ件ã' + |
|---|
| | | file.name + |
|---|
| | | 'ãä¸è½è¶
è¿:' + |
|---|
| | | (this.maxSize || 50) + |
|---|
| | | 'M' |
|---|
| | | ); |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .upload-list { |
|---|
| | | padding-left: 0; |
|---|
| | | list-style: none; |
|---|
| | | .list-file { |
|---|
| | | line-height: 20px; |
|---|
| | | padding: 4px; |
|---|
| | | color: #515a6e; |
|---|
| | | border-radius: 4px; |
|---|
| | | transition: background-color 0.2s ease-in-out; |
|---|
| | | overflow: hidden; |
|---|
| | | position: relative; |
|---|
| | | |
|---|
| | | font-size: 13px; |
|---|
| | | .file-remove { |
|---|
| | | display: none; |
|---|
| | | right: 0; |
|---|
| | | // margin-left: 50px; |
|---|
| | | color: #0e9286; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .list-file:hover { |
|---|
| | | cursor: pointer; |
|---|
| | | .file-remove { |
|---|
| | | display: initial; |
|---|
| | | } |
|---|
| | | color: #2d8cf0; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .upload-container { |
|---|
| | | display: inline-block; |
|---|
| | | width: 100%; |
|---|
| | | // padding: 10px; |
|---|
| | | |
|---|
| | | // min-height: 250px; |
|---|
| | | border-radius: 5px; |
|---|
| | | .alert { |
|---|
| | | margin-top: 43px; |
|---|
| | | } |
|---|
| | | .button-group > * { |
|---|
| | | float: left; |
|---|
| | | margin-right: 10px; |
|---|
| | | } |
|---|
| | | .file-info > span { |
|---|
| | | margin-right: 20px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .upload-img { |
|---|
| | | display: inline-block; |
|---|
| | | .img-item:hover .operation { |
|---|
| | | display: block; |
|---|
| | | } |
|---|
| | | .img-item, |
|---|
| | | .img-selector { |
|---|
| | | position: relative; |
|---|
| | | cursor: pointer; |
|---|
| | | margin: 0 10px 10px 0; |
|---|
| | | float: left; |
|---|
| | | width: 65px; |
|---|
| | | height: 65px; |
|---|
| | | border: 1px solid #c7c7c7; |
|---|
| | | overflow: hidden; |
|---|
| | | border-radius: 5px; |
|---|
| | | box-sizing: content-box; |
|---|
| | | img { |
|---|
| | | margin: 0; |
|---|
| | | padding: 0; |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | object-fit: cover; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .operation { |
|---|
| | | display: none; |
|---|
| | | position: absolute; |
|---|
| | | top: 0; |
|---|
| | | bottom: 0; |
|---|
| | | left: 0; |
|---|
| | | right: 0; |
|---|
| | | .action { |
|---|
| | | opacity: 0.6; |
|---|
| | | text-align: center; |
|---|
| | | background: #151515de; |
|---|
| | | font-size: 14px; |
|---|
| | | position: absolute; |
|---|
| | | z-index: 90; |
|---|
| | | width: 100%; |
|---|
| | | bottom: 3px; |
|---|
| | | bottom: 0; |
|---|
| | | color: #ded5d5; |
|---|
| | | padding-right: 7px; |
|---|
| | | padding-bottom: 3px; |
|---|
| | | line-height: 20px; |
|---|
| | | .el-icon-view { |
|---|
| | | margin: 0 10px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .mask { |
|---|
| | | opacity: 0.6; |
|---|
| | | background: #9e9e9e; |
|---|
| | | top: 0; |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | position: absolute; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .img-selector { |
|---|
| | | font-size: 50px; |
|---|
| | | text-align: center; |
|---|
| | | i { |
|---|
| | | position: relative; |
|---|
| | | font-size: 40px; |
|---|
| | | color: #6f6f6f; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .auto-selector { |
|---|
| | | .selector { |
|---|
| | | line-height: 64px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .selector { |
|---|
| | | color: #a0a0a0; |
|---|
| | | } |
|---|
| | | .submit-selector { |
|---|
| | | .s-btn { |
|---|
| | | line-height: 22px; |
|---|
| | | font-size: 12px; |
|---|
| | | top: -6px; |
|---|
| | | // padding: 2px; |
|---|
| | | position: relative; |
|---|
| | | background: #2db7f5; |
|---|
| | | color: white; |
|---|
| | | } |
|---|
| | | .selector { |
|---|
| | | line-height: 50px; |
|---|
| | | } |
|---|
| | | .readonly { |
|---|
| | | background: #8c8c8c; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .big-model { |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | position: relative; |
|---|
| | | .m-img { |
|---|
| | | } |
|---|
| | | .mask { |
|---|
| | | position: absolute; |
|---|
| | | opacity: 0.6; |
|---|
| | | background: #eee; |
|---|
| | | top: 0; |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | position: absolute; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .auto-upload { |
|---|
| | | z-index: 9999999; |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | position: fixed; |
|---|
| | | top: 0; |
|---|
| | | left: 0; |
|---|
| | | .j-content { |
|---|
| | | text-align: center; |
|---|
| | | font-size: 17px; |
|---|
| | | top: 40%; |
|---|
| | | position: absolute; |
|---|
| | | z-index: 999; |
|---|
| | | left: 0; |
|---|
| | | right: 0; |
|---|
| | | width: 240px; |
|---|
| | | /* height: 100%; */ |
|---|
| | | margin: auto; |
|---|
| | | background: white; |
|---|
| | | /* bottom: 30px; */ |
|---|
| | | line-height: 50px; |
|---|
| | | border-radius: 6px; |
|---|
| | | border: 1px solid #d2d2d2; |
|---|
| | | } |
|---|
| | | .mask { |
|---|
| | | cursor: pointer; |
|---|
| | | opacity: 0.6; |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | background: #101010; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | export default { |
|---|
| | | |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style> |
|---|
| | | |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="hello" ref="volWangEditor"></div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import E from "wangeditor"; |
|---|
| | | export default { |
|---|
| | | props: { |
|---|
| | | url: { |
|---|
| | | //ä¸ä¼ å¾ççurl |
|---|
| | | type: String, |
|---|
| | | default: "", |
|---|
| | | }, |
|---|
| | | upload: { |
|---|
| | | //ä¸ä¼ æ¹æ³ |
|---|
| | | type: Function, |
|---|
| | | // (file, insertImgFn) => {} |
|---|
| | | default: null, |
|---|
| | | }, |
|---|
| | | uploadCount: { |
|---|
| | | //æå¤å¯ä»¥ä¸ä¼ (å¾ç)çæ°é |
|---|
| | | type: Number, |
|---|
| | | default: 3, |
|---|
| | | }, |
|---|
| | | modelValue: "", |
|---|
| | | width: { |
|---|
| | | type: String, |
|---|
| | | default: "100%", |
|---|
| | | }, |
|---|
| | | height: { |
|---|
| | | type: Number, |
|---|
| | | default: 250, |
|---|
| | | }, |
|---|
| | | minWidth: { |
|---|
| | | type: Number, |
|---|
| | | default: 650, |
|---|
| | | }, |
|---|
| | | minHeight: { |
|---|
| | | type: Number, |
|---|
| | | default: 100, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | name: "wang-editor", |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | lastHtml: "", |
|---|
| | | change: false, |
|---|
| | | editor: null, |
|---|
| | | init: false, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | watch: { |
|---|
| | | modelValue(newVal, val) { |
|---|
| | | if ( |
|---|
| | | (newVal !== val && |
|---|
| | | this.lastHtml !== "" && |
|---|
| | | val === this.lastHtml && |
|---|
| | | this.editor.txt.html() === this.lastHtml) || |
|---|
| | | this.editor.txt.html() === "" |
|---|
| | | ) { |
|---|
| | | this.editor.txt.html(newVal); |
|---|
| | | } |
|---|
| | | this.lastHtml = newVal; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | destroyed() { |
|---|
| | | this.editor = null; |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | | this.editor = null; |
|---|
| | | let editor = new E(this.$refs.volWangEditor); |
|---|
| | | this.editor = editor; |
|---|
| | | let $this = this; |
|---|
| | | editor.config.zIndex = 500; |
|---|
| | | editor.config.height = this.height; |
|---|
| | | editor.config.onchange = (html) => { |
|---|
| | | if (!this.init && this.lastHtml === "") { |
|---|
| | | this.lastHtml = html; |
|---|
| | | this.init = true; |
|---|
| | | } |
|---|
| | | this.$emit("update:modelValue", html); |
|---|
| | | }; |
|---|
| | | // editor.config.uploadFileName = "fileInput"; |
|---|
| | | // //设置header |
|---|
| | | // editor.config.uploadImgHeaders = { |
|---|
| | | // Accept: "application/json", |
|---|
| | | // Authorization: this.$store.getters.getToken(), |
|---|
| | | // }; |
|---|
| | | //ä¸ä¼ å°å |
|---|
| | | editor.config.uploadImgServer = this.http.ipAddress + this.url; |
|---|
| | | // console.log(editor.config.uploadImgServer); |
|---|
| | | editor.config.customUploadImg = function (resultFiles, insertImgFn) { |
|---|
| | | // èªå®ä¹ä¸ä¼ |
|---|
| | | if ($this.upload) { |
|---|
| | | console.log("è°ç¨èªå®ä¹çä¸ä¼ æ¹æ³"); |
|---|
| | | console.log(resultFiles); |
|---|
| | | // resultFiles æ¯ input ä¸éä¸çæ件å表 |
|---|
| | | // insertImgFn æ¯è·åå¾ç url åï¼æå
¥å°ç¼è¾å¨çæ¹æ³ |
|---|
| | | //æå¯è½ä¼ä¸ä¼ å¤å¼ å¾ç,ä¸ä¼ å¤å¼ å¾çå°±éè¦è¿è¡éå |
|---|
| | | resultFiles.map((item) => { |
|---|
| | | // _this.getUploadImg(item, insertImgFn); |
|---|
| | | $this.upload(item, insertImgFn); |
|---|
| | | }); |
|---|
| | | } else { |
|---|
| | | let formData = new FormData(); |
|---|
| | | let nameArr = []; |
|---|
| | | resultFiles.forEach(function (file) { |
|---|
| | | formData.append("fileInput", file, file.name); |
|---|
| | | nameArr.push(file.name); |
|---|
| | | }); |
|---|
| | | if (!$this.url) { |
|---|
| | | $this.$message.error("æªé
ç½®url"); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | $this.http.post($this.url, formData, true).then((x) => { |
|---|
| | | if (!x.status) { |
|---|
| | | return $this.$message.error(x.message); |
|---|
| | | } |
|---|
| | | nameArr.forEach(m=>{ |
|---|
| | | insertImgFn($this.http.ipAddress + x.data + m); |
|---|
| | | }) |
|---|
| | | // let imgs = nameArr |
|---|
| | | // .map((m) => { |
|---|
| | | // return $this.http.ipAddress + x.data + m; |
|---|
| | | // }) |
|---|
| | | // .join(","); |
|---|
| | | // insertImgFn(imgs); |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | editor.create(); |
|---|
| | | editor.txt.html(this.modelValue); |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <!-- Add "scoped" attribute to limit CSS to this component only --> |
|---|
| | | <style scoped> |
|---|
| | | h1, |
|---|
| | | h2 { |
|---|
| | | font-weight: normal; |
|---|
| | | } |
|---|
| | | ul { |
|---|
| | | list-style-type: none; |
|---|
| | | padding: 0; |
|---|
| | | } |
|---|
| | | li { |
|---|
| | | display: inline-block; |
|---|
| | | margin: 0 10px; |
|---|
| | | } |
|---|
| | | a { |
|---|
| | | color: #42b983; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div style="height: 100%"> |
|---|
| | | <redirect-error :text="text" message="请æ±ç¡®è®¤æ¯å¦é
ç½®æé" :errorNumber="errorNumber"></redirect-error> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import RedirectError from "./RedirectError"; |
|---|
| | | export default { |
|---|
| | | components: { |
|---|
| | | RedirectError, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | errorNumber: "401", |
|---|
| | | text: "æ±æï¼æ¨æ²¡ææéè¿è¡æ¤æä½~", |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div style="height:100%;"> |
|---|
| | | <redirect-error :text="text" :errorNumber="errorNumber"></redirect-error> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import RedirectError from "./RedirectError"; |
|---|
| | | export default { |
|---|
| | | components: { |
|---|
| | | RedirectError |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | errorNumber:'404', |
|---|
| | | text: "æ±æï¼é¡µé¢å¥½åå»ç«æäº~" |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="middle-box"> |
|---|
| | | <div class="text-center animated fadeInDown"> |
|---|
| | | <i style="font-size: 50px;color: #67c23a;margin-top:40px;" class="el-icon-circle-check"></i> |
|---|
| | | <div style="font-size: 20px;margin-top: 10px;" class="error-desc">{{ text }}</div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | export default { |
|---|
| | | props: { |
|---|
| | | text: { |
|---|
| | | type: String, |
|---|
| | | default: "æä½æåï¼", |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | body { |
|---|
| | | background-color: #fff; |
|---|
| | | } |
|---|
| | | .middle-box { |
|---|
| | | text-align: center; |
|---|
| | | padding-top: 80px; |
|---|
| | | height: 100%; |
|---|
| | | // background: #eee; |
|---|
| | | h1 { |
|---|
| | | font-size: 140px; |
|---|
| | | font-weight: 100; |
|---|
| | | } |
|---|
| | | .back { |
|---|
| | | padding: 10px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="middle-box"> |
|---|
| | | <div class="text-center animated fadeInDown"> |
|---|
| | | <h1>{{ errorNumber }}</h1> |
|---|
| | | <h3 class="font-bold">{{message}}</h3> |
|---|
| | | <slot></slot> |
|---|
| | | <div class="error-desc">{{ text }}</div> |
|---|
| | | <div class="back"> |
|---|
| | | <el-button type="primary" @click="backHome" icon="md-arrow-round-back" |
|---|
| | | >è¿åé¦é¡µ</el-button > |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import { Script } from "vm"; |
|---|
| | | export default { |
|---|
| | | props: { |
|---|
| | | errorNumber: { |
|---|
| | | type: String, |
|---|
| | | default: "500", |
|---|
| | | }, |
|---|
| | | message: { |
|---|
| | | type: String, |
|---|
| | | default: "页é¢æªæ¾å°ï¼", |
|---|
| | | }, |
|---|
| | | text: { |
|---|
| | | type: String, |
|---|
| | | default: "å...好ååºäºç¹é®é¢~", |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | backHome: function () { |
|---|
| | | this.$router.push({ |
|---|
| | | path: "/home", |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | body { |
|---|
| | | background-color: #fff; |
|---|
| | | } |
|---|
| | | .middle-box { |
|---|
| | | text-align: center; |
|---|
| | | padding-top: 80px; |
|---|
| | | height: 100%; |
|---|
| | | // background: #eee; |
|---|
| | | h1 { |
|---|
| | | font-size: 140px; |
|---|
| | | font-weight: 100; |
|---|
| | | } |
|---|
| | | .back { |
|---|
| | | padding: 10px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | | |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div style="height:100%;"> |
|---|
| | | <redirect-error :text="text" :errorNumber="errorNumber"> |
|---|
| | | <div> |
|---|
| | | <router-link to="SellOrder"> |
|---|
| | | <Button>ç¹å»æ¥ç[æµè¯å®æ´ç¤ºä¾]</Button> |
|---|
| | | </router-link> |
|---|
| | | </div> |
|---|
| | | </redirect-error> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import RedirectError from "./RedirectError"; |
|---|
| | | export default { |
|---|
| | | components: { |
|---|
| | | RedirectError |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | errorNumber: "ç¨ä¾æ£å¨æ´çä¸", |
|---|
| | | text: "详ç»ç¨ä¾å¨æ£åå¤ä¸,ç®åå¯åè[æµè¯å®æ´ç¤ºä¾]ç使ç¨æ¹æ³" |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | let dataA = { |
|---|
| | | "name": "æµç¨A", |
|---|
| | | "nodeList": [ |
|---|
| | | { |
|---|
| | | "id": "0", |
|---|
| | | "name": "æµç¨å¼å§", |
|---|
| | | "type": "start", |
|---|
| | | "left": "346px", |
|---|
| | | "top": "22px", |
|---|
| | | "ico": "el-icon-user-solid" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | "id": "nodeA", |
|---|
| | | "name": "æµç¨A-èç¹A", |
|---|
| | | "type": "node", |
|---|
| | | "left": "346px", |
|---|
| | | "top": "132px", |
|---|
| | | "ico": "el-icon-user-solid" |
|---|
| | | }, |
|---|
| | | // { |
|---|
| | | // "id": "nodeB", |
|---|
| | | // "name": "æµç¨A-èç¹B", |
|---|
| | | // "type": "node", |
|---|
| | | // "left": "347px", |
|---|
| | | // "top": "235px", |
|---|
| | | // "ico": "el-icon-goods" |
|---|
| | | // }, |
|---|
| | | // { |
|---|
| | | // "id": "nodeC", |
|---|
| | | // "name": "æµç¨A-èç¹C", |
|---|
| | | // "type": "node", |
|---|
| | | // "left": "323px", |
|---|
| | | // "top": "399px", |
|---|
| | | // "ico": "el-icon-present" |
|---|
| | | // } |
|---|
| | | ], |
|---|
| | | "lineList": [ |
|---|
| | | { |
|---|
| | | "from": "0", |
|---|
| | | "to": "nodeA" |
|---|
| | | }, |
|---|
| | | // { |
|---|
| | | // "from": "nodeA", |
|---|
| | | // "to": "nodeB" |
|---|
| | | // }, |
|---|
| | | // { |
|---|
| | | // "from": "nodeB", |
|---|
| | | // "to": "nodeC" |
|---|
| | | // } |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | export function getDataA () { |
|---|
| | | return dataA |
|---|
| | | } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | /** |
|---|
| | | * æè°¢ https://github.com/chaangliu/ForceDirectedLayout/blob/master/javascript/force-directed.js |
|---|
| | | * A force directed graph layout implementation by liuchang on 2018/05/10. |
|---|
| | | */ |
|---|
| | | const CANVAS_WIDTH = 1000 |
|---|
| | | const CANVAS_HEIGHT = 1000 |
|---|
| | | let k |
|---|
| | | let mNodeList = [] |
|---|
| | | let mEdgeList = [] |
|---|
| | | let mDxMap = {} |
|---|
| | | let mDyMap = {} |
|---|
| | | let mNodeMap = {} |
|---|
| | | |
|---|
| | | export function ForceDirected(data = {}) { |
|---|
| | | // generate nodes and edges |
|---|
| | | // for (let i = 0; i < 20; i++) { |
|---|
| | | // mNodeList.push(new Node(i)) |
|---|
| | | // } |
|---|
| | | k = 0 |
|---|
| | | mNodeList = [] |
|---|
| | | mEdgeList = [] |
|---|
| | | mDxMap = {} |
|---|
| | | mDyMap = {} |
|---|
| | | mNodeMap = {} |
|---|
| | | |
|---|
| | | let nodeList = data.nodeList |
|---|
| | | for (let i = 0; i < nodeList.length; i++) { |
|---|
| | | let node = nodeList[i] |
|---|
| | | mNodeList.push(node) |
|---|
| | | } |
|---|
| | | |
|---|
| | | // for (let i = 0; i < 20; i++) { |
|---|
| | | // let edgeCount = Math.random() * 8 + 1 |
|---|
| | | // for (let j = 0; j < edgeCount; j++) { |
|---|
| | | // let targetId = Math.floor(Math.random() * 20) |
|---|
| | | // let edge = new Edge(i, targetId) |
|---|
| | | // mEdgeList.push(edge) |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | // line 转 edge |
|---|
| | | let lineList = data.lineList |
|---|
| | | for (let i = 0; i < lineList.length; i++) { |
|---|
| | | let line = lineList[i] |
|---|
| | | let edge = new Edge(line.from, line.to) |
|---|
| | | mEdgeList.push(edge) |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (mNodeList && mEdgeList) { |
|---|
| | | k = Math.sqrt(CANVAS_WIDTH * CANVAS_HEIGHT / mNodeList.length) |
|---|
| | | } |
|---|
| | | for (let i = 0; i < mNodeList.length; i++) { |
|---|
| | | let node = mNodeList[i] |
|---|
| | | if (node) { |
|---|
| | | mNodeMap[node.id] = node |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | // éæºçæåæ . Generate coordinates randomly. |
|---|
| | | let initialX, initialY, initialSize = 40.0 |
|---|
| | | for (let i in mNodeList) { |
|---|
| | | initialX = CANVAS_WIDTH * 0.5 |
|---|
| | | initialY = CANVAS_HEIGHT * 0.5 |
|---|
| | | mNodeList[i].x = initialX + initialSize * (Math.random() - 0.5) |
|---|
| | | mNodeList[i].y = initialY + initialSize * (Math.random() - 0.5) |
|---|
| | | } |
|---|
| | | |
|---|
| | | // è¿ä»£200次. Iterate 200 times. |
|---|
| | | for (let i = 0; i < 200; i++) { |
|---|
| | | calculateRepulsive() |
|---|
| | | calculateTraction() |
|---|
| | | updateCoordinates() |
|---|
| | | } |
|---|
| | | // console.log(JSON.stringify(new Result(mNodeList, mEdgeList))) |
|---|
| | | // åæ æ·»å px |
|---|
| | | for (let i = 0; i < mNodeList.length; i++) { |
|---|
| | | let node = mNodeList[i] |
|---|
| | | node.left = node.x + 'px' |
|---|
| | | node.top = node.y + 'px' |
|---|
| | | node.x = undefined |
|---|
| | | node.y = undefined |
|---|
| | | } |
|---|
| | | |
|---|
| | | data.nodeList = mNodeList |
|---|
| | | |
|---|
| | | // console.log(data) |
|---|
| | | return data |
|---|
| | | } |
|---|
| | | |
|---|
| | | function Node(id = null) { |
|---|
| | | this.id = id |
|---|
| | | this.x = 22 |
|---|
| | | this.y = null |
|---|
| | | } |
|---|
| | | |
|---|
| | | function Edge(source = null, target = null) { |
|---|
| | | this.source = source |
|---|
| | | this.target = target |
|---|
| | | } |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 计ç®ä¸¤ä¸ªNodeçæ¥å产ççåä½ä½ç§»ã |
|---|
| | | * Calculate the displacement generated by the repulsive force between two nodes.* |
|---|
| | | */ |
|---|
| | | function calculateRepulsive() { |
|---|
| | | let ejectFactor = 6 |
|---|
| | | let distX, distY, dist |
|---|
| | | for (let i = 0; i < mNodeList.length; i++) { |
|---|
| | | mDxMap[mNodeList[i].id] = 0.0 |
|---|
| | | mDyMap[mNodeList[i].id] = 0.0 |
|---|
| | | for (let j = 0; j < mNodeList.length; j++) { |
|---|
| | | if (i !== j) { |
|---|
| | | distX = mNodeList[i].x - mNodeList[j].x |
|---|
| | | distY = mNodeList[i].y - mNodeList[j].y |
|---|
| | | dist = Math.sqrt(distX * distX + distY * distY) |
|---|
| | | } |
|---|
| | | if (dist < 30) { |
|---|
| | | ejectFactor = 5 |
|---|
| | | } |
|---|
| | | if (dist > 0 && dist < 250) { |
|---|
| | | let id = mNodeList[i].id |
|---|
| | | mDxMap[id] = mDxMap[id] + distX / dist * k * k / dist * ejectFactor |
|---|
| | | mDyMap[id] = mDyMap[id] + distY / dist * k * k / dist * ejectFactor |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * 计ç®Edgeçå¼å对两端Node产ççå¼åã |
|---|
| | | * Calculate the traction force generated by the edge acted on the two nodes of its two ends. |
|---|
| | | */ |
|---|
| | | function calculateTraction() { |
|---|
| | | let condenseFactor = 3 |
|---|
| | | let startNode, endNode |
|---|
| | | for (let e = 0; e < mEdgeList.length; e++) { |
|---|
| | | let eStartID = mEdgeList[e].source |
|---|
| | | let eEndID = mEdgeList[e].target |
|---|
| | | startNode = mNodeMap[eStartID] |
|---|
| | | endNode = mNodeMap[eEndID] |
|---|
| | | if (!startNode) { |
|---|
| | | console.log('Cannot find start node id: ' + eStartID + ', please check it out.') |
|---|
| | | return |
|---|
| | | } |
|---|
| | | if (!endNode) { |
|---|
| | | console.log('Cannot find end node id: ' + eEndID + ', please check it out.') |
|---|
| | | return |
|---|
| | | } |
|---|
| | | let distX, distY, dist |
|---|
| | | distX = startNode.x - endNode.x |
|---|
| | | distY = startNode.y - endNode.y |
|---|
| | | dist = Math.sqrt(distX * distX + distY * distY) |
|---|
| | | mDxMap[eStartID] = mDxMap[eStartID] - distX * dist / k * condenseFactor |
|---|
| | | mDyMap[eStartID] = mDyMap[eStartID] - distY * dist / k * condenseFactor |
|---|
| | | mDxMap[eEndID] = mDxMap[eEndID] + distX * dist / k * condenseFactor |
|---|
| | | mDyMap[eEndID] = mDyMap[eEndID] + distY * dist / k * condenseFactor |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | /** |
|---|
| | | * æ´æ°åæ ã |
|---|
| | | * update the coordinates. |
|---|
| | | */ |
|---|
| | | function updateCoordinates() { |
|---|
| | | let maxt = 4, maxty = 3 // Additional coefficients. |
|---|
| | | for (let v = 0; v < mNodeList.length; v++) { |
|---|
| | | let node = mNodeList[v] |
|---|
| | | let dx = Math.floor(mDxMap[node.id]) |
|---|
| | | let dy = Math.floor(mDyMap[node.id]) |
|---|
| | | |
|---|
| | | if (dx < -maxt) dx = -maxt |
|---|
| | | if (dx > maxt) dx = maxt |
|---|
| | | if (dy < -maxty) dy = -maxty |
|---|
| | | if (dy > maxty) dy = maxty |
|---|
| | | node.x = node.x + dx >= CANVAS_WIDTH || node.x + dx <= 0 ? node.x - dx : node.x + dx |
|---|
| | | node.y = node.y + dy >= CANVAS_HEIGHT || node.y + dy <= 0 ? node.y - dy : node.y + dy |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | function Result(nodes = null, links = null) { |
|---|
| | | this.nodes = nodes |
|---|
| | | this.links = links |
|---|
| | | } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | /*ç»å¸å®¹å¨*/ |
|---|
| | | .efContainer { |
|---|
| | | position: relative; |
|---|
| | | overflow: scroll; |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | .tools { |
|---|
| | | position: absolute; |
|---|
| | | left: 220px; |
|---|
| | | /* background: #fff; */ |
|---|
| | | /* border: 1px solid #d8d7d7; */ |
|---|
| | | /* border-radius: 5px; */ |
|---|
| | | padding: 5px 5px; |
|---|
| | | display: flex; |
|---|
| | | z-index: 99; |
|---|
| | | background: #fcfcfc; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /*顶é¨å·¥å
·æ */ |
|---|
| | | .ef-tooltar { |
|---|
| | | padding-left: 10px; |
|---|
| | | box-sizing: border-box; |
|---|
| | | height: 42px; |
|---|
| | | line-height: 42px; |
|---|
| | | z-index: 3; |
|---|
| | | border-bottom: 1px solid #dadce0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .jtk-overlay { |
|---|
| | | cursor: pointer; |
|---|
| | | color: #4a4a4a; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ef-node-pmenu-item { |
|---|
| | | padding: 10px; |
|---|
| | | background: #f8f8f8; |
|---|
| | | font-size: 13px; |
|---|
| | | font-weight: bold; |
|---|
| | | letter-spacing: 1px; |
|---|
| | | border-top: 1px solid #eee; |
|---|
| | | border-bottom: 1px solid #eee; |
|---|
| | | border-right: 1px solid #eee; |
|---|
| | | } |
|---|
| | | /*èç¹èå*/ |
|---|
| | | .ef-node-pmenu { |
|---|
| | | cursor: pointer; |
|---|
| | | height: 32px; |
|---|
| | | line-height: 32px; |
|---|
| | | width: 225px; |
|---|
| | | display: block; |
|---|
| | | font-weight: bold; |
|---|
| | | color: #4a4a4a; |
|---|
| | | padding-left: 5px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ef-node-pmenu:hover { |
|---|
| | | background-color: #e0e0e0; |
|---|
| | | } |
|---|
| | | .ef-node-menu-item { |
|---|
| | | padding: 10px; |
|---|
| | | } |
|---|
| | | .ef-node-menu-li { |
|---|
| | | cursor: move; |
|---|
| | | border: 1px solid #eee; |
|---|
| | | padding: 2px 13px; |
|---|
| | | text-align: left; |
|---|
| | | line-height: 28px; |
|---|
| | | margin: 4px; |
|---|
| | | border-radius: 3px; |
|---|
| | | background: #f0f9eb; |
|---|
| | | font-size: 12px; |
|---|
| | | float: left; |
|---|
| | | width: 98px; |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ef-node-menu-li > div:first-child{ |
|---|
| | | display: inline-block; |
|---|
| | | padding: 4px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ef-node-menu-li:hover { |
|---|
| | | /* 设置移å¨æ ·å¼*/ |
|---|
| | | cursor: move; |
|---|
| | | border: 1px dashed #787be8; |
|---|
| | | color: #787be8; |
|---|
| | | /* background-color: #F0F7FF; |
|---|
| | | border: 1px dashed #1879FF; |
|---|
| | | border-left: 4px solid #1879FF; |
|---|
| | | padding-left: 5px; */ |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ef-node-menu-ul { |
|---|
| | | list-style: none; |
|---|
| | | padding-left: 0; |
|---|
| | | margin: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /*èç¹çæå¤å±å®¹å¨*/ |
|---|
| | | .ef-node-container { |
|---|
| | | position: absolute; |
|---|
| | | display: flex; |
|---|
| | | width: 170px; |
|---|
| | | height: 32px; |
|---|
| | | border: 1px solid #e0e3e7; |
|---|
| | | border-radius: 5px; |
|---|
| | | background-color: #fff; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ef-node-container:hover { |
|---|
| | | /* 设置移å¨æ ·å¼*/ |
|---|
| | | cursor: move; |
|---|
| | | background-color: #f0f7ff; |
|---|
| | | /*box-shadow: #1879FF 0px 0px 12px 0px;*/ |
|---|
| | | background-color: #f0f7ff; |
|---|
| | | border: 1px dashed #1879ff; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /*èç¹æ¿æ´»æ ·å¼*/ |
|---|
| | | .ef-node-active { |
|---|
| | | background-color: #f0f7ff; |
|---|
| | | /*box-shadow: #1879FF 0px 0px 12px 0px;*/ |
|---|
| | | background-color: #f0f7ff; |
|---|
| | | border: 1px solid #1879ff; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /*èç¹å·¦ä¾§çç«çº¿*/ |
|---|
| | | .ef-node-left { |
|---|
| | | width: 4px; |
|---|
| | | background-color: #1879ff; |
|---|
| | | border-radius: 4px 0 0 4px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /*èç¹å·¦ä¾§çå¾æ */ |
|---|
| | | .ef-node-left-ico { |
|---|
| | | line-height: 32px; |
|---|
| | | margin-left: 8px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ef-node-left-ico:hover { |
|---|
| | | /* 设置ææ½çæ ·å¼ */ |
|---|
| | | cursor: crosshair; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /*èç¹æ¾ç¤ºçæå*/ |
|---|
| | | .ef-node-text { |
|---|
| | | color: #565758; |
|---|
| | | font-size: 12px; |
|---|
| | | line-height: 32px; |
|---|
| | | margin-left: 8px; |
|---|
| | | width: 100px; |
|---|
| | | /* 设置è¶
åºå®½åº¦ææ¬æ¾ç¤ºæ¹å¼*/ |
|---|
| | | white-space: nowrap; |
|---|
| | | overflow: hidden; |
|---|
| | | text-overflow: ellipsis; |
|---|
| | | text-align: center; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /*èç¹å³ä¾§çå¾æ */ |
|---|
| | | .ef-node-right-ico { |
|---|
| | | line-height: 32px; |
|---|
| | | position: absolute; |
|---|
| | | right: 5px; |
|---|
| | | color: #84cf65; |
|---|
| | | cursor: default; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /*èç¹çå ç§ç¶ææ ·å¼*/ |
|---|
| | | .el-node-state-success { |
|---|
| | | line-height: 32px; |
|---|
| | | position: absolute; |
|---|
| | | right: 5px; |
|---|
| | | color: #84cf65; |
|---|
| | | cursor: default; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-node-state-error { |
|---|
| | | line-height: 32px; |
|---|
| | | position: absolute; |
|---|
| | | right: 5px; |
|---|
| | | color: #f56c6c; |
|---|
| | | cursor: default; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-node-state-warning { |
|---|
| | | line-height: 32px; |
|---|
| | | position: absolute; |
|---|
| | | right: 5px; |
|---|
| | | color: #e6a23c; |
|---|
| | | cursor: default; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-node-state-running { |
|---|
| | | line-height: 32px; |
|---|
| | | position: absolute; |
|---|
| | | right: 5px; |
|---|
| | | color: #84cf65; |
|---|
| | | cursor: default; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /*node-form*/ |
|---|
| | | .ef-node-form-header { |
|---|
| | | height: 32px; |
|---|
| | | border-top: 1px solid #dce3e8; |
|---|
| | | border-bottom: 1px solid #dce3e8; |
|---|
| | | background: #f1f3f4; |
|---|
| | | color: #000; |
|---|
| | | line-height: 32px; |
|---|
| | | padding-left: 12px; |
|---|
| | | font-size: 14px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ef-node-form-body { |
|---|
| | | margin-top: 10px; |
|---|
| | | padding-right: 10px; |
|---|
| | | padding-bottom: 20px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /* è¿çº¿ä¸çlabel æ ·å¼*/ |
|---|
| | | .jtk-overlay.flowLabel:not(.aLabel) { |
|---|
| | | /* padding: 4px 10px; */ |
|---|
| | | padding: 1px 8px 2px 8px; |
|---|
| | | background-color: white; |
|---|
| | | color: #a9aaaa !important; |
|---|
| | | border: 1px solid #e0e3e7; |
|---|
| | | border-radius: 3px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /* label 为空çæ ·å¼ */ |
|---|
| | | .emptyFlowLabel { |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ef-dot { |
|---|
| | | background-color: #1879ff; |
|---|
| | | border-radius: 10px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ef-dot-hover { |
|---|
| | | background-color: red; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ef-rectangle { |
|---|
| | | background-color: #1879ff; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ef-rectangle-hover { |
|---|
| | | background-color: red; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ef-img { |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ef-img-hover { |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ef-drop-hover { |
|---|
| | | border: 1px dashed #1879ff; |
|---|
| | | } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | export const easyFlowMixin = { |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | jsplumbSetting: { |
|---|
| | | // å¨æéç¹ãä½ç½®èªéåº |
|---|
| | | Anchors: ['Top', 'TopCenter', 'TopRight', 'TopLeft', 'Right', 'RightMiddle', 'Bottom', 'BottomCenter', 'BottomRight', 'BottomLeft', 'Left', 'LeftMiddle'], |
|---|
| | | // 容å¨ID |
|---|
| | | Container: 'efContainer', |
|---|
| | | // è¿çº¿çæ ·å¼ï¼ç´çº¿æè
æ²çº¿çï¼å¯éå¼: StateMachineãFlowchartï¼BezierãStraight |
|---|
| | | Connector: ['Bezier', {curviness: 100}], |
|---|
| | | // Connector: ['Straight', {stub: 20, gap: 1}], |
|---|
| | | // Connector: ['Flowchart', {stub: 30, gap: 1, alwaysRespectStubs: false, midpoint: 0.5, cornerRadius: 10}], |
|---|
| | | // Connector: ['StateMachine', {margin: 5, curviness: 10, proximityLimit: 80}], |
|---|
| | | // é¼ æ ä¸è½æå¨å é¤çº¿ |
|---|
| | | ConnectionsDetachable: false, |
|---|
| | | // å é¤çº¿çæ¶åèç¹ä¸å é¤ |
|---|
| | | DeleteEndpointsOnDetach: false, |
|---|
| | | /** |
|---|
| | | * è¿çº¿ç两端端ç¹ç±»åï¼åå½¢ |
|---|
| | | * radius: åçåå¾ï¼è¶å¤§åè¶å¤§ |
|---|
| | | */ |
|---|
| | | // Endpoint: ['Dot', {radius: 5, cssClass: 'ef-dot', hoverClass: 'ef-dot-hover'}], |
|---|
| | | /** |
|---|
| | | * è¿çº¿ç两端端ç¹ç±»åï¼ç©å½¢ |
|---|
| | | * height: ç©å½¢çé« |
|---|
| | | * width: ç©å½¢ç宽 |
|---|
| | | */ |
|---|
| | | // Endpoint: ['Rectangle', {height: 20, width: 20, cssClass: 'ef-rectangle', hoverClass: 'ef-rectangle-hover'}], |
|---|
| | | /** |
|---|
| | | * å¾åç«¯ç¹ |
|---|
| | | */ |
|---|
| | | // Endpoint: ['Image', {src: 'https://www.easyicon.net/api/resizeApi.php?id=1181776&size=32', cssClass: 'ef-img', hoverClass: 'ef-img-hover'}], |
|---|
| | | /** |
|---|
| | | * 空ç½ç«¯ç¹ |
|---|
| | | */ |
|---|
| | | Endpoint: ['Blank', {Overlays: ''}], |
|---|
| | | // Endpoints: [['Dot', {radius: 5, cssClass: 'ef-dot', hoverClass: 'ef-dot-hover'}], ['Rectangle', {height: 20, width: 20, cssClass: 'ef-rectangle', hoverClass: 'ef-rectangle-hover'}]], |
|---|
| | | /** |
|---|
| | | * è¿çº¿ç两端端ç¹æ ·å¼ |
|---|
| | | * fill: é¢è²å¼ï¼å¦ï¼#12aabbï¼ä¸ºç©ºä¸æ¾ç¤º |
|---|
| | | * outlineWidth: å¤è¾¹çº¿å®½åº¦ |
|---|
| | | */ |
|---|
| | | EndpointStyle: {fill: '#1879ffa1', outlineWidth: 1}, |
|---|
| | | // æ¯å¦æå¼jsPlumbçå
é¨æ¥å¿è®°å½ |
|---|
| | | LogEnabled: true, |
|---|
| | | /** |
|---|
| | | * è¿çº¿çæ ·å¼ |
|---|
| | | */ |
|---|
| | | PaintStyle: { |
|---|
| | | // 线çé¢è² |
|---|
| | | stroke: '#E0E3E7', |
|---|
| | | // 线çç²ç»ï¼å¼è¶å¤§çº¿è¶ç² |
|---|
| | | strokeWidth: 1, |
|---|
| | | // 设置å¤è¾¹çº¿çé¢è²ï¼é»è®¤è®¾ç½®éæï¼è¿æ ·å«äººå°±çä¸è§äºï¼ç¹å»çº¿çæ¶åå¯ä»¥ä¸ç¨ç²¾ç¡®ç¹å»ï¼åè https://blog.csdn.net/roymno2/article/details/72717101 |
|---|
| | | outlineStroke: 'transparent', |
|---|
| | | // 线å¤è¾¹ç宽ï¼å¼è¶å¤§ï¼çº¿çç¹å»èå´è¶å¤§ |
|---|
| | | outlineWidth: 10 |
|---|
| | | }, |
|---|
| | | DragOptions: {cursor: 'pointer', zIndex: 2000}, |
|---|
| | | /** |
|---|
| | | * å å åèï¼ https://www.jianshu.com/p/d9e9918fd928 |
|---|
| | | */ |
|---|
| | | Overlays: [ |
|---|
| | | // ç®å¤´å å |
|---|
| | | ['Arrow', { |
|---|
| | | width: 10, // ç®å¤´å°¾é¨ç宽度 |
|---|
| | | length: 8, // ä»ç®å¤´çå°¾é¨å°å¤´é¨çè·ç¦» |
|---|
| | | location: 1, // ä½ç½®ï¼å»ºè®®ä½¿ç¨0ï½1ä¹é´ |
|---|
| | | direction: 1, // æ¹åï¼é»è®¤å¼ä¸º1ï¼è¡¨ç¤ºååï¼ï¼å¯é-1ï¼è¡¨ç¤ºååï¼ |
|---|
| | | foldback: 0.623 // æåï¼ä¹å°±æ¯å°¾ç¿¼çè§åº¦ï¼é»è®¤0.623ï¼å½ä¸º1æ¶ï¼ä¸ºæ£ä¸è§ |
|---|
| | | }], |
|---|
| | | // ['Diamond', { |
|---|
| | | // events: { |
|---|
| | | // dblclick: function (diamondOverlay, originalEvent) { |
|---|
| | | // console.log('double click on diamond overlay for : ' + diamondOverlay.component) |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | // }], |
|---|
| | | ['Label', { |
|---|
| | | label: '', |
|---|
| | | location: 0.1, |
|---|
| | | cssClass: 'aLabel' |
|---|
| | | }] |
|---|
| | | ], |
|---|
| | | // ç»å¶å¾çæ¨¡å¼ svgãcanvas |
|---|
| | | RenderMode: 'svg', |
|---|
| | | // é¼ æ æ»è¿çº¿çæ ·å¼ |
|---|
| | | HoverPaintStyle: {stroke: '#b0b2b5', strokeWidth: 1}, |
|---|
| | | // æ»è¿éç¹ææ |
|---|
| | | // EndpointHoverStyle: {fill: 'red'} |
|---|
| | | Scope: 'jsPlumb_DefaultScope' // èå´ï¼å
·æç¸åscopeçç¹æå¯è¿æ¥ |
|---|
| | | }, |
|---|
| | | /** |
|---|
| | | * è¿çº¿åæ° |
|---|
| | | */ |
|---|
| | | jsplumbConnectOptions: { |
|---|
| | | isSource: true, |
|---|
| | | isTarget: true, |
|---|
| | | // å¨æéç¹ãæä¾äº4个æ¹å ContinuousãAutoDefault |
|---|
| | | anchor: 'Continuous', |
|---|
| | | // 设置è¿çº¿ä¸é¢çlabelæ ·å¼ |
|---|
| | | labelStyle: { |
|---|
| | | cssClass: 'flowLabel' |
|---|
| | | }, |
|---|
| | | // ä¿®æ¹äºjsplumb æºç ï¼æ¯ælabel ä¸ºç©ºä¼ å
¥èªå®ä¹style |
|---|
| | | emptyLabelStyle: { |
|---|
| | | cssClass: 'emptyFlowLabel' |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | /** |
|---|
| | | * æºç¹é
ç½®åæ° |
|---|
| | | */ |
|---|
| | | jsplumbSourceOptions: { |
|---|
| | | // 设置å¯ä»¥ææ½çç±»åï¼åªè¦é¼ æ 移å¨å°è¯¥ç±»åä¸çDOMï¼å°±å¯ä»¥ææ½è¿çº¿ |
|---|
| | | filter: '.flow-node-drag', |
|---|
| | | filterExclude: false, |
|---|
| | | anchor: 'Continuous', |
|---|
| | | // æ¯å¦å
许èªå·±è¿æ¥èªå·± |
|---|
| | | allowLoopback: true, |
|---|
| | | maxConnections: -1, |
|---|
| | | onMaxConnections: function (info, e) { |
|---|
| | | console.log(`è¶
è¿äºæ大å¼è¿çº¿: ${info.maxConnections}`) |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | // åè https://www.cnblogs.com/mq0036/p/7942139.html |
|---|
| | | jsplumbSourceOptions2: { |
|---|
| | | // 设置å¯ä»¥ææ½çç±»åï¼åªè¦é¼ æ 移å¨å°è¯¥ç±»åä¸çDOMï¼å°±å¯ä»¥ææ½è¿çº¿ |
|---|
| | | filter: '.flow-node-drag', |
|---|
| | | filterExclude: false, |
|---|
| | | // anchor: 'Continuous', |
|---|
| | | // æ¯å¦å
许èªå·±è¿æ¥èªå·± |
|---|
| | | allowLoopback: true, |
|---|
| | | connector: ['Flowchart', {curviness: 50}], |
|---|
| | | connectorStyle: { |
|---|
| | | // 线çé¢è² |
|---|
| | | stroke: 'red', |
|---|
| | | // 线çç²ç»ï¼å¼è¶å¤§çº¿è¶ç² |
|---|
| | | strokeWidth: 1, |
|---|
| | | // 设置å¤è¾¹çº¿çé¢è²ï¼é»è®¤è®¾ç½®éæï¼è¿æ ·å«äººå°±çä¸è§äºï¼ç¹å»çº¿çæ¶åå¯ä»¥ä¸ç¨ç²¾ç¡®ç¹å»ï¼åè https://blog.csdn.net/roymno2/article/details/72717101 |
|---|
| | | outlineStroke: 'transparent', |
|---|
| | | // 线å¤è¾¹ç宽ï¼å¼è¶å¤§ï¼çº¿çç¹å»èå´è¶å¤§ |
|---|
| | | outlineWidth: 10 |
|---|
| | | }, |
|---|
| | | connectorHoverStyle: {stroke: 'red', strokeWidth: 2} |
|---|
| | | }, |
|---|
| | | jsplumbTargetOptions: { |
|---|
| | | // 设置å¯ä»¥ææ½çç±»åï¼åªè¦é¼ æ 移å¨å°è¯¥ç±»åä¸çDOMï¼å°±å¯ä»¥ææ½è¿çº¿ |
|---|
| | | filter: '.flow-node-drag', |
|---|
| | | filterExclude: false, |
|---|
| | | // æ¯å¦å
许èªå·±è¿æ¥èªå·± |
|---|
| | | anchor: 'Continuous', |
|---|
| | | allowLoopback: true, |
|---|
| | | dropOptions: {hoverClass: 'ef-drop-hover'} |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div ref="node" class="node-item" :style="nodeContainerStyle" @click="clickNode" @mouseup="changeNodeSite" |
|---|
| | | :class="nodeContainerClass"> |
|---|
| | | <!-- æ左侧çé£æ¡ç«çº¿ --> |
|---|
| | | <div class="ef-node-left"></div> |
|---|
| | | <!-- èç¹ç±»åçå¾æ --> |
|---|
| | | <div class="ef-node-left-ico flow-node-drag"> |
|---|
| | | <i :class="nodeIcoClass"></i> |
|---|
| | | </div> |
|---|
| | | <!-- èç¹å称 --> |
|---|
| | | <div class="ef-node-text" :show-overflow-tooltip="true"> |
|---|
| | | {{ node.name }} |
|---|
| | | </div> |
|---|
| | | <i @click.stop="delNode" v-if="node.type == 'node' && !disabled" style="display: none" class="el-icon-delete"></i> |
|---|
| | | <!-- èç¹ç¶æå¾æ --> |
|---|
| | | <div class="ef-node-right-ico"> |
|---|
| | | <i class="el-icon-circle-check el-node-state-success" v-show="node.state === 'success'"></i> |
|---|
| | | <i class="el-icon-circle-close el-node-state-error" v-show="node.state === 'error'"></i> |
|---|
| | | <i class="el-icon-warning-outline el-node-state-warning" v-show="node.state === 'warning'"></i> |
|---|
| | | <i class="el-icon-loading el-node-state-running" v-show="node.state === 'running'"></i> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | export default { |
|---|
| | | props: { |
|---|
| | | node: Object, |
|---|
| | | activeElement: Object, |
|---|
| | | disabled: { |
|---|
| | | typeof: Boolean, |
|---|
| | | default: false |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return {} |
|---|
| | | }, |
|---|
| | | computed: { |
|---|
| | | nodeContainerClass() { |
|---|
| | | return { |
|---|
| | | 'ef-node-container': true, |
|---|
| | | 'ef-node-active': this.activeElement.type == 'node' ? this.activeElement.nodeId === this.node.id : false |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | // èç¹å®¹å¨æ ·å¼ |
|---|
| | | nodeContainerStyle() { |
|---|
| | | return { |
|---|
| | | top: this.node.top, |
|---|
| | | left: this.node.left |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | nodeIcoClass() { |
|---|
| | | var nodeIcoClass = {} |
|---|
| | | nodeIcoClass[this.node.ico] = true |
|---|
| | | // æ·»å 该classå¯ä»¥æ¨æ½è¿çº¿åºæ¥ï¼viewOnly å¯ä»¥æ§å¶èç¹æ¯å¦è¿è¡ç¼è¾ |
|---|
| | | nodeIcoClass['flow-node-drag'] = this.node.viewOnly ? false : true |
|---|
| | | return nodeIcoClass |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | // ç¹å»èç¹ |
|---|
| | | clickNode() { |
|---|
| | | this.$emit('clickNode', this.node.id) |
|---|
| | | }, |
|---|
| | | // é¼ æ 移å¨åæ¬èµ· |
|---|
| | | changeNodeSite() { |
|---|
| | | // é¿å
æå¨ |
|---|
| | | if (this.node.left == this.$refs.node.style.left && this.node.top == this.$refs.node.style.top) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | this.$emit('changeNodeSite', { |
|---|
| | | nodeId: this.node.id, |
|---|
| | | left: this.$refs.node.style.left, |
|---|
| | | top: this.$refs.node.style.top, |
|---|
| | | }) |
|---|
| | | }, delNode() { |
|---|
| | | this.$emit("delNode"); |
|---|
| | | }, |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | <style scoped> |
|---|
| | | /* .node-item{ |
|---|
| | | position: relative; |
|---|
| | | } */ |
|---|
| | | .node-item:hover .el-icon-delete { |
|---|
| | | display: inline-block !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .el-icon-delete { |
|---|
| | | cursor: pointer; |
|---|
| | | position: relative; |
|---|
| | | top: -18px; |
|---|
| | | padding-left: 5px; |
|---|
| | | right: -16px; |
|---|
| | | color: #f61313; |
|---|
| | | height: 20px; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="node-filter-container"> |
|---|
| | | <!-- <div class="add-btn"> |
|---|
| | | <span class="name">æ¡ä»¶è®¾ç½®</span> <el-button @click="addItem" link><i>+</i>æ·»å å段</el-button> |
|---|
| | | </div> --> |
|---|
| | | <!-- {{ $store.getters.data().flowTable.WorkTable }} --> |
|---|
| | | <div class="ef-node-pmenu-item" style="display: flex;"> |
|---|
| | | <div style="flex:1;"> |
|---|
| | | <span class="name"><i class="el-icon-news"></i>æ¡ä»¶è®¾ç½®</span> |
|---|
| | | </div> |
|---|
| | | <div><el-button link size="small" @click="addItem" type="primary" v-if="!disabled"> |
|---|
| | | + æ·»å å段</el-button></div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <div> |
|---|
| | | <table> |
|---|
| | | <tr> |
|---|
| | | <td>å段</td> |
|---|
| | | <td style="width:90px">æ¡ä»¶</td> |
|---|
| | | <td class="value">å¼</td> |
|---|
| | | <td style="width: 40px;" v-if="!disabled">æä½</td> |
|---|
| | | </tr> |
|---|
| | | <tr v-for="(item, index) in filters" :key="index"> |
|---|
| | | |
|---|
| | | <td><el-select @change="(field) => { fieldChange(field, index) }" size="small" v-model="item.field" |
|---|
| | | placeholder="请éæ©" :disabled="disabled"> |
|---|
| | | <el-option v-for="data in fieldsOptions" :key="data.field" :label="data.name" |
|---|
| | | :value="data.field" /> |
|---|
| | | </el-select></td> |
|---|
| | | <td><el-select size="small" v-model="item.filterType" placeholder="请éæ©" :disabled="disabled"> |
|---|
| | | <el-option v-for="data in filterType" :key="data.value" :label="data.name" |
|---|
| | | :value="data.value" /> |
|---|
| | | </el-select></td> |
|---|
| | | <td> |
|---|
| | | <template v-if="item.data"> |
|---|
| | | <el-select v-if="item.data.length >= 300" multiple size="small" v-model="item.value" |
|---|
| | | placeholder="请éæ©"> |
|---|
| | | <el-option v-for="data in item.data" :key="data.key" :label="data.value" |
|---|
| | | :value="data.key" :disabled="disabled" /> |
|---|
| | | </el-select> |
|---|
| | | <el-select-v2 style="width: 100%;" v-else multiple size="small" :options="item.data" |
|---|
| | | v-model="item.value" placeholder="请éæ©" :disabled="disabled"> |
|---|
| | | </el-select-v2> |
|---|
| | | </template> |
|---|
| | | <el-input v-else v-model="item.value" size="small" :disabled="disabled"></el-input> |
|---|
| | | </td> |
|---|
| | | <td @click="delItem(index)" class="item-del" v-if="!disabled"><i class="el-icon-delete"></i></td> |
|---|
| | | </tr> |
|---|
| | | </table> |
|---|
| | | </div> |
|---|
| | | <!-- <div> |
|---|
| | | <label>èªå®ä¹sql</label> |
|---|
| | | <div><el-input type="textarea" v-model="customSql"></el-input></div> |
|---|
| | | </div> --> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | let _this = this; |
|---|
| | | export default { |
|---|
| | | props: { |
|---|
| | | tableName: { |
|---|
| | | type: String, |
|---|
| | | default: "" |
|---|
| | | }, |
|---|
| | | filters: { |
|---|
| | | type: Array, |
|---|
| | | default: () => { |
|---|
| | | return [] |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | disabled:{ |
|---|
| | | typeof:Boolean, |
|---|
| | | default:false |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | filter: this.$store.getters.data().flowTable, |
|---|
| | | customSql: "", |
|---|
| | | value: "", |
|---|
| | | //{ field: "å称", value: "", filterType: "=" }, |
|---|
| | | // filters: [], |
|---|
| | | fieldsOptions: [ |
|---|
| | | |
|---|
| | | ], |
|---|
| | | t: [], |
|---|
| | | filterType: [{ name: "çäº(=)", value: "=" }, |
|---|
| | | { name: "ä¸çäº(!=)", value: "!=" }, |
|---|
| | | { name: "大äº(>)", value: ">" }, |
|---|
| | | { name: "大äºçäº(>=)", value: ">=" }, |
|---|
| | | { name: "å°äº(<)", value: "<" }, |
|---|
| | | { name: "å°äºçäº(<=)", value: "<=" }, |
|---|
| | | { name: "å
æ¬(in)", value: "in" }, |
|---|
| | | // { name: "ä¸å
æ¬(not in)", value: "notin" }, |
|---|
| | | { name: "模ç³å¹é
(like)", value: "like" }, |
|---|
| | | { name: "æè
(or)", value: "or" } |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | delItem(index) { |
|---|
| | | this.$confirm('确认è¦å é¤åé
ç½®æ¡ä»¶é
ç½®å?', 'è¦å', { |
|---|
| | | confirmButtonText: 'ç¡®å®', |
|---|
| | | cancelButtonText: 'åæ¶', |
|---|
| | | type: 'warning', |
|---|
| | | center: true |
|---|
| | | }).then(() => { |
|---|
| | | this.filters.splice(index, 1); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | addItem() { |
|---|
| | | this.filters.push({ field: "", value: "", filterType: "", data: null }) |
|---|
| | | }, |
|---|
| | | fieldChange(field, index) { |
|---|
| | | let option = this.fieldsOptions.find(x => { return x.field == field }); |
|---|
| | | this.filters[index].field = option.field; |
|---|
| | | this.filters[index].value = option.data ? [] : null; |
|---|
| | | this.filters[index].data = option.data;; |
|---|
| | | }, |
|---|
| | | convertOptions(result) { |
|---|
| | | |
|---|
| | | }, |
|---|
| | | getOptions(tableName) { |
|---|
| | | const url = 'api/Sys_WorkFlow/getFields?table=' + tableName; |
|---|
| | | this.http.post(url, {}, false).then(result => { |
|---|
| | | result.forEach(c => { |
|---|
| | | if (c.data && c.data.length < 300) { |
|---|
| | | c.data = c.data.map(x => { |
|---|
| | | return { |
|---|
| | | value: x.key, |
|---|
| | | label: x.value, |
|---|
| | | key: x.key |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | _this.fieldsOptions = result; |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | watch: { |
|---|
| | | 'filter.WorkTable': { |
|---|
| | | handler(newvalue, oldvalue) { |
|---|
| | | if (newvalue) { |
|---|
| | | this.getOptions(newvalue); |
|---|
| | | } else { |
|---|
| | | // this.fieldsOptions.splice(0) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | // deep:true, |
|---|
| | | // filter(newVal,oldVal){ |
|---|
| | | // alert(1) |
|---|
| | | // } |
|---|
| | | }, |
|---|
| | | created() { |
|---|
| | | _this = this; |
|---|
| | | }, |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .node-filter-container { |
|---|
| | | margin-top: 15px; |
|---|
| | | |
|---|
| | | table { |
|---|
| | | width: 100%; |
|---|
| | | padding-left: 6px; |
|---|
| | | |
|---|
| | | td { |
|---|
| | | font-size: 13px; |
|---|
| | | padding: 5px; |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | tr:first-child { |
|---|
| | | font-size: 12px; |
|---|
| | | font-weight: bolder; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .item-del { |
|---|
| | | text-align: center; |
|---|
| | | color: rgb(226, 4, 4); |
|---|
| | | cursor: pointer; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .value { |
|---|
| | | width: 150px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .add-btn { |
|---|
| | | text-align: right; |
|---|
| | | padding-right: 10px; |
|---|
| | | border-bottom: 1px solid #e8e8e8; |
|---|
| | | padding-bottom: 5px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .node-filter-item {} |
|---|
| | | }</style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div> |
|---|
| | | <div class="ef-node-form"> |
|---|
| | | <div class="ef-node-pmenu-item"> |
|---|
| | | <div style="flex:1;"> |
|---|
| | | <span class="name"><i class="el-icon-news"></i>èç¹å±æ§</span> |
|---|
| | | <!-- <span @click="nameClick(1)" :class="{ active: index === 1 }" class="name">审æ¹æ¡ä»¶</span> --> |
|---|
| | | </div> |
|---|
| | | <!-- <div><el-button link size="small" type="primary" @click="save"><i class="el-icon-check"></i> |
|---|
| | | ä¿åé
ç½®</el-button></div> --> |
|---|
| | | </div> |
|---|
| | | <div class="ef-node-form-body"> |
|---|
| | | <div class="form-info"> |
|---|
| | | <VolForm ref="form" style="padding:0 10px;" :label-width="130" :loadKey="false" :formFields="node" |
|---|
| | | :formRules="formRules" :disabled="disabled"> |
|---|
| | | </VolForm> |
|---|
| | | </div> |
|---|
| | | <div> |
|---|
| | | <node-filter :filters="node.filters" :disabled="disabled" :tableName="tableName" ref="filter"> |
|---|
| | | </node-filter> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <!-- <div class="el-node-form-tag"></div>--> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | // import { cloneDeep } from 'lodash' |
|---|
| | | import VolForm from '@/components/basic/VolForm.vue'; |
|---|
| | | import nodeFilter from './node_filter.vue'; |
|---|
| | | export default { |
|---|
| | | components: { |
|---|
| | | VolForm, |
|---|
| | | 'node-filter': nodeFilter |
|---|
| | | }, |
|---|
| | | props: { |
|---|
| | | disabled:{ |
|---|
| | | typeof:Boolean, |
|---|
| | | default:false |
|---|
| | | } |
|---|
| | | // node: { |
|---|
| | | // type: Object, |
|---|
| | | // default: () => { |
|---|
| | | // return { |
|---|
| | | // name: '', |
|---|
| | | // auditType: 1,//å®¡æ ¸ç±»å |
|---|
| | | // userId: null, |
|---|
| | | // roleId: null, |
|---|
| | | // deptId: null, |
|---|
| | | // auditRefuse: null,//å®¡æ ¸æªéè¿ |
|---|
| | | // auditBack: null, //驳å |
|---|
| | | // auditMethod: 0,//审æ¹æ¹å¼(ä¼ç¾) |
|---|
| | | // stepValue: null, |
|---|
| | | // sendMail: 0, |
|---|
| | | // filters: [] //å段è¿æ»¤æ¡ä»¶ |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | }, |
|---|
| | | created() { |
|---|
| | | this.http.get('api/Sys_WorkFlow/getNodeDic').then((result) => { |
|---|
| | | this.formRules.forEach((options) => { |
|---|
| | | options.forEach((option) => { |
|---|
| | | if (option.dataKey && !option.data.length) { |
|---|
| | | option.data = result[option.dataKey] || []; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | tableName: "", |
|---|
| | | index: 1, |
|---|
| | | visible: true, |
|---|
| | | // node æ line |
|---|
| | | type: 'node', |
|---|
| | | node: {}, |
|---|
| | | line: {}, |
|---|
| | | data: {}, |
|---|
| | | |
|---|
| | | node: { |
|---|
| | | name: '', |
|---|
| | | auditType: 1,//å®¡æ ¸ç±»å |
|---|
| | | userId: null, |
|---|
| | | roleId: null, |
|---|
| | | deptId: null, |
|---|
| | | auditRefuse: null,//å®¡æ ¸æªéè¿ |
|---|
| | | auditBack: null, //驳å |
|---|
| | | auditMethod: 0,//审æ¹æ¹å¼(ä¼ç¾) |
|---|
| | | // nodeValue: null, |
|---|
| | | sendMail: 0, |
|---|
| | | filters: [] |
|---|
| | | }, |
|---|
| | | formRules: [ |
|---|
| | | [ |
|---|
| | | { |
|---|
| | | title: 'èç¹å称', |
|---|
| | | field: 'name', |
|---|
| | | required: true, |
|---|
| | | colSize: 12 |
|---|
| | | }], |
|---|
| | | [ |
|---|
| | | { |
|---|
| | | dataKey: '', |
|---|
| | | title: '审æ¹ç±»å', |
|---|
| | | required: true, |
|---|
| | | hidden: false, |
|---|
| | | field: 'auditType', |
|---|
| | | data: [ |
|---|
| | | { key: 1, value: 'æç¨æ·å®¡æ¹' }, |
|---|
| | | { key: 2, value: 'æè§è²å®¡æ¹' }, |
|---|
| | | { key: 3, value: 'æé¨é¨å®¡æ¹' } |
|---|
| | | ], |
|---|
| | | type: 'select', |
|---|
| | | onChange: this.nodeTypeChange, |
|---|
| | | colSize: 12 |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | [ |
|---|
| | | { |
|---|
| | | dataKey: 'users', |
|---|
| | | hidden: false, |
|---|
| | | title: '审æ¹ç¨æ·', |
|---|
| | | required: true, |
|---|
| | | field: 'userId', |
|---|
| | | data: [], |
|---|
| | | type: 'selectList', |
|---|
| | | colSize: 12 |
|---|
| | | } |
|---|
| | | , |
|---|
| | | { |
|---|
| | | dataKey: 'roles', |
|---|
| | | hidden: true, |
|---|
| | | title: 'è§è²ä¿¡æ¯', |
|---|
| | | required: true, |
|---|
| | | field: 'roleId', |
|---|
| | | |
|---|
| | | data: [], |
|---|
| | | type: 'select', |
|---|
| | | colSize: 12 |
|---|
| | | } |
|---|
| | | , |
|---|
| | | { |
|---|
| | | dataKey: 'dept', |
|---|
| | | hidden: true, |
|---|
| | | title: 'é¨é¨ä¿¡æ¯', |
|---|
| | | required: true, |
|---|
| | | field: 'deptId', |
|---|
| | | data: [], |
|---|
| | | type: 'select', |
|---|
| | | colSize: 12 |
|---|
| | | } |
|---|
| | | ], [ |
|---|
| | | { |
|---|
| | | dataKey: '', |
|---|
| | | title: '审æ¹æªéè¿', |
|---|
| | | required: false, |
|---|
| | | field: 'auditRefuse', |
|---|
| | | hidden: false, |
|---|
| | | data: [ |
|---|
| | | { key: 1, value: 'è¿åä¸ä¸èç¹' }, |
|---|
| | | { key: 2, value: 'æµç¨éæ°å¼å§' }, |
|---|
| | | { key: 0, value: 'æµç¨ç»æ' }, |
|---|
| | | ], |
|---|
| | | type: 'select', |
|---|
| | | colSize: 6 |
|---|
| | | } |
|---|
| | | , |
|---|
| | | { |
|---|
| | | dataKey: '', |
|---|
| | | title: '审æ¹é©³å', |
|---|
| | | required: false, |
|---|
| | | hidden: false, |
|---|
| | | field: 'auditBack', |
|---|
| | | data: [ |
|---|
| | | { key: 1, value: 'è¿åä¸ä¸èç¹' }, |
|---|
| | | { key: 2, value: 'æµç¨éæ°å¼å§' }, |
|---|
| | | { key: 0, value: 'æµç¨ç»æ' }, |
|---|
| | | ], |
|---|
| | | type: 'select', |
|---|
| | | colSize: 6 |
|---|
| | | |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | [ |
|---|
| | | { |
|---|
| | | dataKey: '', |
|---|
| | | title: 'å®¡æ ¸ååéé®ä»¶éç¥', |
|---|
| | | required: false, |
|---|
| | | hidden: false, |
|---|
| | | field: 'sendMail', |
|---|
| | | data: [ |
|---|
| | | { key: 1, value: 'æ¯' }, |
|---|
| | | { key: 0, value: 'å¦' }, |
|---|
| | | ], |
|---|
| | | type: 'switch' |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | dataKey: '', |
|---|
| | | title: 'å¯ç¨ä¼ç¾', |
|---|
| | | required: false, |
|---|
| | | hidden: false, |
|---|
| | | field: 'auditMethod',//审æ¹æ¹å¼ |
|---|
| | | data: [ |
|---|
| | | { key: 1, value: 'æ¯' }, |
|---|
| | | { key: 0, value: 'å¦' } |
|---|
| | | ], |
|---|
| | | type: 'switch' |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | ], |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | nameClick(index) { |
|---|
| | | this.index = index; |
|---|
| | | }, |
|---|
| | | /** |
|---|
| | | * 表åä¿®æ¹ï¼è¿éå¯ä»¥æ ¹æ®ä¼ å
¥çIDè¿è¡ä¸å¡ä¿¡æ¯è·å |
|---|
| | | * @param data |
|---|
| | | * @param id |
|---|
| | | */ |
|---|
| | | nodeInit(data, id, tableName) { |
|---|
| | | this.tableName = tableName; |
|---|
| | | this.type = 'node' |
|---|
| | | this.data = data; |
|---|
| | | // this.tableName=data. |
|---|
| | | data.nodeList.filter((node) => { |
|---|
| | | if (node.id === id) { |
|---|
| | | this.formRules.forEach(options => { |
|---|
| | | options.forEach(c => { |
|---|
| | | if (c.field != 'name') { |
|---|
| | | c.hidden = node.type == 'start' || node.type == 'end'; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | if (!node.filters) { |
|---|
| | | node.filters = []; |
|---|
| | | } |
|---|
| | | this.node = node;// cloneDeep(node) |
|---|
| | | if (node.type != 'start' && node.type != 'end') { |
|---|
| | | this.nodeTypeChange(node.auditType); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | // data.nodeList.filter((node) => { |
|---|
| | | // if (node.id === id) { |
|---|
| | | // let _node = cloneDeep(node); |
|---|
| | | // _node.roleId = _node.roleId || null; |
|---|
| | | // _node.userId = _node.userId || null; |
|---|
| | | // _node.nodeType = (_node.nodeType || 1) * 1; |
|---|
| | | // if (!node.filters) { |
|---|
| | | // node.filters = []; |
|---|
| | | // } |
|---|
| | | // _node.filters = node.filters; |
|---|
| | | // this.nodeTypeChange(_node.nodeType); |
|---|
| | | // Object.assign(this.node, _node); |
|---|
| | | // } |
|---|
| | | // }); |
|---|
| | | }, |
|---|
| | | nodeTypeChange(value) { |
|---|
| | | // { key: 1, value: 'æç¨æ·å®¡æ¹' }, |
|---|
| | | // { key: 2, value: 'æè§è²å®¡æ¹' }, |
|---|
| | | // { key: 3, value: 'æé¨é¨å®¡æ¹' } |
|---|
| | | this.formRules.forEach((options) => { |
|---|
| | | options.forEach((option) => { |
|---|
| | | if (option.field == 'userId') { |
|---|
| | | option.hidden = value != 1; |
|---|
| | | } else if (option.field == 'roleId') { |
|---|
| | | option.hidden = value != 2; |
|---|
| | | } else if (option.field == 'deptId') { |
|---|
| | | option.hidden = value != 3; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | lineInit(line) { |
|---|
| | | this.type = 'line' |
|---|
| | | this.line = line |
|---|
| | | }, |
|---|
| | | // ä¿®æ¹è¿çº¿ |
|---|
| | | saveLine() { |
|---|
| | | this.$emit('setLineLabel', this.line.from, this.line.to, this.line.label) |
|---|
| | | }, |
|---|
| | | save() { |
|---|
| | | this.data.nodeList.filter((node) => { |
|---|
| | | if (node.id === this.node.id) { |
|---|
| | | node.name = this.node.name; |
|---|
| | | node.left = this.node.left; |
|---|
| | | node.top = this.node.top; |
|---|
| | | node.ico = this.node.ico; |
|---|
| | | node.state = this.node.state; |
|---|
| | | node.stepValue = this.node.stepValue; |
|---|
| | | this.$emit('repaintEverything', this.node); |
|---|
| | | } |
|---|
| | | |
|---|
| | | }); |
|---|
| | | this.$message.success('ä¿åæå') |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .el-node-form-tag { |
|---|
| | | position: absolute; |
|---|
| | | top: 50%; |
|---|
| | | margin-left: -15px; |
|---|
| | | height: 40px; |
|---|
| | | width: 15px; |
|---|
| | | background-color: #fbfbfb; |
|---|
| | | border: 1px solid rgb(220, 227, 232); |
|---|
| | | border-right: none; |
|---|
| | | z-index: 0; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .btns { |
|---|
| | | text-align: center; |
|---|
| | | padding: 10px; |
|---|
| | | |
|---|
| | | buttton { |
|---|
| | | flex: 1; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ef-node-pmenu-item { |
|---|
| | | display: flex; |
|---|
| | | |
|---|
| | | .name { |
|---|
| | | cursor: pointer; |
|---|
| | | margin-right: 15px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .active { |
|---|
| | | color: #0659e8; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .form-info ::v-deep(.vol-form-item) { |
|---|
| | | display: flex; |
|---|
| | | |
|---|
| | | .el-form-item:nth-child(2), |
|---|
| | | .el-form-item:nth-child(3), |
|---|
| | | .el-form-item:nth-child(4) { |
|---|
| | | margin-left: 12px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="flow-menu" ref="tool"> |
|---|
| | | <div v-for="menu in menuList" :key="menu.id"> |
|---|
| | | <div class="ef-node-pmenu-item"><i class="el-icon-notebook-2"></i>èç¹é
ç½®</div> |
|---|
| | | <ul v-show="menu.open" class="ef-node-menu-ul"> |
|---|
| | | <draggable @end="end" @start="move" v-model="menu.children" :options="draggableOptions"> |
|---|
| | | <li v-for="subMenu in menu.children" class="ef-node-menu-li" :key="subMenu.id" :type="subMenu.type"> |
|---|
| | | <i :class="subMenu.ico"></i> {{ subMenu.name }} |
|---|
| | | </li> |
|---|
| | | </draggable> |
|---|
| | | </ul> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import { VueDraggableNext as draggable } from "vue-draggable-next"; |
|---|
| | | |
|---|
| | | var mousePosition = { |
|---|
| | | left: -1, |
|---|
| | | top: -1 |
|---|
| | | } |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | activeNames: '1', |
|---|
| | | // draggableé
ç½®åæ°åè https://www.cnblogs.com/weixin186/p/10108679.html |
|---|
| | | draggableOptions: { |
|---|
| | | preventOnFilter: false, |
|---|
| | | sort: false, |
|---|
| | | disabled: false, |
|---|
| | | ghostClass: 'tt', |
|---|
| | | // ä¸ä½¿ç¨H5åççé
ç½® |
|---|
| | | forceFallback: true, |
|---|
| | | // ææ½çæ¶åæ ·å¼ |
|---|
| | | // fallbackClass: 'flow-node-draggable' |
|---|
| | | }, |
|---|
| | | // é»è®¤æå¼ç左侧èåçid |
|---|
| | | defaultOpeneds: ['1', '2'], |
|---|
| | | menuList: [ |
|---|
| | | { |
|---|
| | | id: '1', |
|---|
| | | type: 'group', |
|---|
| | | name: 'å¼å§èç¹', |
|---|
| | | ico: 'el-icon-video-play', |
|---|
| | | open: true, |
|---|
| | | children: [ |
|---|
| | | { |
|---|
| | | id: '0', |
|---|
| | | type: 'start', |
|---|
| | | name: 'æµç¨å¼å§', |
|---|
| | | ico: 'el-icon-time', |
|---|
| | | // èªå®ä¹è¦çæ ·å¼ |
|---|
| | | style: {} |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | id: '1', |
|---|
| | | type: 'end', |
|---|
| | | name: 'æµç¨ç»æ', |
|---|
| | | ico: 'el-icon-switch-button', |
|---|
| | | // èªå®ä¹è¦çæ ·å¼ |
|---|
| | | style: {} |
|---|
| | | }, { |
|---|
| | | id: '2', |
|---|
| | | type: 'node', |
|---|
| | | name: 'æµç¨èç¹', |
|---|
| | | ico: 'el-icon-news', |
|---|
| | | // èªå®ä¹è¦çæ ·å¼ |
|---|
| | | style: {} |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | }], |
|---|
| | | |
|---|
| | | nodeMenu: {} |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | components: { |
|---|
| | | draggable |
|---|
| | | }, |
|---|
| | | created() { |
|---|
| | | /** |
|---|
| | | * 以ä¸æ¯ä¸ºäºè§£å³å¨ç«çæµè§å¨ä¸æ¨æ½æ¶å¼¹åºtab页å°æç´¢é®é¢ |
|---|
| | | * @param event |
|---|
| | | */ |
|---|
| | | if (this.isFirefox()) { |
|---|
| | | document.body.ondrop = function (event) { |
|---|
| | | // 解å³ç«çæµè§å¨æ æ³è·åé¼ æ ææ½ç»æçåæ é®é¢ |
|---|
| | | mousePosition.left = event.layerX |
|---|
| | | mousePosition.top = event.clientY - 50 |
|---|
| | | event.preventDefault(); |
|---|
| | | event.stopPropagation(); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | // æ ¹æ®ç±»åè·å左侧èå对象 |
|---|
| | | getMenuByType(type) { |
|---|
| | | for (let i = 0; i < this.menuList.length; i++) { |
|---|
| | | let children = this.menuList[i].children; |
|---|
| | | for (let j = 0; j < children.length; j++) { |
|---|
| | | if (children[j].type === type) { |
|---|
| | | return children[j] |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | // ææ½å¼å§æ¶è§¦å |
|---|
| | | move(evt, a, b, c) { |
|---|
| | | var type = evt.item.attributes.type.nodeValue |
|---|
| | | this.nodeMenu = this.getMenuByType(type) |
|---|
| | | }, |
|---|
| | | // ææ½ç»ææ¶è§¦å |
|---|
| | | end(evt, e) { |
|---|
| | | this.$emit('addNode', evt, this.nodeMenu, mousePosition) |
|---|
| | | }, |
|---|
| | | // æ¯å¦æ¯ç«çæµè§å¨ |
|---|
| | | isFirefox() { |
|---|
| | | var userAgent = navigator.userAgent |
|---|
| | | if (userAgent.indexOf("Firefox") > -1) { |
|---|
| | | return true |
|---|
| | | } |
|---|
| | | return false |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </script> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <!-- å®¡æ ¸æµç¨æ件åºäºhttps://gitee.com/xiaoka2017/easy-flowä¿®æ¹--> |
|---|
| | | <!--æè°¢è级å°èé¸ / easy-flow --> |
|---|
| | | <template> |
|---|
| | | <div v-if="easyFlowVisible" class="flow-panel"> |
|---|
| | | |
|---|
| | | <div style="display: flex;height: 100%;position: relative;"> |
|---|
| | | <el-scrollbar style="height: 100%;border-right: 1px solid rgb(220, 227, 232);"> |
|---|
| | | <div style="width: 220px;"> |
|---|
| | | <div class="ef-node-pmenu-item"><i class="el-icon-warning-outline"></i>åºç¡ä¿¡æ¯</div> |
|---|
| | | <VolForm ref="form" style="padding: 10px;" :label-width="180" :loadKey="true" :formFields="formFields" |
|---|
| | | :disabled="disabled" :formRules="formRules"></VolForm> |
|---|
| | | <node-menu @addNode="addNode" ref="nodeMenu" v-if="!disabled"></node-menu> |
|---|
| | | </div> |
|---|
| | | </el-scrollbar> |
|---|
| | | <div class="tools"> |
|---|
| | | <el-button circle @click="zoomAdd"><i class="el-icon-zoom-in"></i></el-button> |
|---|
| | | <el-button circle @click="zoomSub"><i class="el-icon-zoom-out"></i></el-button> |
|---|
| | | </div> |
|---|
| | | <div style="flex: 1;" id="efContainer" ref="efContainer" class="container efContainer" v-flowDrag> |
|---|
| | | <template :key="node.id" v-for="node in data.nodeList"> |
|---|
| | | <flow-node :id="node.id" @delNode="deleteNode(node.id)" :node="node" :activeElement="activeElement" |
|---|
| | | :disabled="disabled" @changeNodeSite="changeNodeSite" @nodeRightMenu="nodeRightMenu" |
|---|
| | | @clickNode="clickNode"> |
|---|
| | | </flow-node> |
|---|
| | | </template> |
|---|
| | | <!-- ç»ç»å¸ä¸ä¸ªé»è®¤ç宽度åé«åº¦ --> |
|---|
| | | <div style="position:absolute;top: 3000px;left: 4000px;"> </div> |
|---|
| | | </div> |
|---|
| | | <!-- å³ä¾§è¡¨å --> |
|---|
| | | <div style="width: 400px;border-left: 1px solid #dce3e8;background-color: #FBFBFB"> |
|---|
| | | <el-scrollbar style="height: 100%;padding-bottom: 10px;"> |
|---|
| | | <flow-node-form @delNode="deleteNode" ref="nodeForm" @setLineLabel="setLineLabel" :disabled="disabled" |
|---|
| | | @repaintEverything="repaintEverything"></flow-node-form> |
|---|
| | | </el-scrollbar> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import { VueDraggableNext as draggable } from "vue-draggable-next"; |
|---|
| | | // import { jsPlumb } from 'jsplumb' |
|---|
| | | // 使ç¨ä¿®æ¹åçjsplumb |
|---|
| | | import './jsplumb' |
|---|
| | | import { easyFlowMixin } from './mixins' |
|---|
| | | import flowNode from './node' |
|---|
| | | import nodeMenu from './node_menu' |
|---|
| | | import FlowNodeForm from './node_form' |
|---|
| | | import lodash from 'lodash' |
|---|
| | | // import { getDataA } from './data_A' |
|---|
| | | import VolForm from '@/components/basic/VolForm.vue'; |
|---|
| | | export default { |
|---|
| | | props: { |
|---|
| | | disabled: { |
|---|
| | | typeof: Boolean, |
|---|
| | | default: false |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | formFields: { |
|---|
| | | WorkName: '', |
|---|
| | | WorkTable: '', |
|---|
| | | WorkTableName: '', |
|---|
| | | Weight: 1, |
|---|
| | | AuditingEdit: 0, |
|---|
| | | Remark: '' |
|---|
| | | }, |
|---|
| | | formRules: [ |
|---|
| | | [ |
|---|
| | | { |
|---|
| | | dataKey: 'æµç¨å称', |
|---|
| | | title: 'æµç¨å称', |
|---|
| | | field: 'WorkName', |
|---|
| | | required: true |
|---|
| | | }], |
|---|
| | | [{ |
|---|
| | | dataKey: '', |
|---|
| | | title: 'æµç¨å®ä¾', |
|---|
| | | required: true, |
|---|
| | | field: 'WorkTable', |
|---|
| | | data: [], |
|---|
| | | readonly: false, |
|---|
| | | type: 'select', |
|---|
| | | onChange: (value, item) => { |
|---|
| | | this.formRules.forEach((options) => { |
|---|
| | | options.forEach((option) => { |
|---|
| | | if (option.field == 'WorkTable') { |
|---|
| | | this.formFields.WorkTableName = option.data.find((x) => { |
|---|
| | | return x.key == value; |
|---|
| | | }).value; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | }], |
|---|
| | | [{ |
|---|
| | | title: 'æé(ç¸åæ¡ä»¶æé大ä¼å
)', |
|---|
| | | field: 'Weight', |
|---|
| | | type: "number", |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | |
|---|
| | | [{ |
|---|
| | | title: 'å®¡æ ¸ä¸æ°æ®æ¯å¦å¯ä»¥ç¼è¾', |
|---|
| | | field: 'AuditingEdit', |
|---|
| | | type: "switch", |
|---|
| | | data: [{ key: 0, value: "å¦" }, { key: 1, value: "æ¯" }] |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | [{ |
|---|
| | | title: 'å¤æ³¨', |
|---|
| | | field: 'Remark' |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | ], |
|---|
| | | // jsPlumb å®ä¾ |
|---|
| | | jsPlumb: null, |
|---|
| | | // æ§å¶ç»å¸éæ¯ |
|---|
| | | easyFlowVisible: true, |
|---|
| | | // æ¯å¦å è½½å®æ¯æ å¿ä½ |
|---|
| | | loadEasyFlowFinish: false, |
|---|
| | | // æ°æ® |
|---|
| | | data: {}, |
|---|
| | | // æ¿æ´»çå
ç´ ãå¯è½æ¯èç¹ãå¯è½æ¯è¿çº¿ |
|---|
| | | activeElement: { |
|---|
| | | // å¯éå¼ node ãline |
|---|
| | | type: undefined, |
|---|
| | | // èç¹ID |
|---|
| | | nodeId: undefined, |
|---|
| | | // è¿çº¿ID |
|---|
| | | sourceId: undefined, |
|---|
| | | targetId: undefined |
|---|
| | | }, |
|---|
| | | zoom: 1 |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | // ä¸äºåºç¡é
置移å¨è¯¥æä»¶ä¸ |
|---|
| | | mixins: [easyFlowMixin], |
|---|
| | | components: { |
|---|
| | | draggable, flowNode, nodeMenu, FlowNodeForm, VolForm |
|---|
| | | }, |
|---|
| | | directives: { |
|---|
| | | 'flowDrag': { |
|---|
| | | mounted(el, binding, vnode, oldNode) { |
|---|
| | | if (!binding) { |
|---|
| | | return |
|---|
| | | } |
|---|
| | | el.onmousedown = (e) => { |
|---|
| | | if (e.button == 2) { |
|---|
| | | // å³é®ä¸ç®¡ |
|---|
| | | return |
|---|
| | | } |
|---|
| | | // é¼ æ æä¸ï¼è®¡ç®å½ååå§è·ç¦»å¯è§åºçé«åº¦ |
|---|
| | | let disX = e.clientX |
|---|
| | | let disY = e.clientY |
|---|
| | | el.style.cursor = 'move' |
|---|
| | | |
|---|
| | | document.onmousemove = function (e) { |
|---|
| | | // 移å¨æ¶ç¦æ¢é»è®¤äºä»¶ |
|---|
| | | e.preventDefault() |
|---|
| | | const left = e.clientX - disX |
|---|
| | | disX = e.clientX |
|---|
| | | el.scrollLeft += -left |
|---|
| | | |
|---|
| | | const top = e.clientY - disY |
|---|
| | | disY = e.clientY |
|---|
| | | el.scrollTop += -top |
|---|
| | | } |
|---|
| | | |
|---|
| | | document.onmouseup = function (e) { |
|---|
| | | el.style.cursor = 'auto' |
|---|
| | | document.onmousemove = null |
|---|
| | | document.onmouseup = null |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | | this.jsPlumb = jsPlumb.getInstance() |
|---|
| | | // this.$nextTick(() => { |
|---|
| | | // // é»è®¤å è½½æµç¨Açæ°æ®ãå¨è¿éå¯ä»¥æ ¹æ®å
·ä½çä¸å¡è¿å符åæµç¨æ°æ®æ ¼å¼çæ°æ®å³å¯ |
|---|
| | | // this.dataReload(getDataA()) |
|---|
| | | // }) |
|---|
| | | }, |
|---|
| | | created() { |
|---|
| | | this.http.get('api/Sys_WorkFlow/getTableInfo').then((result) => { |
|---|
| | | this.formRules.forEach((options) => { |
|---|
| | | options.forEach((option) => { |
|---|
| | | if (option.field == 'WorkTable') { |
|---|
| | | option.data = result; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | this.$store.getters.data().flowTable = this.formFields; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | // è¿åå¯ä¸æ è¯ |
|---|
| | | getUUID() { |
|---|
| | | return Math.random().toString(36).substr(3, 10) |
|---|
| | | }, |
|---|
| | | jsPlumbInit() { |
|---|
| | | this.jsPlumb.ready(() => { |
|---|
| | | // 导å
¥é»è®¤é
ç½® |
|---|
| | | this.jsPlumb.importDefaults(this.jsplumbSetting) |
|---|
| | | // ä¼ä½¿æ´ä¸ªjsPlumbç«å³éç»ã |
|---|
| | | this.jsPlumb.setSuspendDrawing(false, true); |
|---|
| | | // åå§åèç¹ |
|---|
| | | this.loadEasyFlow() |
|---|
| | | // åç¹å»äºè¿æ¥çº¿, https://www.cnblogs.com/ysx215/p/7615677.html |
|---|
| | | this.jsPlumb.bind('click', (conn, originalEvent) => { |
|---|
| | | this.activeElement.type = 'line' |
|---|
| | | this.activeElement.sourceId = conn.sourceId |
|---|
| | | this.activeElement.targetId = conn.targetId |
|---|
| | | this.$refs.nodeForm.lineInit({ |
|---|
| | | from: conn.sourceId, |
|---|
| | | to: conn.targetId, |
|---|
| | | label: conn.getLabel() |
|---|
| | | }) |
|---|
| | | this.deleteElement(); |
|---|
| | | }) |
|---|
| | | // è¿çº¿ |
|---|
| | | this.jsPlumb.bind("connection", (evt) => { |
|---|
| | | let from = evt.source.id |
|---|
| | | let to = evt.target.id |
|---|
| | | if (this.loadEasyFlowFinish) { |
|---|
| | | this.data.lineList.push({ from: from, to: to }) |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | |
|---|
| | | // å é¤è¿çº¿åè° |
|---|
| | | this.jsPlumb.bind("connectionDetached", (evt) => { |
|---|
| | | this.deleteLine(evt.sourceId, evt.targetId) |
|---|
| | | }) |
|---|
| | | |
|---|
| | | // æ¹å线çè¿æ¥èç¹ |
|---|
| | | this.jsPlumb.bind("connectionMoved", (evt) => { |
|---|
| | | this.changeLine(evt.originalSourceId, evt.originalTargetId) |
|---|
| | | }) |
|---|
| | | |
|---|
| | | // è¿çº¿å³å» |
|---|
| | | this.jsPlumb.bind("contextmenu", (evt) => { |
|---|
| | | console.log('contextmenu', evt) |
|---|
| | | }) |
|---|
| | | |
|---|
| | | // è¿çº¿ |
|---|
| | | this.jsPlumb.bind("beforeDrop", (evt) => { |
|---|
| | | let from = evt.sourceId |
|---|
| | | let to = evt.targetId |
|---|
| | | if (from === to) { |
|---|
| | | this.$message.error('èç¹ä¸æ¯æè¿æ¥èªå·±') |
|---|
| | | return false |
|---|
| | | } |
|---|
| | | if (this.hasLine(from, to)) { |
|---|
| | | this.$message.error('该å
³ç³»å·²åå¨,ä¸å
许éå¤å建') |
|---|
| | | return false |
|---|
| | | } |
|---|
| | | if (this.hashOppositeLine(from, to)) { |
|---|
| | | this.$message.error('ä¸æ¯æ两个èç¹ä¹é´è¿çº¿åç¯'); |
|---|
| | | return false |
|---|
| | | } |
|---|
| | | this.$message.success('è¿æ¥æå') |
|---|
| | | setTimeout(() => { this.setLineLabel(from, to, 'x') }, 50) |
|---|
| | | return true |
|---|
| | | }) |
|---|
| | | |
|---|
| | | // beforeDetach |
|---|
| | | this.jsPlumb.bind("beforeDetach", (evt) => { |
|---|
| | | console.log('beforeDetach', evt) |
|---|
| | | }) |
|---|
| | | this.jsPlumb.setContainer(this.$refs.efContainer) |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // å è½½æµç¨å¾ |
|---|
| | | loadEasyFlow() { |
|---|
| | | // åå§åèç¹ |
|---|
| | | for (var i = 0; i < this.data.nodeList.length; i++) { |
|---|
| | | let node = this.data.nodeList[i] |
|---|
| | | if (node.userId && node.userId != '') { |
|---|
| | | // userId为æ°å¼ç±»å |
|---|
| | | if (typeof node.userId == 'number'){ |
|---|
| | | node.userId = [node.userId] |
|---|
| | | } else { |
|---|
| | | node.userId = node.userId.split(',').map(Number); |
|---|
| | | } |
|---|
| | | } else { |
|---|
| | | node.userId = [] |
|---|
| | | } |
|---|
| | | // 设置æºç¹ï¼å¯ä»¥æåºçº¿è¿æ¥å
¶ä»èç¹ |
|---|
| | | this.jsPlumb.makeSource(node.id, lodash.merge(this.jsplumbSourceOptions, {})) |
|---|
| | | // // 设置ç®æ ç¹ï¼å
¶ä»æºç¹æåºç线å¯ä»¥è¿æ¥è¯¥èç¹ |
|---|
| | | this.jsPlumb.makeTarget(node.id, this.jsplumbTargetOptions) |
|---|
| | | if (!node.viewOnly && !this.disabled) { |
|---|
| | | this.jsPlumb.draggable(node.id, { |
|---|
| | | containment: 'parent', |
|---|
| | | stop: function (el) { |
|---|
| | | // ææ½èç¹ç»æåçå¯¹è° |
|---|
| | | console.log('ææ½ç»æ: ', el) |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | // åå§åè¿çº¿ |
|---|
| | | for (var i = 0; i < this.data.lineList.length; i++) { |
|---|
| | | let line = this.data.lineList[i] |
|---|
| | | var connParam = { |
|---|
| | | source: line.from, |
|---|
| | | target: line.to, |
|---|
| | | label: this.disabled ? null : (line.label ? line.label : 'x'), |
|---|
| | | connector: line.connector ? line.connector : '', |
|---|
| | | anchors: line.anchors ? line.anchors : undefined, |
|---|
| | | |
|---|
| | | paintStyle: line.paintStyle ? line.paintStyle : undefined, |
|---|
| | | } |
|---|
| | | this.jsPlumb.connect(connParam, this.jsplumbConnectOptions) |
|---|
| | | } |
|---|
| | | this.$nextTick(function () { |
|---|
| | | this.loadEasyFlowFinish = true |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // 设置è¿çº¿æ¡ä»¶ |
|---|
| | | setLineLabel(from, to, label) { |
|---|
| | | var conn = this.jsPlumb.getConnections({ |
|---|
| | | source: from, |
|---|
| | | target: to |
|---|
| | | })[0] |
|---|
| | | if (!label || label === '') { |
|---|
| | | conn.removeClass('flowLabel ') |
|---|
| | | conn.addClass('emptyFlowLabel') |
|---|
| | | } else { |
|---|
| | | conn.addClass('flowLabel') |
|---|
| | | } |
|---|
| | | conn.setLabel({ |
|---|
| | | label: 'x' //label, |
|---|
| | | }) |
|---|
| | | this.data.lineList.forEach(function (line) { |
|---|
| | | if (line.from == from && line.to == to) { |
|---|
| | | line.label = 'x'// label |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | |
|---|
| | | }, |
|---|
| | | // å é¤æ¿æ´»çå
ç´ |
|---|
| | | deleteElement() { |
|---|
| | | if (this.disabled) |
|---|
| | | return |
|---|
| | | if (this.activeElement.type === 'node') { |
|---|
| | | this.deleteNode(this.activeElement.nodeId) |
|---|
| | | } else if (this.activeElement.type === 'line') { |
|---|
| | | this.$confirm('ç¡®å®å é¤æç¹å»ç线å?', 'æ示', { |
|---|
| | | confirmButtonText: 'ç¡®å®', |
|---|
| | | cancelButtonText: 'åæ¶', |
|---|
| | | type: 'warning' |
|---|
| | | }).then(() => { |
|---|
| | | var conn = this.jsPlumb.getConnections({ |
|---|
| | | source: this.activeElement.sourceId, |
|---|
| | | target: this.activeElement.targetId |
|---|
| | | })[0] |
|---|
| | | this.jsPlumb.deleteConnection(conn) |
|---|
| | | }).catch(() => { |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | // å é¤çº¿ |
|---|
| | | deleteLine(from, to) { |
|---|
| | | this.data.lineList = this.data.lineList.filter(function (line) { |
|---|
| | | if (line.from == from && line.to == to) { |
|---|
| | | return false |
|---|
| | | } |
|---|
| | | return true |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | // æ¹åè¿çº¿ |
|---|
| | | changeLine(oldFrom, oldTo) { |
|---|
| | | this.deleteLine(oldFrom, oldTo) |
|---|
| | | }, |
|---|
| | | // æ¹åèç¹çä½ç½® |
|---|
| | | changeNodeSite(data) { |
|---|
| | | for (var i = 0; i < this.data.nodeList.length; i++) { |
|---|
| | | let node = this.data.nodeList[i] |
|---|
| | | if (node.id === data.nodeId) { |
|---|
| | | node.left = data.left |
|---|
| | | node.top = data.top |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | /** |
|---|
| | | * ææ½ç»æåæ·»å æ°çèç¹ |
|---|
| | | * @param evt |
|---|
| | | * @param nodeMenu 被添å çèç¹å¯¹è±¡ |
|---|
| | | * @param mousePosition é¼ æ ææ½ç»æçåæ |
|---|
| | | */ |
|---|
| | | addNode(evt, nodeMenu, mousePosition) { |
|---|
| | | if (nodeMenu.type == 'start' && this.data.nodeList.some(x => { return x.type == 'start' })) { |
|---|
| | | this.$message.error('ãæµç¨ç»æãèç¹å·²åå¨,åªæéæ©ä¸ä¸ªæµç¨å¼å§èç¹'); |
|---|
| | | return |
|---|
| | | } |
|---|
| | | if (nodeMenu.type == 'end' && this.data.nodeList.some(x => { return x.type == 'end' })) { |
|---|
| | | this.$message.error('ãæµç¨ç»æãèç¹å·²åå¨,åªæéæ©ä¸ä¸ªæµç¨å¼å§èç¹'); |
|---|
| | | return |
|---|
| | | } |
|---|
| | | var screenX = evt.originalEvent.clientX, screenY = evt.originalEvent.clientY |
|---|
| | | let efContainer = this.$refs.efContainer |
|---|
| | | var containerRect = efContainer.getBoundingClientRect() |
|---|
| | | var left = screenX, top = screenY |
|---|
| | | // 计ç®æ¯å¦æå
¥å°å®¹å¨ä¸ |
|---|
| | | if (left < containerRect.x || left > containerRect.width + containerRect.x || top < containerRect.y || containerRect.y > containerRect.y + containerRect.height) { |
|---|
| | | this.$message.error("请æèç¹æå
¥å°ç»å¸ä¸") |
|---|
| | | return |
|---|
| | | } |
|---|
| | | left = left - containerRect.x + efContainer.scrollLeft |
|---|
| | | top = top - containerRect.y + efContainer.scrollTop |
|---|
| | | // å±
ä¸ |
|---|
| | | left -= 85 |
|---|
| | | top -= 16 |
|---|
| | | var nodeId = this.getUUID() |
|---|
| | | // å¨æçæåå |
|---|
| | | var origName = nodeMenu.name |
|---|
| | | var nodeName = origName |
|---|
| | | var index = 1 |
|---|
| | | while (index < 10000) { |
|---|
| | | var repeat = false |
|---|
| | | for (var i = 0; i < this.data.nodeList.length; i++) { |
|---|
| | | let node = this.data.nodeList[i] |
|---|
| | | if (node.name === nodeName) { |
|---|
| | | nodeName = origName + index |
|---|
| | | repeat = true |
|---|
| | | } |
|---|
| | | } |
|---|
| | | if (repeat) { |
|---|
| | | index++ |
|---|
| | | continue |
|---|
| | | } |
|---|
| | | break |
|---|
| | | } |
|---|
| | | var node = { |
|---|
| | | id: nodeId, |
|---|
| | | name: nodeName, |
|---|
| | | type: nodeMenu.type, |
|---|
| | | left: left + 'px', |
|---|
| | | top: top + 'px', |
|---|
| | | ico: nodeMenu.ico, |
|---|
| | | state: 'success' |
|---|
| | | } |
|---|
| | | /** |
|---|
| | | * è¿éå¯ä»¥è¿è¡ä¸å¡å¤æãæ¯å¦è½å¤æ·»å 该èç¹ |
|---|
| | | */ |
|---|
| | | this.data.nodeList.push(node) |
|---|
| | | this.$nextTick(function () { |
|---|
| | | this.jsPlumb.makeSource(nodeId, this.jsplumbSourceOptions) |
|---|
| | | this.jsPlumb.makeTarget(nodeId, this.jsplumbTargetOptions) |
|---|
| | | this.jsPlumb.draggable(nodeId, { |
|---|
| | | containment: 'parent', |
|---|
| | | stop: function (el) { |
|---|
| | | // ææ½èç¹ç»æåçå¯¹è° |
|---|
| | | console.log('ææ½ç»æ: ', el) |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | /** |
|---|
| | | * å é¤èç¹ |
|---|
| | | * @param nodeId 被å é¤èç¹çID |
|---|
| | | */ |
|---|
| | | deleteNode(nodeId) { |
|---|
| | | this.$confirm('ç¡®å®è¦å é¤èç¹' + nodeId + '?', 'æ示', { |
|---|
| | | confirmButtonText: 'ç¡®å®', |
|---|
| | | cancelButtonText: 'åæ¶', |
|---|
| | | type: 'warning', |
|---|
| | | closeOnClickModal: false |
|---|
| | | }).then(() => { |
|---|
| | | /** |
|---|
| | | * è¿ééè¦è¿è¡ä¸å¡å¤æï¼æ¯å¦å¯ä»¥å é¤ |
|---|
| | | */ |
|---|
| | | this.data.nodeList = this.data.nodeList.filter(function (node) { |
|---|
| | | if (node.id === nodeId) { |
|---|
| | | // 伪å é¤ï¼å°èç¹éèï¼å¦åä¼å¯¼è´ä½ç½®éä½ |
|---|
| | | // node.show = false |
|---|
| | | return false |
|---|
| | | } |
|---|
| | | return true |
|---|
| | | }) |
|---|
| | | this.$nextTick(function () { |
|---|
| | | this.jsPlumb.removeAllEndpoints(nodeId); |
|---|
| | | }) |
|---|
| | | }).catch(() => { |
|---|
| | | }) |
|---|
| | | return true |
|---|
| | | }, |
|---|
| | | clickNode(nodeId) { |
|---|
| | | this.activeElement.type = 'node' |
|---|
| | | this.activeElement.nodeId = nodeId |
|---|
| | | this.$refs.nodeForm.nodeInit(this.data, nodeId, this.formFields.WorkTable) |
|---|
| | | }, |
|---|
| | | // æ¯å¦å
·æ该线 |
|---|
| | | hasLine(from, to) { |
|---|
| | | for (var i = 0; i < this.data.lineList.length; i++) { |
|---|
| | | var line = this.data.lineList[i] |
|---|
| | | if (line.from === from && line.to === to) { |
|---|
| | | return true |
|---|
| | | } |
|---|
| | | } |
|---|
| | | return false |
|---|
| | | }, |
|---|
| | | // æ¯å¦å«æç¸åç线 |
|---|
| | | hashOppositeLine(from, to) { |
|---|
| | | return this.hasLine(to, from) |
|---|
| | | }, |
|---|
| | | nodeRightMenu(nodeId, evt) { |
|---|
| | | this.menu.show = true |
|---|
| | | this.menu.curNodeId = nodeId |
|---|
| | | this.menu.left = evt.x + 'px' |
|---|
| | | this.menu.top = evt.y + 'px' |
|---|
| | | }, |
|---|
| | | repaintEverything(node) { |
|---|
| | | let _node = this.data.nodeList.find((x) => { |
|---|
| | | return x.id == node.id; |
|---|
| | | }); |
|---|
| | | Object.assign(_node, node); |
|---|
| | | console.log(_node); |
|---|
| | | this.jsPlumb.repaint(); |
|---|
| | | }, |
|---|
| | | // å è½½æµç¨å¾ |
|---|
| | | dataReload(data, isAdd) { |
|---|
| | | this.easyFlowVisible = false |
|---|
| | | this.data.nodeList = [] |
|---|
| | | this.data.lineList = [] |
|---|
| | | this.$nextTick(() => { |
|---|
| | | data = lodash.cloneDeep(data) |
|---|
| | | this.easyFlowVisible = true |
|---|
| | | this.data = data |
|---|
| | | this.$nextTick(() => { |
|---|
| | | this.jsPlumb = jsPlumb.getInstance() |
|---|
| | | this.$nextTick(() => { |
|---|
| | | this.jsPlumbInit() |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | this.formRules.forEach(options => { |
|---|
| | | options.forEach(option => { |
|---|
| | | if (option.field == "WorkTable") { |
|---|
| | | option.readonly = !isAdd; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | zoomAdd() { |
|---|
| | | if (this.zoom >= 1) { |
|---|
| | | return |
|---|
| | | } |
|---|
| | | this.zoom = this.zoom + 0.1 |
|---|
| | | this.$refs.efContainer.style.zoom = this.zoom; |
|---|
| | | // this.jsPlumb.setZoom(this.zoom) |
|---|
| | | }, |
|---|
| | | zoomSub() { |
|---|
| | | if (this.zoom <= 0) { |
|---|
| | | return |
|---|
| | | } |
|---|
| | | this.zoom = this.zoom - 0.1; |
|---|
| | | if (this.zoom < 0.3) { |
|---|
| | | this.zoom = 0.3; |
|---|
| | | } |
|---|
| | | this.$refs.efContainer.style.zoom = this.zoom; |
|---|
| | | // this.jsPlumb.setZoom(this.zoom) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | <style scoped lang="less"> |
|---|
| | | @import './index.css'; |
|---|
| | | |
|---|
| | | .flow-panel { |
|---|
| | | position: absolute; |
|---|
| | | height: 100%; |
|---|
| | | width: 100%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .flow-panel ::v-deep(.el-form-item__label) { |
|---|
| | | margin-bottom: -2px !important; |
|---|
| | | text-align: left; |
|---|
| | | padding: 0 !important; |
|---|
| | | justify-content: flex-start; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .flow-panel ::v-deep(.el-form-item) { |
|---|
| | | display: flex; |
|---|
| | | flex-direction: column; |
|---|
| | | margin-bottom: 7px !important; |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .ef-node-menu-form { |
|---|
| | | padding: 0px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | ::-webkit-scrollbar { |
|---|
| | | width: 0px; |
|---|
| | | height: 0px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | ::-webkit-scrollbar-thumb { |
|---|
| | | border-radius: 0px; |
|---|
| | | background: #e0e3e7; |
|---|
| | | height: 20px; |
|---|
| | | } |
|---|
| | | |
|---|
| | | ::-webkit-scrollbar-track { |
|---|
| | | background-color: transparent; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | // æ¯å¦å
·æ该线 |
|---|
| | | export function hasLine(data, from, to) { |
|---|
| | | for (let i = 0; i < data.lineList.length; i++) { |
|---|
| | | let line = data.lineList[i] |
|---|
| | | if (line.from === from && line.to === to) { |
|---|
| | | return true |
|---|
| | | } |
|---|
| | | } |
|---|
| | | return false |
|---|
| | | } |
|---|
| | | |
|---|
| | | // æ¯å¦å«æç¸åç线 |
|---|
| | | export function hashOppositeLine(data, from, to) { |
|---|
| | | return hasLine(data, to, from) |
|---|
| | | } |
|---|
| | | |
|---|
| | | // è·åè¿çº¿ |
|---|
| | | export function getConnector(jsp, from, to) { |
|---|
| | | let connection = jsp.getConnections({ |
|---|
| | | source: from, |
|---|
| | | target: to |
|---|
| | | })[0] |
|---|
| | | return connection |
|---|
| | | } |
|---|
| | | |
|---|
| | | // è·åå¯ä¸æ è¯ |
|---|
| | | export function uuid() { |
|---|
| | | return Math.random().toString(36).substr(3, 10) |
|---|
| | | } |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | |
|---|
| | | import gridHeader from './App_Expert/App_ExpertGridHeader' |
|---|
| | | |
|---|
| | | //èªå®ä¹éæ©æ°æ®æºé¡µé¢ |
|---|
| | | import App_ExpertModelBody from './App_Expert/App_ExpertModelBody' |
|---|
| | | import { h, resolveComponent } from 'vue'; |
|---|
| | | //声ævue对象 |
|---|
| | | let $this; |
|---|
| | | let extension = { |
|---|
| | | components: { |
|---|
| | | gridHeader: gridHeader, |
|---|
| | | gridBody: { |
|---|
| | | render() { |
|---|
| | | return h(resolveComponent('ElAlert'), { |
|---|
| | | style: { 'margin-bottom': '12px' }, |
|---|
| | | 'show-icon': true, |
|---|
| | | closable: false, |
|---|
| | | }, [h('p', {}, '1ãå¤ä¸ªå¼¹åºæ¡ï¼æå¨å建ä¸ä¸ªé¡µé¢,æ¥çå¨è¡¨å¯¹åºçjsæ件ä¸å¼å
¥é¡µé¢æ¾å°gridHeaderä¸'), |
|---|
| | | h('p', {}, ' 2ãå¨æå¨å建ç页é¢ä¸ï¼å¯ä»¥åä»»æ代ç ,å¨jsä¸éè¿this.$refs.gridHeader.xxå³å¯è®¿é®é¡µé¢çå
容,å
·ä½è§:App_Expert.jsãApp_ExpertGridHeader.vue')]); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | gridFooter: '', |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: App_ExpertModelBody, //å°éæ©æ°æ®æºé¡µé¢App_ExpertModelBody注åå°å¼¹åºæ¡ä¸ |
|---|
| | | modelFooter: '' |
|---|
| | | }, //å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | buttons: { |
|---|
| | | view: [{ |
|---|
| | | name: "å¼¹åºæ¡1", |
|---|
| | | icon: 'md-add', |
|---|
| | | index: 1,//æ·»å å°ç¬¬ä¸ä¸ªæé®åé¢ |
|---|
| | | type: 'primary', |
|---|
| | | onClick: function () { |
|---|
| | | $this.$refs.gridHeader.open1() |
|---|
| | | } |
|---|
| | | }] |
|---|
| | | }, |
|---|
| | | |
|---|
| | | methods: { //äºä»¶æ©å± |
|---|
| | | click1(){ |
|---|
| | | this.$message.success('ç¹å»äºæ示') |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | $this = this; |
|---|
| | | //æå¨è°åº¦å¼¹åºæ¡çé«åº¦ |
|---|
| | | this.boxOptions.height = this.boxOptions.height + 90; |
|---|
| | | //æå¨è®¾ç½®è¡¨é«åº¦èªå¨éåº |
|---|
| | | this.height = this.height - 100; |
|---|
| | | }, |
|---|
| | | onInit() { |
|---|
| | | |
|---|
| | | this.editFormOptions.forEach(x => { |
|---|
| | | x.forEach(item => { |
|---|
| | | if (item.field == 'HeadImageUrl') { |
|---|
| | | |
|---|
| | | //éæ©æä»¶æ¶ |
|---|
| | | item.onChange=(files)=>{ |
|---|
| | | console.log('éæ©æ件äºä»¶') |
|---|
| | | //æ¤å¤ä¸è¿åtrueï¼ä¼ä¸æ代ç æ§è¡ |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | //ä¸ä¼ å |
|---|
| | | item.uploadBefore=(files)=>{ |
|---|
| | | console.log('ä¸ä¼ å') |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | //ä¸ä¼ å |
|---|
| | | item.uploadAfter=(files)=>{ |
|---|
| | | console.log('ä¸ä¼ å') |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | |
|---|
| | | //éæ©æ°æ®æºåè½ |
|---|
| | | this.editFormOptions.forEach(x => { |
|---|
| | | x.forEach(item => { |
|---|
| | | if (item.field == 'ReallyName') { |
|---|
| | | //ç»ç¼è¾è¡¨å设置[éæ©æ°æ®]æä½,extraå
·ä½é
ç½®è§volformç»ä»¶api |
|---|
| | | item.extra = { |
|---|
| | | icon: "el-icon-zoom-out", |
|---|
| | | text: "éæ©æ°æ®", |
|---|
| | | style: "color:#2196F3;font-size: 12px;cursor: pointer;", |
|---|
| | | click: item => { |
|---|
| | | this.$refs.modelBody.openDemo(); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | |
|---|
| | | |
|---|
| | | //设置ä¿åå继ç»æ·»å ï¼ä¸å
³éå½åçªå£ |
|---|
| | | //2021.04.11éè¦æ´æ°methods.js,ViewGrid.vue |
|---|
| | | this.continueAdd = true; |
|---|
| | | this.continueAddName = "è¿ç»æ·»å "; |
|---|
| | | |
|---|
| | | //å°ç¼è¾è¡¨å第ä¸è¡ç¬¬ä¸åãå称ãå段添å ä¸ä¸ªé¢å¤æ示å±æ§ |
|---|
| | | this.editFormOptions[0][0].extra = |
|---|
| | | { |
|---|
| | | render: (h) => { |
|---|
| | | return <el-popover |
|---|
| | | placement="top-start" |
|---|
| | | title="Title" |
|---|
| | | width="200" |
|---|
| | | trigger="hover" |
|---|
| | | content="this is content, this is content, this is content" |
|---|
| | | > |
|---|
| | | {/* è¿é对åºä¸é¢ç#referenceæ°æ®æ§½ */} |
|---|
| | | {{ reference: ()=>{return <i onClick={()=>{this.click1()}} class='el-icon-warning-outline'></i>} }} |
|---|
| | | </el-popover> |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | //设置çé¢ä¸æå¤å¯æ¾ç¤ºçæé®æ°é |
|---|
| | | this.maxBtnLength = 6; |
|---|
| | | |
|---|
| | | // 第2个弹åºæ¡æä½ |
|---|
| | | this.buttons.splice(2, 0, ...[{ |
|---|
| | | name: "å¼¹åºæ¡2", |
|---|
| | | icon: 'md-add', |
|---|
| | | type: 'success', |
|---|
| | | onClick: function () { |
|---|
| | | $this.$refs.gridHeader.open2() |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | name: "è·ååç»ä»¶å¯¹è±¡", |
|---|
| | | icon: 'md-add', |
|---|
| | | type: 'warning', |
|---|
| | | onClick: function () { |
|---|
| | | this.$Message.info(this.$refs.gridHeader.getTestData()) |
|---|
| | | } |
|---|
| | | }]) |
|---|
| | | |
|---|
| | | |
|---|
| | | // 第3个弹åºæ¡æä½ |
|---|
| | | this.columns.forEach(x => { |
|---|
| | | if (x.field == "Resume") { |
|---|
| | | x.formatter = (row, column, event) => { |
|---|
| | | return '<a style="color:#2a92ff;cursor: pointer;">(å¼¹åºæ¡3)' + row.Resume + '</a>' |
|---|
| | | }; |
|---|
| | | //ç»å®ç¹å»äºä»¶ |
|---|
| | | x.click = (row, column, event) => { |
|---|
| | | $this.$refs.gridHeader.open3(row) |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | |
|---|
| | | //å¯ç¨å¤å¾ä¸ä¼ ,å
¶ä»ä¸ä¼ åæ°ï¼åç
§voluploadç»ä»¶api |
|---|
| | | this.editFormOptions.forEach(x => { |
|---|
| | | x.forEach(item => { |
|---|
| | | if (item.field == 'HeadImageUrl') { |
|---|
| | | //item.type = 'file'; |
|---|
| | | //设置æ100%宽度 |
|---|
| | | item.colSize = 12; |
|---|
| | | item.multiple = true; |
|---|
| | | //æå¤å¯ä»¥ä¸ä¼ 3å¼ ç
§ç |
|---|
| | | item.maxFile = 3; |
|---|
| | | //éå¶å¾ç大å°ï¼é»è®¤3M |
|---|
| | | item.maxSize = 3; |
|---|
| | | // item.append = true; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | |
|---|
| | | // //å¨ææ·»å ä¸è¡è¡¨åé
ç½® |
|---|
| | | // this.editFormOptions[2].splice(0, 1, ...[ |
|---|
| | | // { |
|---|
| | | // colSize: 12, |
|---|
| | | // render: (h) => { |
|---|
| | | // return <el-alert title="è¿éæ¯èªå®çæ示信æ¯" style={{ padding:0 }} type="success" > |
|---|
| | | // </el-alert> |
|---|
| | | // } |
|---|
| | | // } |
|---|
| | | // ]) |
|---|
| | | |
|---|
| | | }, |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div> |
|---|
| | | <vol-box :lazy="true" |
|---|
| | | v-model="model.box1" |
|---|
| | | title="å¼¹åºæ¡1" |
|---|
| | | :height="400" |
|---|
| | | :width="700" |
|---|
| | | :padding="15"> |
|---|
| | | <div>å¼¹åºæ¡1 |
|---|
| | | <el-button type="primary" |
|---|
| | | size="mini" |
|---|
| | | @click="getParent">è·åç¶ç»ä»¶å¯¹è±¡</el-button> |
|---|
| | | <p>éè¿ this.$emit("parentCall", $vue => {})å¯ä»¥è®¿é®ç¶ç»ä»¶ViewGirdä¸çä»»ä½å±æ§ã对象ãæ¹æ³</p> |
|---|
| | | <p>{{model.box1Text}}</p> |
|---|
| | | </div> |
|---|
| | | </vol-box> |
|---|
| | | |
|---|
| | | <!-- å¼¹åºæ¡2 --> |
|---|
| | | <vol-box :lazy="true" |
|---|
| | | v-model="model.box2" |
|---|
| | | title="å¼¹åºæ¡2" |
|---|
| | | :height="420" |
|---|
| | | :width="900" |
|---|
| | | :padding="10"> |
|---|
| | | <div> |
|---|
| | | <el-tabs type="border-card" |
|---|
| | | style="height: 358px;"> |
|---|
| | | <el-tab-pane> |
|---|
| | | <template #label> <span ><i class="el-icon-date"></i> æçè¡ç¨</span></template> |
|---|
| | | |
|---|
| | | æçè¡ç¨ |
|---|
| | | </el-tab-pane> |
|---|
| | | <el-tab-pane :lazy="true" |
|---|
| | | label="æ¶æ¯ä¸å¿">æ¶æ¯ä¸å¿</el-tab-pane> |
|---|
| | | <el-tab-pane :lazy="true" |
|---|
| | | label="è§è²ç®¡ç">è§è²ç®¡ç</el-tab-pane> |
|---|
| | | <el-tab-pane :lazy="true" |
|---|
| | | label="å®æ¶ä»»å¡è¡¥å¿">å®æ¶ä»»å¡è¡¥å¿</el-tab-pane> |
|---|
| | | </el-tabs> |
|---|
| | | |
|---|
| | | </div> |
|---|
| | | </vol-box> |
|---|
| | | |
|---|
| | | <!-- å¼¹åºæ¡3 --> |
|---|
| | | <vol-box :lazy="true" |
|---|
| | | v-model="model.box3" |
|---|
| | | title="å¼¹åºæ¡3" |
|---|
| | | :height="400" |
|---|
| | | :width="700" |
|---|
| | | :padding="15"> |
|---|
| | | <div>å½åæä½çè¡æ°æ®{{JSON.stringify(model.box3Row)}}</div> |
|---|
| | | <template #footer> |
|---|
| | | <div > |
|---|
| | | <el-button type="primary" |
|---|
| | | size="mini" |
|---|
| | | @click="$Message.error('ç¹å»ç¡®è®¤')">确认</el-button> |
|---|
| | | <el-button type="default" |
|---|
| | | size="mini" |
|---|
| | | @click="model.box3=false">ç¹å»å
³éå¼¹åºæ¡</el-button> |
|---|
| | | </div></template> |
|---|
| | | </vol-box> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import VolBox from "@/components/basic/VolBox.vue"; |
|---|
| | | export default { |
|---|
| | | components: { "vol-box": VolBox }, |
|---|
| | | methods: {}, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | model: { |
|---|
| | | box1Text: "", |
|---|
| | | box1: false, |
|---|
| | | box1Text: "", |
|---|
| | | box2: false, |
|---|
| | | box3: false, |
|---|
| | | box3Row: {}, |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | getParent() { |
|---|
| | | this.$emit("parentCall", ($vue) => { |
|---|
| | | this.model.box1Text = JSON.stringify($vue.buttons); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | getTestData() { |
|---|
| | | return "è¿éæ¯è·åå°çåç»ä»¶å¯¹è±¡" + JSON.stringify(this.model); |
|---|
| | | }, |
|---|
| | | //å¼¹åºæ¡1 |
|---|
| | | open1() { |
|---|
| | | this.model.box1 = true; |
|---|
| | | }, |
|---|
| | | //å¼¹åºæ¡2 |
|---|
| | | open2() { |
|---|
| | | this.model.box2 = true; |
|---|
| | | }, |
|---|
| | | //å¼¹åºæ¡3 |
|---|
| | | open3(row) { |
|---|
| | | this.model.box3Row = row; |
|---|
| | | this.model.box3 = true; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <VolBox v-model="model" :lazy="true" title="éæ©æ°æ®" :height="450" :width="800" :padding="15"> |
|---|
| | | <!-- 设置æ¥è¯¢æ¡ä»¶ --> |
|---|
| | | <div style="padding-bottom: 10px"> |
|---|
| | | <span style="margin-right: 20px">请éæ©æ°æ®</span> |
|---|
| | | <el-input placeholder="å称" style="width: 200px" v-model="expertName" /> |
|---|
| | | <el-button type="primary" style="margin-left:10px" size="small" icon="Search" @click="search">æç´¢</el-button> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | <!-- vol-tableé
ç½®çè¿äºå±æ§è§VolTableç»ä»¶apiæ件 --> |
|---|
| | | <vol-table ref="mytable" :loadKey="true" :columns="columns" :pagination="pagination" :pagination-hide="false" |
|---|
| | | :max-height="380" :url="url" :index="true" :single="true" :defaultLoadPage="defaultLoadPage" |
|---|
| | | @loadBefore="loadTableBefore" @loadAfter="loadTableAfter"></vol-table> |
|---|
| | | <!-- 设置弹åºæ¡çæä½æé® --> |
|---|
| | | <template #footer> |
|---|
| | | <div> |
|---|
| | | <el-button size="small" type="primary" icon="el-icon-plus" @click="addRow()">æ·»å éæ©çæ°æ®</el-button> |
|---|
| | | <el-button size="mini" icon="Close" @click="model = false">å
³é</el-button> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </VolBox> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import VolBox from "@/components/basic/VolBox.vue"; |
|---|
| | | import VolTable from "@/components/basic/VolTable.vue"; |
|---|
| | | export default { |
|---|
| | | components: { |
|---|
| | | VolBox: VolBox, |
|---|
| | | VolTable: VolTable, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | model: false, |
|---|
| | | defaultLoadPage: false, //第ä¸æ¬¡æå¼æ¶ä¸å è½½tableæ°æ®ï¼openDemoæå¨è°ç¨æ¥è¯¢tableæ°æ® |
|---|
| | | expertName: "", //æ¥è¯¢æ¡ä»¶å段 |
|---|
| | | url: "api/App_Expert/getSelectorDemo",//å è½½æ°æ®çæ¥å£ |
|---|
| | | columns: [ |
|---|
| | | { field: "expertId", title: "主é®id", width: 90, hidden: true }, |
|---|
| | | { field: "expertName", title: "å称", width: 120 }, |
|---|
| | | { field: "headImageUrl", type: "img", title: "头å", width: 120 }, |
|---|
| | | { field: "resume", title: "ç®ä»", width: 90 }, |
|---|
| | | { |
|---|
| | | field: "enable", |
|---|
| | | title: "æ¯å¦å¯ç¨", |
|---|
| | | bind: { key: "enable", data: [] }, |
|---|
| | | width: 110, |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | pagination: {}, //å页é
ç½®ï¼è§voltableç»ä»¶api |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | openDemo(row) { |
|---|
| | | this.model = true; |
|---|
| | | //æå¼å¼¹åºæ¡æ¶ï¼å è½½tableæ°æ® |
|---|
| | | |
|---|
| | | this.$refs.mytable && this.$refs.mytable.load(); |
|---|
| | | |
|---|
| | | }, |
|---|
| | | search() { |
|---|
| | | //ç¹å»æç´¢ |
|---|
| | | this.$refs.mytable.load(); |
|---|
| | | }, |
|---|
| | | addRow() { |
|---|
| | | var rows = this.$refs.mytable.getSelected(); |
|---|
| | | if (!rows || rows.length == 0) { |
|---|
| | | return this.$message.error("请éæ©è¡æ°æ®"); |
|---|
| | | } |
|---|
| | | //ååæ°æ®å°è¡¨å |
|---|
| | | this.$emit("parentCall", ($parent) => { |
|---|
| | | //å°éæ©çæ°æ®å并å°è¡¨åä¸(注ææ¡æ¶çæç代ç é½æ¯å¤§åï¼åå°èªå·±åçæ¥å£æ¯å°åç) |
|---|
| | | $parent.editFormFields.ExpertId = rows[0].expertId; |
|---|
| | | $parent.editFormFields.ExpertName = rows[0].expertName; |
|---|
| | | $parent.editFormFields.HeadImageUrl = rows[0].headImageUrl; |
|---|
| | | $parent.editFormFields.Resume = rows[0].resume; |
|---|
| | | $parent.editFormFields.Enable = rows[0].enable + ""; //enableæ¯æ°åç±»åï¼æ¡æ¶ç»å®ä¸ææ¡çæ¶åè¦è½¬æ¢æå符串 |
|---|
| | | }); |
|---|
| | | //å
³éå½åçªå£ |
|---|
| | | this.model = false; |
|---|
| | | }, |
|---|
| | | //è¿éæ¯ä»apiæ¥è¯¢åè¿åæ°æ®çæ¹æ³ |
|---|
| | | loadTableAfter(row) { }, |
|---|
| | | loadTableBefore(params) { |
|---|
| | | //æ¥è¯¢åï¼è®¾ç½®æ¥è¯¢æ¡ä»¶ |
|---|
| | | if (this.expertName) { |
|---|
| | | params.wheres = [{ name: "expertName", value: this.expertName }]; |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | |
|---|
| | | |
|---|
| | | import { h, resolveComponent } from 'vue'; |
|---|
| | | let extension = { |
|---|
| | | components: { |
|---|
| | | gridHeader: ``, |
|---|
| | | gridBody: { |
|---|
| | | render() { |
|---|
| | | return [ |
|---|
| | | h(resolveComponent('el-alert'), { |
|---|
| | | style: { 'margin-bottom': '12px' }, |
|---|
| | | 'show-icon': true, type: 'warning', |
|---|
| | | closable: false, title: 'å¤ætableå
容ï¼éç¨äºtableåè¾å¤çæ
åµå¯ä»¥å°åå并å¨ä¸èµ·æ¾ç¤º(代ç çæåï¼å¨å¯¹åºjsæ件ä¸è®¾ç½®å并æ¾ç¤ºä¿¡æ¯),åªéå è¡ä»£ç å³å¯å®ç°,è§:App_Expert2.js' |
|---|
| | | }, ''), |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | gridFooter: '', |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, //å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | buttons: { |
|---|
| | | view: [] |
|---|
| | | }, |
|---|
| | | methods: { //äºä»¶æ©å± |
|---|
| | | onInit() { |
|---|
| | | |
|---|
| | | this.buttons.push({ |
|---|
| | | name: 'æ¥ç代ç ', |
|---|
| | | onClick: () => { |
|---|
| | | window.open('http://api.volcore.xyz/vol.doc/appexpert2.html', 'blank'); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | |
|---|
| | | |
|---|
| | | //设置ååå
æ ¼å并 |
|---|
| | | this.initFirstColumn(); |
|---|
| | | //å¨ææ·»å ãç¶æãå |
|---|
| | | this.initColor(); |
|---|
| | | //å¨è¡¨æåæ·»å æä½å |
|---|
| | | this.initColumnButton(); |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | //æå¨è°æ´çé¢è¡¨é«åº¦ |
|---|
| | | this.height = this.height - 50; |
|---|
| | | this.boxOptions.height = this.boxOptions.height + 40; |
|---|
| | | }, |
|---|
| | | initColor() { |
|---|
| | | var _index = this.columns.findIndex(x => { return x.field == "Enable" }); |
|---|
| | | if (_index == -1) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | //å¨ææ·»å ä¸åãç¶æã |
|---|
| | | this.columns.splice(_index, 1, { |
|---|
| | | title: "ç¶æ", |
|---|
| | | field: "ç¶æ", |
|---|
| | | with: 60, |
|---|
| | | formatter: (row) => { |
|---|
| | | var _color = row.Enable == 1 ? '#ff1212' : '#04c966'; |
|---|
| | | return "<span style='background:" + _color + ";width: 8px; height: 8px; position: absolute; border-radius: 50%; margin-left: 7px;'> </span>" |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | initFirstColumn() { |
|---|
| | | //å¨ç¬¬ä¸è¡åé¢å¨ææ·»å ä¸è¡ |
|---|
| | | this.columns.splice(1, 0, { |
|---|
| | | title: "ç¨æ·ä¿¡æ¯", |
|---|
| | | field: "ç¨æ·ä¿¡æ¯", |
|---|
| | | width: 220, |
|---|
| | | render: (h, { row, column, index }) => { |
|---|
| | | //ä¸é¢ææéè¦æ¾ç¤ºçä¿¡æ¯é½ä»rowéé¢ååºæ¥ |
|---|
| | | return h( |
|---|
| | | "div", |
|---|
| | | { |
|---|
| | | style: { display: "flex", cursor: 'pointer', }, |
|---|
| | | }, |
|---|
| | | [ |
|---|
| | | h( |
|---|
| | | "img", |
|---|
| | | { |
|---|
| | | src: this.http.ipAddress + row.HeadImageUrl, |
|---|
| | | style: { "width": "70px", height: "90px", "object-fit": "cover" }, |
|---|
| | | }, |
|---|
| | | ), |
|---|
| | | h( |
|---|
| | | "div", |
|---|
| | | { |
|---|
| | | props: {}, |
|---|
| | | style: { "margin-left": "15px" }, |
|---|
| | | }, |
|---|
| | | [ |
|---|
| | | h("div", { style: { "font-size": "12px", "color": "#459fff", "margin-bottom": "8px", "font-weight": "bold" } }, |
|---|
| | | [h("span", {}, row.ReallyName), |
|---|
| | | h("span", { style: { "margin-left": "20px" } }, row.Enable == "1" ? 'å¨çº¿' : "离线")] |
|---|
| | | ), |
|---|
| | | h("div", { style: { "font-size": "12px", "color": "#459fff", 'line-height': '20px' } }, row.IDNumber || 'æ 身份è¯ä¿¡æ¯'), |
|---|
| | | h("div", { style: { "font-size": "12px", "color": "#459fff", 'line-height': '20px' } }, "çµè¯ï¼" + row.PhoneNo), |
|---|
| | | h("div", { style: { "font-size": "12px", "color": "#459fff", 'line-height': '20px' } }, "åå¸ï¼" + row.City), |
|---|
| | | ] |
|---|
| | | )]) |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | initColumnButton() { |
|---|
| | | //å¨è¡¨æåæ·»å æä½å |
|---|
| | | this.columns.push({ |
|---|
| | | title: 'æä½', |
|---|
| | | fixed: 'right', |
|---|
| | | align: "center", |
|---|
| | | width: 130, |
|---|
| | | render: (h, { row, column, index }) => { |
|---|
| | | return h( |
|---|
| | | "div", { style: { cursor: 'pointer' } }, [ |
|---|
| | | h( |
|---|
| | | resolveComponent("el-button"), { |
|---|
| | | style: { padding: '0 7px' }, |
|---|
| | | type: "danger", |
|---|
| | | plain: true, |
|---|
| | | size: 'mini', |
|---|
| | | onClick: (e) => { |
|---|
| | | e.stopPropagation() |
|---|
| | | this.del([row]); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | [h('i', { class: 'el-icon-delete' }, 'å é¤')] |
|---|
| | | ), |
|---|
| | | h( |
|---|
| | | resolveComponent("el-button"), { |
|---|
| | | style: { padding: '0 7px' }, |
|---|
| | | type: "primary", |
|---|
| | | plain: true, |
|---|
| | | size: 'mini', |
|---|
| | | onClick: (e) => { |
|---|
| | | e.stopPropagation() |
|---|
| | | this.linkData(row); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | [h('i', { class: 'el-icon-edit' }, 'ä¿®æ¹')] |
|---|
| | | ), |
|---|
| | | ]) |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | import gridHeader from './App_News/App_NewGirdHeader' |
|---|
| | | |
|---|
| | | import { h, resolveComponent } from 'vue'; |
|---|
| | | let extension = { |
|---|
| | | components: {//å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | gridHeader: gridHeader, |
|---|
| | | gridBody: { |
|---|
| | | render() { |
|---|
| | | return [ |
|---|
| | | h(resolveComponent('el-alert'), { |
|---|
| | | style: { 'margin-bottom': '12px' }, |
|---|
| | | 'show-icon': true, type: 'warning', |
|---|
| | | closable: false, title: 'åå¸éæ页é¢ã页é¢é¢è§è§:App_News.js' |
|---|
| | | }, ''), |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | gridFooter: '', |
|---|
| | | modelHeader: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | text: "éææ件没ææ交å°githubï¼æ¬å°éæ°çæä¸éæ页é¢ä¸è®¾ç½®å°é¢å³å¯é¢è§", |
|---|
| | | buttons: { |
|---|
| | | view: [//ViewGridæ¥è¯¢çé¢æ©å±çæé® |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | initButton() { |
|---|
| | | //å½åç¨æ·æ¯å¦æç¼è¾ææ°å»ºæé |
|---|
| | | if (this.currentReadonly) { return; } |
|---|
| | | |
|---|
| | | this.buttons.splice(2, 0, { |
|---|
| | | name: "设置å°é¢", icon: 'el-icon-picture', value: 'Edit', type: 'primary', |
|---|
| | | onClick: function () { this.setCover(); } |
|---|
| | | }) |
|---|
| | | //æ·»å å¼¹åºæ¡çæéæ页é¢çæé® |
|---|
| | | this.boxButtons.splice(0, 0, ...[{ |
|---|
| | | name: "çæéæ页é¢", icon: 'el-icon-tickets', type: 'primary', |
|---|
| | | onClick: function () { this.publish(); } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | name: "é¢è§é¡µé¢", icon: 'el-icon-view', type: 'primary', |
|---|
| | | onClick: function () { |
|---|
| | | if (!this.currentRow |
|---|
| | | || !this.currentRow.Content |
|---|
| | | || !this.currentRow.DetailUrl) { |
|---|
| | | return this.$Message.error("请å
ãä¿åã,åç¹å»ãçæéæ页é¢ã") |
|---|
| | | } |
|---|
| | | this.preview(this.currentRow); |
|---|
| | | } |
|---|
| | | }]) |
|---|
| | | }, |
|---|
| | | onInit() { //åå§åé¢è§ä¸å¼¹åºæ¡å¤§å° |
|---|
| | | //è®¾ç½®è¡¨æ ¼å
容è¶
åºæ¢è¡ |
|---|
| | | this.textInline=false; |
|---|
| | | //æ ¹æ®ç¨æ·æéåå§åæé® |
|---|
| | | this.initButton(); |
|---|
| | | //设置ä¿åæååï¼ä¸å
³éå¼¹åºæ¡ |
|---|
| | | this.boxOptions.saveClose = false; |
|---|
| | | //设置æ¥è¯¢è¡¨æ ¼åªè½åé |
|---|
| | | this.single = true; |
|---|
| | | |
|---|
| | | //设置tableè¡¨æ ¼DetailUrlå段ç¹å»é¢è§éæé¡µé¢ |
|---|
| | | this.editFormOptions.forEach(x => { |
|---|
| | | x.forEach(item => { |
|---|
| | | this.columns.forEach(item => { |
|---|
| | | //设置urlç¹å»äºä»¶ |
|---|
| | | if (item.field == 'DetailUrl') { |
|---|
| | | item.title = "页é¢é¢è§"; |
|---|
| | | item.formatter = (row) => { return '<a>é¢è§</a>' } |
|---|
| | | item.click = (row, column, event) => { |
|---|
| | | this.preview(row); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | onInited(){ |
|---|
| | | this.height = this.height - 50; |
|---|
| | | }, |
|---|
| | | addBefore(formData) {//æ°å»ºåéªè¯ |
|---|
| | | return this.validContent(formData); |
|---|
| | | }, |
|---|
| | | updateBefore(formData) { //ä¿®æ¹åéªè¯ |
|---|
| | | return this.validContent(formData); |
|---|
| | | }, |
|---|
| | | validContent(formData) { |
|---|
| | | if (!this.editFormFields.Content) { |
|---|
| | | this.$Message.error("请ç¼è¾è¦åå¸çå
容"); |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | preview(row) { //é¢è§htmlé¡µé¢ |
|---|
| | | if (!row.DetailUrl || row.DetailUrl.indexOf('.html') == -1 || !this.base.isUrl(this.http.ipAddress + row.DetailUrl)) { |
|---|
| | | return this.$Message.error("请å
åå¸éæ页é¢") |
|---|
| | | } |
|---|
| | | window.open(this.http.ipAddress + row.DetailUrl + '?r=' + Math.random()); |
|---|
| | | }, |
|---|
| | | publish() { //çæéæé¡µé¢ |
|---|
| | | if (!this.currentRow || !this.currentRow[this.table.key]) { |
|---|
| | | return this.$Message.error("请å
ä¿åæ°æ®") |
|---|
| | | } |
|---|
| | | if (!this.currentRow.Content) { |
|---|
| | | return this.$Message.error("请ç¼è¾è¦åå¸çå
容") |
|---|
| | | } |
|---|
| | | this.http.post("api/news/createPage", this.currentRow).then(x => { |
|---|
| | | if (x.status) { |
|---|
| | | // this.editFormFields.DetailUrl = x.data.url; |
|---|
| | | this.currentRow.DetailUrl = x.data.url; |
|---|
| | | } |
|---|
| | | this.refresh(); |
|---|
| | | return this.$Message.info(x.message) |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | setCover() { //设置å°é¢å¾ç |
|---|
| | | let rows = this.getSelectRows(); |
|---|
| | | if (rows.length == 0) { |
|---|
| | | return this.$Message.error("请éä¸è¦è®¾ç½®å°é¢çè¡") |
|---|
| | | } |
|---|
| | | //设置å°é¢å¾çï¼å
è·åå½åå·²ç»å¾çfileInfoæ ¼å¼è§volupdateç»ä»¶åæ°è¯´æ |
|---|
| | | let fileInfo = this.getFilePath(rows[0].ImageUrl) || []; |
|---|
| | | this.$refs.gridHeader.open(fileInfo) |
|---|
| | | }, |
|---|
| | | getFilePath(pathSring) {//æåurl并åå§åå¾çå°ä¸ä¼ ç»ä»¶ä¸ |
|---|
| | | //è·å表çå¾çä¸æ件æ¾ç¤º |
|---|
| | | if (!pathSring) return ""; |
|---|
| | | let fileInfo = [], filePath = pathSring.replace(/\\/g, "/").split(","); |
|---|
| | | for (let index = 0; index < filePath.length; index++) { |
|---|
| | | let file = filePath[index]; |
|---|
| | | if (file.indexOf(".") == -1) { continue; } |
|---|
| | | let splitFile = file.split("/"); |
|---|
| | | if (splitFile.length == 0) { continue; } |
|---|
| | | fileInfo.push({ |
|---|
| | | name: splitFile[splitFile.length - 1], |
|---|
| | | path: this.base.isUrl(file) ? file : this.http.ipAddress + file |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | return fileInfo; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | |
|---|
| | | <VolBox |
|---|
| | | v-model="model" |
|---|
| | | title="å°é¢å¾ç设置" |
|---|
| | | :height="230" |
|---|
| | | :width="520" |
|---|
| | | :lazy="true" |
|---|
| | | :padding="15" |
|---|
| | | > |
|---|
| | | <VolUpload |
|---|
| | | style="text-align: center; border: 1px dotted #FF9800;padding: 20px;" |
|---|
| | | :autoUpload="false" |
|---|
| | | :multiple="true" |
|---|
| | | :url="url" |
|---|
| | | :max-file="3" |
|---|
| | | :img="true" |
|---|
| | | :fileInfo="fileInfo" |
|---|
| | | :upload-after="uploadAfter" |
|---|
| | | > |
|---|
| | | <div>å¯éæ©1-3å¼ å¾ç设置为å°é¢å¾</div> |
|---|
| | | </VolUpload> |
|---|
| | | </VolBox> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import VolBox from "@/components/basic/VolBox.vue"; |
|---|
| | | import {defineComponent,defineAsyncComponent,ref} from "vue" |
|---|
| | | export default defineComponent({ |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | url: "api/app_news/upload", |
|---|
| | | fileInfo: [], |
|---|
| | | model: false, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | components: { |
|---|
| | | VolBox: VolBox, |
|---|
| | | VolUpload:defineAsyncComponent( () => import("@/components/basic/VolUpload.vue")) |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | open(fileInfo) { |
|---|
| | | this.model = true; |
|---|
| | | this.fileInfo = fileInfo; |
|---|
| | | }, |
|---|
| | | //å°é¢å¾çä¸ä¼ å®æåï¼å°å¾ççè·¯å¾æ´æ°å°è¡¨ä¸ |
|---|
| | | uploadAfter(result, files) { |
|---|
| | | if (!result.status) { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | //ä¸ä¼ å®æåï¼ä¿åæ¯ä¸ªå¾çæåå¨çæä»¶è·¯å¾ |
|---|
| | | let fileUrls = files.map((x) => { |
|---|
| | | //2021.09.25ä¿®å¤ç¤ºä¾ä¸ä¼ è·¯å¾é»è¾é误çé®é¢ |
|---|
| | | if (x.path) { |
|---|
| | | return x.path; |
|---|
| | | } |
|---|
| | | return result.data + x.name; |
|---|
| | | }); |
|---|
| | | let data = { imageUrl: fileUrls.join(",") }; |
|---|
| | | //ç¶ç»ä»¶vue对象(æ¥è¯¢çé¢) |
|---|
| | | let $parentVue; |
|---|
| | | //è·åç¶ç»ä»¶å½åéä¸è¡çidç¨äºåå°æ´æ° |
|---|
| | | this.$emit("parentCall", ($vue) => { |
|---|
| | | $parentVue = $vue; |
|---|
| | | data.Id = $vue.getSelectRows()[0].Id; |
|---|
| | | }); |
|---|
| | | this.http |
|---|
| | | .post("api/news/setCover", data, "æ£å¨è®¾ç½®å¾çå°é¢") |
|---|
| | | .then((x) => { |
|---|
| | | //å·æ°æ¥è¯¢çé¢table |
|---|
| | | $parentVue.refresh(); |
|---|
| | | this.model = false; |
|---|
| | | }); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | |
|---|
| | | import { h, resolveComponent } from 'vue'; |
|---|
| | | let extension = { |
|---|
| | | components: {//å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | gridHeader: '', |
|---|
| | | gridBody: { |
|---|
| | | render() { |
|---|
| | | return [ |
|---|
| | | h(resolveComponent('el-alert'), { |
|---|
| | | style: { 'margin-bottom': '12px' }, |
|---|
| | | 'show-icon': true, type: 'warning', |
|---|
| | | closable: false, title: '设置å±æ§åtextInlineï¼è¡¨æ ¼è¶
åºæ¢è¡onInit(){ this.textInline = false}ï¼ä»£ç çæå¨ç¼è¾ç±»åéæ©editorå³å¯é»è®¤çæç¼è¾å¨:App_NewsEditor.jsæApp_News.js' |
|---|
| | | }, ''), |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | gridFooter: '', |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, //å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | buttons: { |
|---|
| | | view: [] |
|---|
| | | }, |
|---|
| | | tableAction: "App_News", |
|---|
| | | methods: { //äºä»¶æ©å± |
|---|
| | | onInit() { |
|---|
| | | //设置表çæ大é«åº¦ |
|---|
| | | // this.tableMaxHeight = 400; |
|---|
| | | //tableå
容è¶
åºåèªå¨æ¢è¡ |
|---|
| | | this.textInline = false; |
|---|
| | | //æ·»å é¢è§æä½ |
|---|
| | | this.columns.forEach(item => { |
|---|
| | | //设置urlç¹å»äºä»¶ |
|---|
| | | if (item.field == 'DetailUrl') { |
|---|
| | | item.title = "页é¢é¢è§"; |
|---|
| | | item.formatter = (row) => { return '<a>é¢è§</a>' } |
|---|
| | | item.click = (row, column, event) => { |
|---|
| | | if (!row.DetailUrl || row.DetailUrl.indexOf('.html') == -1 || !this.base.isUrl(this.http.ipAddress + row.DetailUrl)) { |
|---|
| | | return this.$Message.error("请å
åå¸éæ页é¢") |
|---|
| | | } |
|---|
| | | window.open(this.http.ipAddress + row.DetailUrl); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | onInited(){ |
|---|
| | | this.tableMaxHeight=this.height-50; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | |
|---|
| | | import { h, resolveComponent, defineAsyncComponent } from 'vue'; |
|---|
| | | import modelBody from "./App_ReportPrice/App_ReportPriceModelBody.vue" |
|---|
| | | let extension = { |
|---|
| | | components: {//å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | gridHeader: "", |
|---|
| | | gridBody: { |
|---|
| | | render() { |
|---|
| | | return h(resolveComponent('ElAlert'), { |
|---|
| | | style: { 'margin-bottom': '12px' }, |
|---|
| | | 'show-icon': true, |
|---|
| | | closable: false, |
|---|
| | | }, [h('p', {}, '1ãæ¤çé¢ä¸ä¸é¢çåºå«æ¯ï¼å¤ä¸ªæç»è¡¨å¨å¼¹åºæ¡è¿è¡çæ©å±,è§App_ReportPrice.js(ç¹å»æ°å»ºæç¼è¾å³å¯æ¥çææ)'), |
|---|
| | | h('p', {}, ' 2ãæå¨å建ä¸ä¸ªé¡µé¢(å¯ä»¥åä»»æ代ç )ï¼å¼å
¥å°App_ReportPrice.jsçmodelBodyä½ç½®')]); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | gridFooter: '', |
|---|
| | | modelHeader: '', |
|---|
| | | //éè¿defineAsyncComponentå¼æ¥å¼ç¨ |
|---|
| | | modelBody: modelBody, |
|---|
| | | // defineAsyncComponent(() => (import("./App_ReportPrice/App_ReportPriceModelBody.vue"))), |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | buttons: [],//æ©å±çæé® |
|---|
| | | text: "å¼¹åºæ¡ä¸å¯¹å¤æç»", |
|---|
| | | methods: {//äºä»¶æ©å± |
|---|
| | | onInit() { |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | //åå§ååå°tableé«åº¦åå°85,å 为gridHeaderå äºæ示ä¼å¯¼è´é¡µé¢ææ»å¨æ¡ |
|---|
| | | this.height = this.height - 100; |
|---|
| | | //èªå®ä¹å¼¹åºæ¡çé«ä¸å®½ |
|---|
| | | this.boxOptions.height = document.body.clientHeight * 0.9; |
|---|
| | | this.boxOptions.width = document.body.clientWidth * 0.8; |
|---|
| | | }, |
|---|
| | | modelOpenAfter() {//æå¼å¼¹åºæ¡æ¶ |
|---|
| | | //æ¯å¦åç»ä»¶æ¸²æå®æ |
|---|
| | | //æ°å»ºåæ¶ï¼æ¸
空 æ¸
空,ä»è¡¨1ï¼ä»è¡¨2çæ°æ® |
|---|
| | | this.$nextTick(() => { |
|---|
| | | //è¿é没æç»å¼¹åºæ¡ä¸çè¡¨æ ¼ä¼ åï¼å¦æéè¦åæ°å¯ä»¥éè¿ this.$emit("parentCall", è·å页é¢çåæ° |
|---|
| | | //å
·ä½è§èªå®ä¹é¡µé¢App_ReportPriceModelBody.vueä¸çmodelOpenæ¹æ³çä½¿ç¨ this.$emit("parentCall", ($this) => { |
|---|
| | | this.$refs.modelBody.modelOpen(); |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | addBefore(formData) { //å¼¹åºæ¡æ°å»ºæç¼è¾åè½ç¹ä¿åæ¶å¯ä»¥å°ä»è¡¨1ï¼ä»è¡¨2çæ°æ®æå°åå° |
|---|
| | | this.setFormData(formData); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | updateBefore(formData) { //ç¼è¾æ¶åè½ç¹ä¿åæ¶å¯ä»¥å°ä»è¡¨1ï¼ä»è¡¨2çæ°æ®æå°åå° |
|---|
| | | this.setFormData(formData); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | setFormData(formData) { //æ°å»ºæç¼è¾æ¶ï¼å°ä»è¡¨1ã2çæ°æ®æ交å°åå°,è§åå°App_ReportPriceServiceçæ°å»ºæ¹æ³ |
|---|
| | | //åå°ä»å¯¹è±¡éç´æ¥åextraçå¼ |
|---|
| | | let extra = { |
|---|
| | | table1List: this.$refs.modelBody.$refs.table1.rowData,//è·åä»è¡¨1çè¡æ°æ® |
|---|
| | | table2List: this.$refs.modelBody.$refs.table2.rowData//è·åä»è¡¨2çè¡æ°æ® |
|---|
| | | } |
|---|
| | | formData.extra = JSON.stringify(extra); |
|---|
| | | }, |
|---|
| | | resetUpdateFormAfter() { //ç¼è¾å¼¹åºæ¡æ¶ï¼ç¹éç½®æ¶ï¼å¯èªå®ä¹éç½® |
|---|
| | | console.log('resetUpdateFormAfter') |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | resetAddFormAfter() { //æ°å»ºå¼¹åºæ¡æ¶ï¼ç¹éç½®æ¶ï¼å¯èªå®ä¹éç½® |
|---|
| | | console.log('resetAddFormAfter') |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="vol-tabs" style="height:390px ;"> |
|---|
| | | <el-tabs |
|---|
| | | type="border-card" |
|---|
| | | style=" |
|---|
| | | min-height: 370px; |
|---|
| | | box-shadow: none; |
|---|
| | | border-bottom: 0; |
|---|
| | | border-top: 1px solid #eee; |
|---|
| | | " |
|---|
| | | > |
|---|
| | | <el-tab-pane> |
|---|
| | | <template #label> |
|---|
| | | <span><i class="el-icon-date"></i> ä»è¡¨1</span> |
|---|
| | | </template> |
|---|
| | | <!-- æ¾ç¤ºæä½æé® --> |
|---|
| | | <div> |
|---|
| | | <el-button |
|---|
| | | type="primary" |
|---|
| | | icon="Close" |
|---|
| | | link |
|---|
| | | @click="del" |
|---|
| | | >å é¤è¡</el-button |
|---|
| | | > |
|---|
| | | <el-button |
|---|
| | | type="success" |
|---|
| | | icon="Plus" |
|---|
| | | link |
|---|
| | | @click="add" |
|---|
| | | >æ·»å è¡</el-button |
|---|
| | | > |
|---|
| | | <el-button |
|---|
| | | type="warning" |
|---|
| | | icon="Check" |
|---|
| | | link |
|---|
| | | @click="getRows" |
|---|
| | | >è·åéä¸çè¡</el-button |
|---|
| | | > |
|---|
| | | <el-button |
|---|
| | | type="info" |
|---|
| | | icon="Refresh" |
|---|
| | | link |
|---|
| | | @click="$refs.table1.load()" |
|---|
| | | >å·æ°</el-button |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | <el-alert |
|---|
| | | title="åå»è¡å¯ä»¥ç¼è¾,æè
å¯ä»¥æ ¹æ®èåï¼ table使ç¨->tableç¼è¾(äº)å¨è¡ä¸é
ç½®æä½,å®æ´ææ¡£è§:ç»ä»¶api->voltable" |
|---|
| | | type="warning" |
|---|
| | | style="margin: 10px 0" |
|---|
| | | show-icon |
|---|
| | | > |
|---|
| | | </el-alert> |
|---|
| | | <!-- :defaultLoadPage="false"æå¼çªå£ç¦ç¨é»è®¤å è½½æ°æ® --> |
|---|
| | | <vol-table |
|---|
| | | ref="table1" |
|---|
| | | :clickEdit="true" |
|---|
| | | :loadKey="true" |
|---|
| | | :columns="tableColumns1" |
|---|
| | | :pagination-hide="false" |
|---|
| | | :height="205" |
|---|
| | | :url="table1Url" |
|---|
| | | :index="true" |
|---|
| | | :defaultLoadPage="false" |
|---|
| | | @loadBefore="loadTableBefore1" |
|---|
| | | @loadAfter="loadTableAfter1" |
|---|
| | | ></vol-table> |
|---|
| | | </el-tab-pane> |
|---|
| | | |
|---|
| | | <!-- ä»è¡¨2 --> |
|---|
| | | <el-tab-pane :lazy="false" label="ä»è¡¨2"> |
|---|
| | | <template #label> |
|---|
| | | <span><i class="el-icon-date"></i> ä»è¡¨2</span> |
|---|
| | | </template> |
|---|
| | | <!-- ä»è¡¨2é
ç½® ,åå»å¯ä»¥å¼å¯ç¼è¾--> |
|---|
| | | <div style="padding-bottom: 10px"> |
|---|
| | | <el-button |
|---|
| | | type="primary" |
|---|
| | | link |
|---|
| | | icon="Plus" |
|---|
| | | @click="$refs.table2.addRow({})" |
|---|
| | | >æ·»å è¡</el-button |
|---|
| | | > |
|---|
| | | <el-button |
|---|
| | | icon="Close" |
|---|
| | | link |
|---|
| | | type="success" |
|---|
| | | ghost |
|---|
| | | @click="$refs.table2.load()" |
|---|
| | | >å·æ°</el-button |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | <vol-table |
|---|
| | | ref="table2" |
|---|
| | | :loadKey="true" |
|---|
| | | :clickEdit="true" |
|---|
| | | :columns="tableColumns2" |
|---|
| | | :pagination-hide="false" |
|---|
| | | :height="275" |
|---|
| | | :url="table2Ur" |
|---|
| | | :defaultLoadPage="false" |
|---|
| | | @loadBefore="loadTableBefore2" |
|---|
| | | :index="true" |
|---|
| | | ></vol-table> |
|---|
| | | </el-tab-pane> |
|---|
| | | <el-tab-pane :lazy="false" label="ä»è¡¨3">ä»è¡¨3</el-tab-pane> |
|---|
| | | </el-tabs> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | //å¼åä¸å¯¹å¤ä»è¡¨éè¦åç
§voltableä¸viewgridç»ä»¶api |
|---|
| | | import VolTable from "@/components/basic/VolTable.vue"; |
|---|
| | | export default { |
|---|
| | | components: { VolTable }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | //ä»è¡¨1 |
|---|
| | | table1Url: "api/App_ReportPrice/getTable1Data", //table1è·åæ°æ®çæ¥å£ |
|---|
| | | //表é
ç½®çå段注æè¦ä¸åå°è¿åçæ¥è¯¢å段大å°åä¸è´ |
|---|
| | | tableColumns1: [ |
|---|
| | | { field: "id", title: "主é®ID", type: "int", width: 80, hidden: true }, |
|---|
| | | { |
|---|
| | | field: "title", |
|---|
| | | title: "æ é¢", |
|---|
| | | type: "string", |
|---|
| | | width: 400, |
|---|
| | | require: true, |
|---|
| | | sortable: true, |
|---|
| | | edit: { type: "text" }, //keep:trueå§ç»å¼å¯ç¼è¾ï¼falseåå»æè½ç¼è¾ |
|---|
| | | }, |
|---|
| | | { field: "imageUrl", title: "å°é¢å¾ç", type: "file", width: 170 }, |
|---|
| | | { |
|---|
| | | field: "dailyRecommend", |
|---|
| | | title: "å
容æ¨è", |
|---|
| | | type: "sbyte", |
|---|
| | | bind: { key: "dr", data: [] }, |
|---|
| | | edit: { type: "switch" }, |
|---|
| | | width: 120, |
|---|
| | | require: true, |
|---|
| | | onChange: (column, row, tableData, value) => { |
|---|
| | | this.$Message.info(value + ""); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: "enable", |
|---|
| | | title: "æ¯å¦å¯ç¨", |
|---|
| | | type: "int", |
|---|
| | | width: 90, |
|---|
| | | bind: { key: "enable", data: [] }, //èªå¨ç»å®æ°æ®æº |
|---|
| | | //é
置为selectç¼è¾ç±»å,keep=trueå§ç»å¤äºç¼è¾ç¶æ(å¦ææ³è¦åå»ç¼è¾ï¼å»ækeepå±æ§ï¼å
·ä½é
ç½®å¯è§voltableç»ä»¶api) |
|---|
| | | edit: { type: "select" }, |
|---|
| | | onChange: (column, row, tableData) => { |
|---|
| | | this.$Message.info(row.enable + ""); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: "createDate", |
|---|
| | | title: "åå¸æ¶é´", |
|---|
| | | type: "datetime", |
|---|
| | | width: 150, |
|---|
| | | readonly: true, |
|---|
| | | sortable: true, |
|---|
| | | edit: { type: "datetime" }, |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | //ä»è¡¨2 |
|---|
| | | table2Ur: "api/App_ReportPrice/getTable2Data", //table1è·åæ°æ®çæ¥å£ |
|---|
| | | //表é
ç½®çå段注æè¦ä¸åå°è¿åçæ¥è¯¢å段大å°åä¸è´ |
|---|
| | | tableColumns2: [ |
|---|
| | | { field: "id", title: "主é®ID", type: "int", width: 80, hidden: true }, |
|---|
| | | { |
|---|
| | | field: "name", |
|---|
| | | title: "å§å", |
|---|
| | | edit: { type: "text" }, |
|---|
| | | type: "text", |
|---|
| | | width: 120, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: "phoneNo", |
|---|
| | | title: "çµè¯", |
|---|
| | | type: "text", |
|---|
| | | edit: { type: "text" }, |
|---|
| | | width: 150, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | { |
|---|
| | | field: "createDate", |
|---|
| | | title: "å建æ¶é´", |
|---|
| | | type: "text", |
|---|
| | | edit: { type: "datetime" }, |
|---|
| | | width: 150, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: "describe", |
|---|
| | | title: "æè¿°", |
|---|
| | | type: "text", |
|---|
| | | edit: { type: "text" }, |
|---|
| | | width: 500, |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | //å¦æè¦è·å页é¢çåæ°è¯·ä½¿ç¨ this.$emit("parentCall",è§ä¸é¢ç使ç¨æ¹æ³ |
|---|
| | | modelOpen() { |
|---|
| | | let $parent; |
|---|
| | | //è·åçæ页é¢viewgridç对象 |
|---|
| | | this.$emit("parentCall", ($this) => { |
|---|
| | | $parent = $this; |
|---|
| | | }); |
|---|
| | | //å½åå¦ææ¯æ°å»ºéç½®ä¸¤ä¸ªè¡¨æ ¼æ°æ® |
|---|
| | | if ($parent.currentAction == "Add") { |
|---|
| | | this.$refs.table1.reset(); |
|---|
| | | this.$refs.table2.reset(); |
|---|
| | | } else { |
|---|
| | | //å¦ææ¯ç¼è¾ï¼æ·»å ä¸¤ä¸ªè¡¨æ ¼çæ°æ® |
|---|
| | | this.$refs.table1.load(); |
|---|
| | | this.$refs.table2.load(); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | loadTableBefore1(param, callBack) { |
|---|
| | | let $parent = null; |
|---|
| | | //å½åæ¯å页é¢ï¼è·åæ¥è¯¢viewgrid页é¢ç对象() |
|---|
| | | this.$emit("parentCall", ($this) => { |
|---|
| | | $parent = $this; |
|---|
| | | }); |
|---|
| | | //å¦ææ¯æ°å»ºåè½ï¼ç¦æ¢å·æ°æä½ |
|---|
| | | if ($parent.currentAction == "Add") { |
|---|
| | | return callBack(false); |
|---|
| | | } |
|---|
| | | //è·åå½åç¼è¾ä¸»é®idå¼ |
|---|
| | | let id = $parent.currentRow.Id; |
|---|
| | | //æ·»å ä»è¡¨çæ¥è¯¢åæ°(æ¡ä»¶) |
|---|
| | | //å°å½åéä¸çè¡ä¸»é®ä¼ å°åå°ç¨äºæ¥è¯¢(åå°å¨GetTable2Data(PageDataOptions loadData)ä¼æ¥æ¶å°æ¤åæ°) |
|---|
| | | param.wheres.push({ name: "Id", value: id }); |
|---|
| | | callBack(true); |
|---|
| | | }, |
|---|
| | | //ä»è¡¨2å è½½æ°æ®æ°å(æä½ä¸ä¸é¢ä¸æ ·ç,å¢å æ¥è¯¢æ¡ä»¶) |
|---|
| | | loadTableBefore2(param, callBack) { |
|---|
| | | callBack(true); |
|---|
| | | }, |
|---|
| | | //ä»åå°å è½½ä»è¡¨1æ°æ®å |
|---|
| | | loadTableAfter1(data, callBack) { |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | |
|---|
| | | |
|---|
| | | del() { |
|---|
| | | let rows = this.$refs.table1.getSelected(); |
|---|
| | | if (rows.length == 0) { |
|---|
| | | return this.$Message.error("请å
éä¸è¡"); |
|---|
| | | } |
|---|
| | | this.$refs.table1.delRow(); |
|---|
| | | //å¯ä»¥this.http.postè°ç¨åå°å®é
æ§è¡æ¥è¯¢ |
|---|
| | | }, |
|---|
| | | clear() { |
|---|
| | | this.$refs.table1.reset(); |
|---|
| | | }, |
|---|
| | | add() { |
|---|
| | | // this.$refs.table1.addRow({}); |
|---|
| | | this.$refs.table1.rowData.unshift({title:"æµè¯....."}); |
|---|
| | | }, |
|---|
| | | getRows() { |
|---|
| | | //è·åéä¸çè¡ |
|---|
| | | let rows = this.$refs.table1.getSelected(); |
|---|
| | | if (rows.length == 0) { |
|---|
| | | return this.$Message.error("请å
éä¸è¡"); |
|---|
| | | } |
|---|
| | | this.$Message.error(JSON.stringify(rows)); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .vol-tabs { |
|---|
| | | background: white; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | import { h, resolveComponent } from 'vue'; |
|---|
| | | let extension = { |
|---|
| | | components: { |
|---|
| | | //å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | gridHeader: '', //{ template: "<div>æ©å±ç»xx件</div>" }, |
|---|
| | | // gridBody: { |
|---|
| | | // template: '<Alert type="success" show-icon>\ |
|---|
| | | // æ¥è¯¢é»è®¤/æ¾ç¤ºæææ¥è¯¢æ¡ä»¶<template slot="desc"><p>1ã onInit(){ this.setFiexdSearchForm(true); //设置åºå®æ¾ç¤ºæææ¥è¯¢æ¡ä»¶}</p>\ |
|---|
| | | // 2ã 设置é»è®¤æ¥è¯¢å¼(ä¸ææ¡ãé»è®¤æ¥æ)ãæ¥è¯¢çé¢è¡¨é«åº¦ç,å
·ä½è§App_Transaction.jsé
ç½®ä¸è¯´æ</template>\ |
|---|
| | | // </Alert>' }, |
|---|
| | | gridBody: { |
|---|
| | | render() { |
|---|
| | | return h( |
|---|
| | | resolveComponent('ElAlert'), |
|---|
| | | { |
|---|
| | | style: { 'margin-bottom': '12px' }, |
|---|
| | | 'show-icon': true, |
|---|
| | | type: 'success', |
|---|
| | | closable: false |
|---|
| | | }, |
|---|
| | | [ |
|---|
| | | h( |
|---|
| | | 'p', |
|---|
| | | {}, |
|---|
| | | '1ãé»è®¤çé¢ä¸æ¾ç¤ºçåé½å¯ä»¥å¯¼å
¥ï¼ä¹å¯ä»¥å¨åå°æå®å¯¼å
¥ä¸å¯¼åºçåï¼è§åå°å¼åææ¡£->åå°åºç¡ä»£ç æ©å±å®ç°å¯¼å
¥æ¹æ³è¯´æ' |
|---|
| | | ), |
|---|
| | | h( |
|---|
| | | 'p', |
|---|
| | | {}, |
|---|
| | | ' 2ãæ·»å switchãcheckboxç»ä»¶ï¼è®¾ç½®é»è®¤æ¥è¯¢å¼(ä¸ææ¡ãé»è®¤æ¥æ)ãæ¥è¯¢çé¢è¡¨é«åº¦ç,App_Transaction.jsé
ç½®ä¸è¯´æ' |
|---|
| | | ) |
|---|
| | | ] |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | gridFooter: '', |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | tableAction: 'App_Appointment', //æå®èåæéï¼å
¶ä»ä»»ä½é¡µé¢å¼ç¨æ¶é½ä¼èµ°å¯¹åºæé |
|---|
| | | text: |
|---|
| | | 'ç®å导å
¥å¯¼åºçå段为代ç çæå¨ä¸é
ç½®[æ¯å¦æ¾ç¤ºä¸ç¼è¾å],å¯èªè¡æ·»å é
ç½®å段å¤ç', |
|---|
| | | buttons: [], //æ©å±çæé® |
|---|
| | | methods: { |
|---|
| | | //äºä»¶æ©å± |
|---|
| | | |
|---|
| | | //äºä»¶æ©å± |
|---|
| | | onInit() { |
|---|
| | | |
|---|
| | | this.buttons.push({ |
|---|
| | | name: 'æ¥ç代ç ', |
|---|
| | | onClick: () => { |
|---|
| | | window.open('http://api.volcore.xyz/vol.doc/apptransaction.html', 'blank'); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | |
|---|
| | | |
|---|
| | | //设置æ¥è¯¢æ¡ä»¶ |
|---|
| | | // this.searchFormFields.Name = "æ"; |
|---|
| | | //设置ä¸ææ¡çå段(æ¯å¦ä¹°å
¥)çé»è®¤å¼(注æä¸ææ¡keyå¦è¦æ¯æ°ååæ ·ä¹è¦è®¾ç½®ä¸ºå符类åæ°å,å¦ææ¯èªå®sqlæ°æ®æºçkeyåéè¦è®¾ç½®ææ°åç±»å) |
|---|
| | | // this.searchFormFields.TransactionType = '1'; |
|---|
| | | //注ææ¥æ设置é»è®¤å¼çæ¶å ï¼å¦ææ¥è¯¢ç±»åéæ©çæ¯datetimeåé¢ä¸å®è¦åä¸,00:00:00 |
|---|
| | | //å¦ææ¥è¯¢ç±»åæ¯dateç´æ¥åå¹´ææ¥å³å¯ |
|---|
| | | this.searchFormFields.CreateDate = [ |
|---|
| | | '2015-01-01 00:00:00', |
|---|
| | | '2030-12-31 00:00:00' |
|---|
| | | ]; |
|---|
| | | //设置页é¢ä¸æ¾ç¤ºçæé®ä¸ªæ°(ä¸æ¯å¿
é¡»ç) |
|---|
| | | this.maxBtnLength = 6; |
|---|
| | | //设置æ¾ç¤ºæææ¥è¯¢æ¡ä»¶ |
|---|
| | | this.setFiexdSearchForm(true); |
|---|
| | | |
|---|
| | | this.columns.forEach(col=>{ |
|---|
| | | if (col.field=='Describe') { |
|---|
| | | col.hidden=true; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | |
|---|
| | | this.columns.push({ |
|---|
| | | title: 'switch', |
|---|
| | | field: 'switch', |
|---|
| | | width: 80, |
|---|
| | | fixed: 'right', |
|---|
| | | align: 'center', |
|---|
| | | render: (h, { row, column, index }) => { |
|---|
| | | //è¿éå¿
é¡»å°è¦æä½çå段åæ´ä¸ºboolç±»å |
|---|
| | | row.Enable=row.Enable||false; |
|---|
| | | return ( |
|---|
| | | <div> |
|---|
| | | <el-switch |
|---|
| | | v-model={row.Enable} |
|---|
| | | onChange={(val) => { |
|---|
| | | this.switchChange(row); |
|---|
| | | }} |
|---|
| | | ></el-switch> |
|---|
| | | </div> |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | |
|---|
| | | this.columns.push({ |
|---|
| | | title: 'checkbox', |
|---|
| | | field: 'checkbox', |
|---|
| | | width: 80, |
|---|
| | | fixed: 'right', |
|---|
| | | align: 'center', |
|---|
| | | render: (h, { row, column, index }) => { |
|---|
| | | //è¿éå¿
é¡»å°è¦æä½çå段åæ´ä¸ºboolç±»å |
|---|
| | | row.Enable=row.Enable||false; |
|---|
| | | return ( |
|---|
| | | <div> |
|---|
| | | <el-checkbox |
|---|
| | | v-model={row.Enable} |
|---|
| | | onChange={(val) => { |
|---|
| | | this.switchChange(row); |
|---|
| | | }} |
|---|
| | | ></el-checkbox> |
|---|
| | | </div> |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | switchChange(row) { |
|---|
| | | this.$message.success(row.Enable + ''); |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | //设置æ¥è¯¢çé¢è¡¨é«åº¦ |
|---|
| | | this.height = this.height-215; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | let extension = { |
|---|
| | | components: { |
|---|
| | | //å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | gridHeader: '', //{ template: "<div>æ©å±ç»xx件</div>" }, |
|---|
| | | gridBody: '', |
|---|
| | | gridFooter: '', |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | text: 'ç¹å»è¡æè
ç¹å»è¡¨æ ¼çç¼è¾å³å¯å¼å¯ç¼è¾åè½', |
|---|
| | | tableAction: 'App_Transaction', |
|---|
| | | buttons: [], //æ©å±çæé® |
|---|
| | | methods: { |
|---|
| | | //äºä»¶æ©å± |
|---|
| | | onInit() { |
|---|
| | | //æå¨è®¾ç½®å¼¹åºæ¡çé«åº¦ä¸å®½åº¦ |
|---|
| | | //å¤ææ没æApp_Transaction表修æ¹çæé ï¼æ æéä¸å¼å¯ç¼è¾åè½ |
|---|
| | | if (!this.filterPermission('App_Transaction', 'Update')) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | //å¼å¯ç¼è¾åè½ |
|---|
| | | this.doubleEdit = true; |
|---|
| | | //å¼å¯æå®åå¯ä»¥ç¼è¾ |
|---|
| | | //**注æï¼å¼å¯å段çç¼è¾ä¿¡æ¯ï¼å¦æè°ç¨æ¡æ¶çä¿åæ¹æ³ï¼ä»£ç çæå¨ä¸å¿
须设置äºç¼è¾è¡å¹¶çæäºmodelå¦åéªè¯éä¸è¿ |
|---|
| | | this.columns.forEach((column) => { |
|---|
| | | if (column.field == 'Describe' || column.field == 'Name') { |
|---|
| | | column.edit = { type: 'text' }; |
|---|
| | | } |
|---|
| | | if (column.field == 'TransactionType') { |
|---|
| | | column.edit = { type: 'switch' }; |
|---|
| | | } |
|---|
| | | if (column.field == 'CowType') { |
|---|
| | | column.edit = { type: 'select' }; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | //å¨ææ·»å æä½å |
|---|
| | | this.columns.push({ |
|---|
| | | field: 'æä½', |
|---|
| | | title: 'æä½', |
|---|
| | | align: 'center', |
|---|
| | | width: 120, |
|---|
| | | render: this.getRender() |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | beginEdit(row, column, index) { |
|---|
| | | console.log('ç¼è¾è¡ï¼'+index) |
|---|
| | | //ç¹å»è¡ç¼è¾ return falseé»æ¢ç¼è¾(å¯ä»¥æ ¹æ®rowä¸åçå¼å¤æå½åæ¯å¦å¯ä»¥ç¼è¾); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | endEditBefore(row, column, index) { |
|---|
| | | //å¯ä»¥èªå¨ç»æç¼è¾æ¶ï¼èªå¨æ§è¡ä¿åï¼ä¸é¢getRenderçä¿åæé®å»æ |
|---|
| | | // this.editSave(); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | editSave(row) { |
|---|
| | | //è°ç¨æ¡æ¶çé»è®¤ä¿åæ¹æ³ |
|---|
| | | this.http |
|---|
| | | .post('/api/App_Transaction/update', { mainData: row }, true) |
|---|
| | | .then((x) => { |
|---|
| | | this.$Message.info('ä¿åæå'); |
|---|
| | | console.log('ä¿åç»æï¼' + JSON.stringify(x)); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | getRender() { |
|---|
| | | //çææåä¸åæä½å |
|---|
| | | return (h, { row, column, index }) => { |
|---|
| | | return h( |
|---|
| | | 'div', |
|---|
| | | { |
|---|
| | | style: { color: '#0c83ff', 'font-size': '13px', cursor: 'pointer' } |
|---|
| | | }, |
|---|
| | | [ |
|---|
| | | h( |
|---|
| | | 'a', |
|---|
| | | { |
|---|
| | | props: {}, |
|---|
| | | style: { 'border-bottom': '1px solid' }, |
|---|
| | | onClick: (e) => { |
|---|
| | | e.stopPropagation(); |
|---|
| | | //åæ¶å
¶ä»è¡éä¸ |
|---|
| | | this.$refs.table.$refs.table.clearSelection(); |
|---|
| | | //设置å½ååéä¸ |
|---|
| | | this.$refs.table.$refs.table.toggleRowSelection(row); |
|---|
| | | this.del([row]); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | 'å é¤' |
|---|
| | | ), |
|---|
| | | h( |
|---|
| | | 'a', |
|---|
| | | { |
|---|
| | | props: {}, |
|---|
| | | style: { 'margin-left': '9px', 'border-bottom': '1px solid' }, |
|---|
| | | onClick: (e) => { |
|---|
| | | e.stopPropagation(); |
|---|
| | | //å°å½åè¡è®¾ç½®ä¸ºç¼è¾è¡ |
|---|
| | | this.$refs.table.edit.rowIndex = index; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | 'ç¼è¾' |
|---|
| | | ), |
|---|
| | | h( |
|---|
| | | 'a', |
|---|
| | | { |
|---|
| | | props: {}, |
|---|
| | | style: { 'margin-left': '9px', 'border-bottom': '1px solid' }, |
|---|
| | | onClick: (e) => { |
|---|
| | | e.stopPropagation(); |
|---|
| | | //强å¶ç»æç¼è¾ |
|---|
| | | this.$refs.table.edit.rowIndex = -1; |
|---|
| | | //æ§è¡ä¿åæ¹æ³ |
|---|
| | | this.editSave(row); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | 'ä¿å' |
|---|
| | | ) |
|---|
| | | ] |
|---|
| | | ); |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | |
|---|
| | | import { h, resolveComponent } from 'vue'; |
|---|
| | | let extension = { |
|---|
| | | components: { |
|---|
| | | //å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | gridHeader: '', //{ template: "<div>æ©å±ç»xx件</div>" }, |
|---|
| | | gridBody: { |
|---|
| | | render() { |
|---|
| | | return [ |
|---|
| | | h(resolveComponent('el-alert'), { |
|---|
| | | style: { 'margin-bottom': '12px' }, |
|---|
| | | 'show-icon': true, type: 'warning', |
|---|
| | | closable: false, title: 'onInitä¸è®¾ç½®this.maxBtnLength = 7;æå®æé®æ¾ç¤ºç个æ°ãè§ä»£ç ï¼App_TransactionAvgPrice.js' |
|---|
| | | }, ''), |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | gridFooter: "", |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: "", |
|---|
| | | modelBody: "", |
|---|
| | | modelFooter: "" |
|---|
| | | }, |
|---|
| | | text: |
|---|
| | | "è¿æ²¡æ³å¥½", |
|---|
| | | buttons: [], //æ©å±çæé® |
|---|
| | | methods: { |
|---|
| | | //äºä»¶æ©å± |
|---|
| | | onInit() { |
|---|
| | | //设置页é¢ä¸æ¾ç¤ºçæé®ä¸ªæ°(ä¸æ¯å¿
é¡»ç) |
|---|
| | | this.maxBtnLength = 7; |
|---|
| | | //this.boxButtonså¼¹åºæ¡çæé®,this.detailOptions.buttonsï¼åæ ·éç¨ä¸é¢ä¸æ¹æ³ |
|---|
| | | //2021.07.17æ´æ°volform.vueç»ä»¶åæè½ä½¿ç¨ |
|---|
| | | this.editFormOptions.forEach(x => { |
|---|
| | | x.forEach(option => { |
|---|
| | | if (option.field == "Date") { |
|---|
| | | option.min = "2021-07-01 00:00"; |
|---|
| | | option.max = Date.now();//æ¥ææ大å¼"2021-07-20 00:00" |
|---|
| | | } |
|---|
| | | |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | this.columns.forEach(option => { |
|---|
| | | if (option.field == 'AgeRange') { |
|---|
| | | option.normal = true; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | //å¦æè¦è®¾ç½®æ¥è¯¢çæ¥æèå´éæ©åä¸ |
|---|
| | | //this.searchFormOptions.forEach |
|---|
| | | |
|---|
| | | //设置æ¾ç¤ºæææ¥è¯¢æ¡ä»¶ |
|---|
| | | // this.setFiexdSearchForm(true); |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | //设置表é«åº¦ |
|---|
| | | this.height = this.height - 50; |
|---|
| | | }, |
|---|
| | | rowClick({ row, column, event }) { //æ¥è¯¢çé¢tableç¹å»è¡æ¶éä¸å½åè¡ |
|---|
| | | this.$refs.table.$refs.table.toggleRowSelection(row); |
|---|
| | | }, |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | let extension = { |
|---|
| | | components: {//å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | gridHeader:'',//{ template: "<div>æ©å±ç»xx件</div>" }, |
|---|
| | | gridBody: '', |
|---|
| | | gridFooter: '', |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | buttons: [],//æ©å±çæé® |
|---|
| | | methods: {//äºä»¶æ©å± |
|---|
| | | |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | let extension = { |
|---|
| | | components: {//å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | gridHeader:'',//{ template: "<div>æ©å±ç»xx件</div>" }, |
|---|
| | | gridBody: '', |
|---|
| | | gridFooter: '', |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | buttons: [],//æ©å±çæé® |
|---|
| | | methods: {//äºä»¶æ©å± |
|---|
| | | |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | import { h, resolveComponent } from 'vue'; |
|---|
| | | let extension = { |
|---|
| | | components: { |
|---|
| | | //å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | gridHeader: '', |
|---|
| | | gridBody: { |
|---|
| | | render(h) { |
|---|
| | | return ( |
|---|
| | | <el-alert |
|---|
| | | style={{ 'margin-bottom': '10px' }} |
|---|
| | | type="success" |
|---|
| | | show-icon |
|---|
| | | > |
|---|
| | | <p v-html="1ã onInit(){ this.setFiexdSearchForm(true){设置åºå®æ¾ç¤ºæææ¥è¯¢æ¡ä»¶}"> |
|---|
| | | {' '} |
|---|
| | | </p> |
|---|
| | | <p v-html="2ãèªå®ä¹è¡¨æ ¼æé®ãå¼¹åºæ¡æ示ãå¼¹åºæ¡åç»ä¿¡æ¯,è§ç¤ºä¾ï¼App_Appointment.jsæ件"> |
|---|
| | | {' '} |
|---|
| | | </p> |
|---|
| | | </el-alert> |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | gridFooter: '', |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | buttons: [], //æ©å±çæé® |
|---|
| | | tableAction: 'App_Appointment', //æå®èåæéï¼å
¶ä»ä»»ä½é¡µé¢å¼ç¨æ¶é½ä¼èµ°å¯¹åºæé |
|---|
| | | text: |
|---|
| | | '代ç çæå¨ä¸è®¾ç½®[æ¯å¦åªè¯»]æå¦æ没æç¼è¾ææ°å»ºæéå¼¹åºæ¡é½æ¯åªè¯»ç(ç¹å»ç¨æ·å§ååå¯æ¥ç表ååç»)', |
|---|
| | | methods: { |
|---|
| | | btn1Click(row, $e) { |
|---|
| | | $e.stopPropagation(); |
|---|
| | | this.edit(row); |
|---|
| | | }, |
|---|
| | | btn2Click(row, $e) { |
|---|
| | | $e.stopPropagation(); |
|---|
| | | this.$message.success('ç¹å»äºæé®'); |
|---|
| | | }, |
|---|
| | | dropdownClick(value, row, column) { |
|---|
| | | console.log(row); |
|---|
| | | this.$message.success(value); |
|---|
| | | }, |
|---|
| | | //äºä»¶æ©å± |
|---|
| | | onInit() { |
|---|
| | | this.buttons.push({ |
|---|
| | | name: 'æ¥ç代ç ', |
|---|
| | | onClick: () => { |
|---|
| | | window.open('http://api.volcore.xyz/vol.doc/appointment.html', 'blank'); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | |
|---|
| | | //设置æ¾ç¤ºæææ¥è¯¢æ¡ä»¶ |
|---|
| | | this.setFiexdSearchForm(true); |
|---|
| | | |
|---|
| | | //è¡¨æ ¼ä¸æ·»å èªå®ä¹æé® |
|---|
| | | this.columns.push({ |
|---|
| | | title: 'æä½', |
|---|
| | | field: 'æä½', |
|---|
| | | width: 150, |
|---|
| | | align: 'center', |
|---|
| | | render: (h, { row, column, index }) => { |
|---|
| | | return ( |
|---|
| | | <div> |
|---|
| | | <el-button |
|---|
| | | onClick={($e) => { |
|---|
| | | this.btn1Click(row, $e); |
|---|
| | | }} |
|---|
| | | type="primary" |
|---|
| | | plain |
|---|
| | | size="small" |
|---|
| | | style="height:26px; padding: 10px !important;" |
|---|
| | | > |
|---|
| | | æ¥ç |
|---|
| | | </el-button> |
|---|
| | | <el-button |
|---|
| | | onClick={($e) => { |
|---|
| | | this.btn2Click(row, $e); |
|---|
| | | }} |
|---|
| | | type="success" |
|---|
| | | plain |
|---|
| | | size="small" |
|---|
| | | style="height:26px;padding: 10px !important;" |
|---|
| | | > |
|---|
| | | æé® |
|---|
| | | </el-button> |
|---|
| | | |
|---|
| | | <el-dropdown |
|---|
| | | onClick={(value) => { |
|---|
| | | this.dropdownClick(value); |
|---|
| | | }} |
|---|
| | | trigger="click" |
|---|
| | | v-slots={{ |
|---|
| | | dropdown: () => ( |
|---|
| | | <el-dropdown-menu> |
|---|
| | | <el-dropdown-item> |
|---|
| | | <div |
|---|
| | | onClick={() => { |
|---|
| | | this.dropdownClick('京é
±èä¸', row, column); |
|---|
| | | }} |
|---|
| | | > |
|---|
| | | 京é
±èä¸ |
|---|
| | | </div> |
|---|
| | | </el-dropdown-item> |
|---|
| | | <el-dropdown-item> |
|---|
| | | <div |
|---|
| | | onClick={() => { |
|---|
| | | this.dropdownClick('é©´èç«ç§', row, column); |
|---|
| | | }} |
|---|
| | | > |
|---|
| | | é©´èç«ç§ |
|---|
| | | </div> |
|---|
| | | </el-dropdown-item> |
|---|
| | | <el-dropdown-item> |
|---|
| | | <div |
|---|
| | | onClick={() => { |
|---|
| | | this.dropdownClick('åçç¤é¸', row, column); |
|---|
| | | }} |
|---|
| | | > |
|---|
| | | åçç¤é¸ |
|---|
| | | </div> |
|---|
| | | </el-dropdown-item> |
|---|
| | | </el-dropdown-menu> |
|---|
| | | ) |
|---|
| | | }} |
|---|
| | | > |
|---|
| | | <span |
|---|
| | | style="font-size: 13px;color: #409eff;margin: 5px 0 0 10px;" |
|---|
| | | class="el-dropdown-link" |
|---|
| | | > |
|---|
| | | æ´å¤<i class="el-icon-arrow-right"></i> |
|---|
| | | </span> |
|---|
| | | </el-dropdown> |
|---|
| | | </div> |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | |
|---|
| | | //è¡¨æ ¼æ¾ç¤ºTooltipæ示 |
|---|
| | | this.columns.forEach((col) => { |
|---|
| | | if (col.field == 'Describe') { |
|---|
| | | col.title = 'åå
æ ¼Tooltip(é¼ æ æ¾ä¸æ¥çææ)'; |
|---|
| | | col.render = (h, { row, column, index }) => { |
|---|
| | | return ( |
|---|
| | | <el-popover |
|---|
| | | placement="top-start" |
|---|
| | | title="æ示信æ¯" |
|---|
| | | width={350} |
|---|
| | | trigger="hover" |
|---|
| | | content={ |
|---|
| | | row.Describe + |
|---|
| | | ',è¿éæ¯ç¨render渲æçè¡¨æ ¼æ示,示ä¾è§:App_Appointment.js' |
|---|
| | | } |
|---|
| | | > |
|---|
| | | {{ reference: <span>{row.Describe}</span> }} |
|---|
| | | </el-popover> |
|---|
| | | ); |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | |
|---|
| | | //å¢å å¼¹åºæ¡æç¤ºä¿¡æ¯ |
|---|
| | | //https://cn.vuejs.org/guide/extras/render-function.html#passing-slots |
|---|
| | | //èªå®ä¹æ示 |
|---|
| | | this.editFormOptions[0][0].extra = { |
|---|
| | | render: (h) => { |
|---|
| | | return ( |
|---|
| | | <el-popover |
|---|
| | | placement="top-start" |
|---|
| | | title="Title" |
|---|
| | | width="200" |
|---|
| | | trigger="hover" |
|---|
| | | content="this is content, this is content, this is content" |
|---|
| | | > |
|---|
| | | {/* è¿é对åºä¸é¢ç#referenceæ°æ®æ§½ */} |
|---|
| | | {{ reference: <i class="el-icon-warning-outline"></i> }} |
|---|
| | | </el-popover> |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | |
|---|
| | | // <el-popover |
|---|
| | | // placement="top-start" |
|---|
| | | // title="Title" |
|---|
| | | // :width="200" |
|---|
| | | // trigger="hover" |
|---|
| | | // content="this is content, this is content, this is content" |
|---|
| | | // > |
|---|
| | | // <template #reference> |
|---|
| | | // <el-button>Hover to activate</el-button> |
|---|
| | | // </template> |
|---|
| | | // </el-popover> |
|---|
| | | |
|---|
| | | //æ ¼å¼ååæ ¼é¢è² |
|---|
| | | this.columns.forEach((x) => { |
|---|
| | | if (x.field == 'PhoneNo') { |
|---|
| | | x.cellStyle = (row, rowIndex, columnIndex) => { |
|---|
| | | if (row.PhoneNo == '138888887698' && rowIndex == 0) { |
|---|
| | | return { background: '#ddecfd' }; |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | if (x.field == 'Creator') { |
|---|
| | | x.cellStyle = (row, rowIndex, columnIndex) => { |
|---|
| | | if (row.Creator == 'è¶
级管çå') { |
|---|
| | | return { background: 'rgb(45 140 240)', color: '#ffff' }; |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (x.field == 'Name') { |
|---|
| | | x.title = 'ç¹å»æ¥ç表å'; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | |
|---|
| | | //设置表ååç» |
|---|
| | | this.editFormOptions.splice(0, 0, [ |
|---|
| | | { |
|---|
| | | colSize: 12, |
|---|
| | | render: (h) => { |
|---|
| | | return ( |
|---|
| | | <div |
|---|
| | | style={{ |
|---|
| | | display: 'flex', |
|---|
| | | 'margin-bottom': '-4px', |
|---|
| | | 'line-height': '20px', |
|---|
| | | 'margin-top': '5px', |
|---|
| | | 'padding-bottom': '5px', |
|---|
| | | 'border-bottom': '1px solid rgb(238, 238, 238)' |
|---|
| | | }} |
|---|
| | | > |
|---|
| | | <div style="height: 19px; background: rgb(45, 206, 217); width: 9px; border-radius: 10px;"></div> |
|---|
| | | <div style="padding-left: 6px; font-weight: bold; font-size: 13px;"> |
|---|
| | | åºæ¬ä¿¡æ¯ |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ]); |
|---|
| | | |
|---|
| | | //设置表ååç» |
|---|
| | | |
|---|
| | | this.editFormOptions.splice(2, 0, [ |
|---|
| | | { |
|---|
| | | colSize: 12, |
|---|
| | | render: (h) => { |
|---|
| | | return ( |
|---|
| | | <div |
|---|
| | | style={{ |
|---|
| | | display: 'flex', |
|---|
| | | 'margin-bottom': '-4px', |
|---|
| | | 'line-height': '20px', |
|---|
| | | 'margin-top': '5px', |
|---|
| | | 'padding-bottom': '5px', |
|---|
| | | 'border-bottom': '1px solid rgb(238, 238, 238)' |
|---|
| | | }} |
|---|
| | | > |
|---|
| | | <div style="height: 19px; background: rgb(45, 206, 217); width: 9px; border-radius: 10px;"></div> |
|---|
| | | <div style="padding-left: 6px; font-weight: bold; font-size: 13px;"> |
|---|
| | | åºæ¬ä¿¡æ¯ |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ]); |
|---|
| | | |
|---|
| | | //å¼¹åºæ¡å¢å å段alertæ示 |
|---|
| | | this.editFormOptions.splice(3, 0, [ |
|---|
| | | { |
|---|
| | | colSize: 12, |
|---|
| | | render: (h) => { |
|---|
| | | return ( |
|---|
| | | <el-alert |
|---|
| | | title="è¿éæ¯èªå®çæ示信æ¯" |
|---|
| | | style={{ padding: 0 }} |
|---|
| | | type="success" |
|---|
| | | ></el-alert> |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ]); |
|---|
| | | |
|---|
| | | //æ¥è¯¢çé¢æé®ç» |
|---|
| | | //æé®å¾æ è¿éæ¾https://element.eleme.cn/#/zh-CN/component/icon |
|---|
| | | //第äºä¸ªæé®åé¢æ·»å æé®ç» |
|---|
| | | this.buttons.splice(2, 1, { |
|---|
| | | name: 'æé®ç»', |
|---|
| | | type: 'primary', |
|---|
| | | plain: true, |
|---|
| | | color: '#009688', |
|---|
| | | data: [ |
|---|
| | | { |
|---|
| | | name: 'æé®ä¸', |
|---|
| | | icon: 'el-icon-plus', |
|---|
| | | onClick: () => { |
|---|
| | | this.$message.info('æé®ä¸'); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | name: 'æé®äº', |
|---|
| | | icon: 'el-icon-zoom-out', |
|---|
| | | onClick: () => { |
|---|
| | | this.$message.info('æé®äº'); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | |
|---|
| | | onInited() { |
|---|
| | | //å¤é¡µç¾èåæå¼æ¶ï¼éæ°è®¾ç½®è¡¨æ ¼çæ大é«åº¦ |
|---|
| | | if (this.$route.path == '/tabsTable') { |
|---|
| | | this.tableMaxHeight = document.body.clientHeight - 415; |
|---|
| | | } else { |
|---|
| | | //设置表çæ大é«åº¦ |
|---|
| | | this.tableMaxHeight = this.height - 125; //400 |
|---|
| | | } |
|---|
| | | //移é¤å¿«æ·æ¥è¯¢ |
|---|
| | | this.singleSearch = null; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="m-detail"> |
|---|
| | | <div class="m-title"> |
|---|
| | | <h2>订å详æ
</h2> |
|---|
| | | </div> |
|---|
| | | <div class="m-tabs"> |
|---|
| | | <Tabs> |
|---|
| | | <TabPane label="é
ç½®è¦æ±" icon="md-apps"> |
|---|
| | | <div style="margin-bottom:10px;text-align: right;"> |
|---|
| | | <Button type="info" ghost @click="clear">æ¸
空表</Button> |
|---|
| | | <Button type="info" ghost @click="del">å é¤è¡</Button> |
|---|
| | | <Button type="info" ghost @click="add">æ·»å è¡</Button> |
|---|
| | | <Button type="info" ghost @click="getRows">è·åéä¸çè¡</Button> |
|---|
| | | </div> |
|---|
| | | <vol-table |
|---|
| | | ref="table" |
|---|
| | | :linkView="_linkView" |
|---|
| | | :columns="columns" |
|---|
| | | :height="400" |
|---|
| | | :index="true" |
|---|
| | | url="/api/App_Appointment/getPageData" |
|---|
| | | @loadBefore="loadBefore" |
|---|
| | | :defaultLoadPage="false" |
|---|
| | | :pagination-hide="false" |
|---|
| | | ></vol-table> |
|---|
| | | </TabPane> |
|---|
| | | <TabPane label="订åæç»" icon="md-apps"> |
|---|
| | | <VolForm ref="myform" :loadKey="loadKey" :formFileds="formFileds" :formRules="formRules"></VolForm> |
|---|
| | | <div class="m-btn"> |
|---|
| | | <Button type="info" @click="()=>{}">ä¿å</Button> |
|---|
| | | </div> |
|---|
| | | </TabPane> |
|---|
| | | <TabPane label="å款计å" icon="md-apps">2</TabPane> |
|---|
| | | <TabPane label="å款æ
åµ" icon="md-apps">2</TabPane> |
|---|
| | | </Tabs> |
|---|
| | | </div> |
|---|
| | | <br /> |
|---|
| | | <br /> |
|---|
| | | <br /> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import VolForm from "@/components/basic/VolForm.vue"; |
|---|
| | | import VolTable from "@/components/basic/VolTable.vue"; |
|---|
| | | import VolBox from "@/components/basic/VolBox.vue"; |
|---|
| | | export default { |
|---|
| | | components: { |
|---|
| | | VolForm, |
|---|
| | | VolTable, |
|---|
| | | VolBox |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | row: {}, |
|---|
| | | loadKey: true, //å¦ææä¸ææ¡ç表åï¼è¿é设置为true,èªå¨ç»å®ä¸ææ¡æ°æ® |
|---|
| | | formFileds: { |
|---|
| | | Variety: "", |
|---|
| | | AgeRange: "", |
|---|
| | | DateRange: [], |
|---|
| | | City: "", |
|---|
| | | AvgPrice: 8.88, |
|---|
| | | Date: "" |
|---|
| | | }, |
|---|
| | | formRules: [ |
|---|
| | | [ |
|---|
| | | { |
|---|
| | | dataKey: "age", //åå°ä¸ææ¡å¯¹åºçæ°æ®åå
¸ç¼å· |
|---|
| | | data: [], //loadKey设置为true,ä¼æ ¹æ®dataKeyä»åå°çä¸ææ¡æ°æ®æºä¸èªå¨å è½½æ°æ® |
|---|
| | | title: "æé¾", |
|---|
| | | filter: true, |
|---|
| | | required: true, //设置为å¿
é项 |
|---|
| | | field: "AgeRange", |
|---|
| | | type: "select" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | title: "åç§", |
|---|
| | | dataKey: "pz", |
|---|
| | | //å¦æè¿éç»å®äºdataæ°æ®ï¼åå°ä¸ä¼å è½½æ¤æ°æ®æº |
|---|
| | | data: [ |
|---|
| | | { key: "1", value: "1" }, |
|---|
| | | { key: "2", value: "2" } |
|---|
| | | ], |
|---|
| | | required: false, |
|---|
| | | field: "Variety", |
|---|
| | | type: "select" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | dataKey: "city", |
|---|
| | | title: "åå¸", |
|---|
| | | required: true, |
|---|
| | | data: [], |
|---|
| | | field: "City", |
|---|
| | | type: "select" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | [ |
|---|
| | | { |
|---|
| | | type: "decimal", |
|---|
| | | title: "æ交åä»·", |
|---|
| | | required: true, |
|---|
| | | field: "AvgPrice" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | title: "æ¥æ", |
|---|
| | | required: true, |
|---|
| | | field: "Date", |
|---|
| | | placeholder: "ä½ å¯ä»¥è®¾ç½®colSizeå±æ§å³å®æ ç¾çé¿åº¦ï¼å¯éå¼12/8/6/4", |
|---|
| | | colSize: 8, //设置宽度为2/3 |
|---|
| | | type: "date" |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | ], |
|---|
| | | columns: [ |
|---|
| | | { |
|---|
| | | field: "Name", |
|---|
| | | title: "å§å", |
|---|
| | | type: "string", |
|---|
| | | width: 100, |
|---|
| | | sortable: true, |
|---|
| | | edit:{type:"text"} |
|---|
| | | }, |
|---|
| | | { field: "Describe", title: "æè¿°", type: "string", width: 180, edit:{type:"text"} }, |
|---|
| | | { field: "PhoneNo", title: "çµè¯", type: "string", width: 130 , edit:{type:"text"}}, |
|---|
| | | { |
|---|
| | | field: "CreateID", |
|---|
| | | title: "CreateID", |
|---|
| | | type: "int", |
|---|
| | | width: 80, |
|---|
| | | hidden: true |
|---|
| | | }, |
|---|
| | | { field: "Creator", title: "å建人", type: "string", width: 130 } |
|---|
| | | ] |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | rowChangeLoadData(row) { |
|---|
| | | //éä¸è¡å触åæ©å±tabsçæ¹æ³ï¼å¯ä»¥å¨æ¤å¤å è½½tabséçæ°æ® |
|---|
| | | // this.http.post("/xxx",{},'æ£å¨å è½½æ°æ®').then(x=>{ |
|---|
| | | // }) |
|---|
| | | if (this.$refs.table) { |
|---|
| | | this.row = row; //ä¿åå½å触åçè¡æ°æ®ï¼ä¸é¢æ¥è¯¢æ¶ç¨ |
|---|
| | | //触åtableæ¥è¯¢ |
|---|
| | | this.$refs.table.load(null, true); |
|---|
| | | } |
|---|
| | | console.log("éä¸è¡è§¦åtabsæ¹æ³ï¼" + JSON.stringify(row)); |
|---|
| | | }, |
|---|
| | | loadBefore(param, callBack) { |
|---|
| | | //åéæ¶è§¦åæ¥è¯¢åæ¹æ³ |
|---|
| | | //æ¥è¯¢å设置æ¥è¯¢æ¡ä»¶ååé¡µä¿¡æ¯ |
|---|
| | | //æ ¹æ®å½åå段æ¥è¯¢ |
|---|
| | | param.wheres = [{ name: "Name", value: this.row.Name }]; |
|---|
| | | callBack(true); |
|---|
| | | }, |
|---|
| | | _linkView(row, column) { |
|---|
| | | this.text = |
|---|
| | | "ç¹å»åå
æ ¼çå¼¹åºæ¡ï¼å½åç¹å»çè¡æ°æ®ï¼" + JSON.stringify(row); |
|---|
| | | this.viewModel = true; |
|---|
| | | // this.$message.error(JSON.stringify(row)); |
|---|
| | | }, |
|---|
| | | del() { |
|---|
| | | let rows = this.$refs.table.getSelected(); |
|---|
| | | if (rows.length == 0) { |
|---|
| | | return this.$message.error("请å
éä¸è¡"); |
|---|
| | | } |
|---|
| | | this.$refs.table.delRow(); |
|---|
| | | }, |
|---|
| | | clear() { |
|---|
| | | this.tableData.splice(0); |
|---|
| | | }, |
|---|
| | | add() { |
|---|
| | | this.$refs.table.addRow({}); |
|---|
| | | // this.tableData.push({}); |
|---|
| | | }, |
|---|
| | | getRows() { |
|---|
| | | let rows = this.$refs.table.getSelected(); |
|---|
| | | if (rows.length == 0) { |
|---|
| | | return this.$message.error("请å
éä¸è¡1"); |
|---|
| | | } |
|---|
| | | this.text = "å½åéä¸çè¡æ°æ®ï¼" + JSON.stringify(rows); |
|---|
| | | this.viewModel = true; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style lang="less" scoped> |
|---|
| | | .m-detail { |
|---|
| | | min-height: 400px; |
|---|
| | | margin-top: 20px; |
|---|
| | | .m-tabs { |
|---|
| | | background: white; |
|---|
| | | padding: 0 15px; |
|---|
| | | } |
|---|
| | | .m-title { |
|---|
| | | padding: 0 15px; |
|---|
| | | h2 { |
|---|
| | | font-weight: 500; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .m-btn { |
|---|
| | | text-align: right; |
|---|
| | | padding: 10px 0; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | |
|---|
| | | import { h, resolveComponent } from 'vue'; |
|---|
| | | let extension = { |
|---|
| | | components: {//å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | gridHeader: '', |
|---|
| | | gridBody: { |
|---|
| | | render() { |
|---|
| | | return h(resolveComponent('ElAlert'), { |
|---|
| | | style: { 'margin-bottom': '12px' }, |
|---|
| | | 'show-icon': true, |
|---|
| | | type: 'success', |
|---|
| | | closable: false, |
|---|
| | | }, [h('p', {}, '1ã onInitedä¸éæ°å®ä¹è¡¨å¤´æ°æ®,2021.01.08æ´æ°voltable.vueåæè½ä½¿ç¨'), |
|---|
| | | h('p', {}, ' 2ãå
·ä½è§ï¼App_Appointment2.jsä¸é
ç½®(ç°å¨åªæ¯æå°äºçº§è¡¨å¤´ãä¸æ¯æç¼è¾ä¸å¤ææä½)')]); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | gridFooter: '', |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | tableAction:"App_Appointment", |
|---|
| | | text: "页é¢å
¨é¨ç±ä»£ç çæå¨çæï¼åªéè¦å¨onInitedä¸éæ°é
置表头æ°æ®", |
|---|
| | | methods: {//äºä»¶æ©å± |
|---|
| | | onInit() { |
|---|
| | | //设置表çæ大é«åº¦ |
|---|
| | | this.tableMaxHeight = 300; |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | this.columns.splice(0); |
|---|
| | | this.columns.push(...[ |
|---|
| | | { |
|---|
| | | field: 'Name', title: 'åºç¡ä¿¡æ¯', type: 'string', align: 'center', |
|---|
| | | children: [ |
|---|
| | | { field: 'Name', title: 'ç¨æ·å§å', type: 'string', link: true, width: 100, sortable: true }, |
|---|
| | | { field: 'PhoneNo', title: 'çµè¯', type: 'string', width: 130 }, |
|---|
| | | { field: 'Describe', title: 'æè¿°ä¿¡æ¯', type: 'string', width: 180 }, |
|---|
| | | ] |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: 'Name', title: 'å建人信æ¯', type: 'string', align: 'center', |
|---|
| | | children: [ |
|---|
| | | { field: 'Id', title: '主é®ID', type: 'string', width: 90, hidden: true }, |
|---|
| | | { field: 'CreateDate', title: 'å建æ¶é´', type: 'datetime', width: 120, sortable: true }, |
|---|
| | | { field: 'Creator', title: 'å建人', type: 'string', width: 130, align: 'left' }] |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: 'Name', title: 'ä¿®æ¹äººä¿¡æ¯', type: 'string', align: 'center', |
|---|
| | | children: [ |
|---|
| | | { field: 'Modifier', title: 'ä¿® æ¹ äºº', type: 'string', width: 130, align: 'left' }, |
|---|
| | | { field: 'ModifyDate', title: 'ä¿®æ¹æ¶é´', type: 'datetime', width: 150, sortable: true }] |
|---|
| | | } |
|---|
| | | ] |
|---|
| | | ) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | //1ãæ¤æ件ä¸ç代ç é½æ¯å¯¹åºç¡ä¸å¡è¿è¡æ©å±ï¼ä¹åªè½å¨æ¤å¤ç¼å代ç ï¼å
¶ä»å°æ¹ç¼åç代ç ä¼è¢«ä»£ç çæå¨çæç代ç è¦ç |
|---|
| | | //2ãæ¤æ件ä¸çæ¹æ³ä¼ä¸serviceFilter.jsè¿è¡å并ï¼ç»ç»æ§è¡çå°±æ¯æ¤æ件ä¸çæ¹æ³ |
|---|
| | | //3ãcomponents为æ©å±ç»ä»¶ï¼å¯èªå®ä¹é¡µé¢ç头é¨ãbodyåå°¾é¨çé¢å¤æ¾ç¤ºçå
容ï¼åå«å¯¹åºçç»ä»¶ä¸º: |
|---|
| | | //gridHeaderãgridBodyãgridFooterãmodelHeaderãmodelBodyãmodelFooterå
±6个ç»ä»¶ä½ç½®ï¼å¦æä¸éè¦æ©å±ç»ä»¶ï¼è¯·å¿½ç¥æ¤å¤ |
|---|
| | | //4ãtext为çé¢æ¾ç¤ºé¢å¤æè¿°ä¿¡æ¯ |
|---|
| | | //5ãbuttons->view/box/detailåå«ä¸ºæ¥è¯¢çé¢ãå¼¹åºæ¡ãå¼¹åºæ¡æç»è¡¨é¢å¤æ©å±çæé® |
|---|
| | | //6ãmethods为æ´ä¸ªé¡µé¢æææ¹æ³çä¸å¡ä»£ç æ©å±ï¼å¦æéè¦å¨çé¢ä¸çæä½åãåç¼åä¸å¡ï¼è¯·è¦çæ¤æ¹æ³ |
|---|
| | | //7ãmethodsæ¹æ³ä¸å¯è·åä»»ævue对象ãæ¹æ³ãå±æ§,å¯æ¥çViewGridConfigè·¯å¾ä¸çjsæ件åViewGrid.vueçdataå±æ§ |
|---|
| | | //å¦æå¨å·æ°è¡¨æ°æ®:this.search(); |
|---|
| | | //è·å表çåé
置信æ¯:this.columns æç»è¡¨è¡¨çé
置信æ¯this.detail.columns |
|---|
| | | //8ãè·ååç»ä»¶gridHeaderãgridBodyãgridFooterãmodelHeaderãmodelBodyãmodelFooteråä½¿ç¨ |
|---|
| | | //this.$refs.gridHeaderè·ågridHeader为èªå·±æ©å±ç对象 |
|---|
| | | //9ãå¨åç»ä»¶gridHeaderãgridBodyãgridFooterãmodelHeaderãmodelBodyãmodelFooterçæ¹æ³ä¸è°ç¨å¹¶è·å¾ç¶ç»ä»¶ |
|---|
| | | // this.$emit("parentCall", $vue => {}) //$vue为ç¶ç»ä»¶å¯¹è±¡ï¼å
·ä½ä½¿ç¨åèorder->GridHeader.vueæ件 |
|---|
| | | |
|---|
| | | //10ãåç¶ä»¶ä¼ åé¤8ã9æ¹å¼ï¼å¦å¯ä½¿ç¨å·²å°è£
çvuex,使ç¨æ¹å¼:this.$store.getters.data().xxx = this;使ç¨å®ä¾ï¼App_News.js |
|---|
| | | |
|---|
| | | //æ¤å¤çä¸é¢çå±æ§ä¸æ¹æ³é½æ¯å¯¹åºç¡ä¸å¡ä»£ç çæ©å±ï¼å¦æä¸éè¦æ©å±å忽ç¥å¯¹åºçæ¹æ³ä¹ä¸è¦åå¨ä¸é¢ |
|---|
| | | //serviceFilter.js |
|---|
| | | //æçæ件é½æç»ä¼å并å°ViewGrid.vueæä»¶ä¸ |
|---|
| | | |
|---|
| | | import { h, resolveComponent } from 'vue'; |
|---|
| | | import gridHeader from "./SellOrderComponents/GridHeader.vue" |
|---|
| | | import gridFooter from "./SellOrderComponents/GridFooter.vue" |
|---|
| | | import modelFooter from "./SellOrderComponents/ModelFooter.vue" |
|---|
| | | import modelBody from "./SellOrderComponents/ModelBody.vue" |
|---|
| | | let extension = { |
|---|
| | | components: {//å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | gridHeader: gridHeader, |
|---|
| | | gridBody: { |
|---|
| | | render() { |
|---|
| | | return [ |
|---|
| | | h(resolveComponent('el-alert'), { |
|---|
| | | style: { 'margin-bottom': '12px' }, |
|---|
| | | 'show-icon': true, type: 'warning', |
|---|
| | | closable: false, title: 'ä¸å¯¹ä¸å
¨é¨ç±ä»£ç çæä¸éè¦åä»»ä½ä»£ç ,ç¹å»æ°å»ºæç¼è¾æ¥çæç»è¡¨,å¯æ ¹æ®éè¦å®ç°æ©å±gridHeaderãgridBodyãgridFooterãmodelHeaderãmodelBodyãmodelFooterä»»æä½ç½®' |
|---|
| | | }, ''), |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | gridFooter: gridFooter, |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: "", |
|---|
| | | modelBody: modelBody, |
|---|
| | | modelFooter: modelFooter, |
|---|
| | | }, |
|---|
| | | text: "示ä¾è¦çå
¨é¨å¯æ©å±æ¹æ³,åå°æ©å±æ件SellOrder.jsï¼åå°Partial->SellOrdeService.cs", |
|---|
| | | //this.filterPermission('表å','æéå¼ï¼å¦:Add')æ¥å¤æ页é¢ä¸æ¯å¦ææ个æé®çæé |
|---|
| | | buttons: { //æ ¹æ®éè¦èªè¡å®ç°æ©å±æé® |
|---|
| | | //注ï¼æ²¡æç¼è¾ææ°å»ºæéçæ
åµä¸ï¼æ¯ä¸ä¼æ¾ç¤ºæ¤å¤æ·»å çæ©å±æé®ï¼å¦æä»éè¦æ¾ç¤ºæ¤å¤çæé®ï¼å¯ä»¥ææé®å¨methodsçonInitedæ¹æ³ä¸æ·»å ,å¦ï¼this.boxButtons.push(...) |
|---|
| | | view: [//ViewGridæ¥è¯¢çé¢æé® |
|---|
| | | |
|---|
| | | ], |
|---|
| | | box: //æ°å»ºãç¼è¾å¼¹åºæ¡æé® |
|---|
| | | [//ViewGridæ¥è¯¢çé¢æé® |
|---|
| | | { |
|---|
| | | name: "ç¹æ1", |
|---|
| | | icon: 'el-icon-delete', |
|---|
| | | value: 'Edit', |
|---|
| | | class: '', |
|---|
| | | type: 'success', |
|---|
| | | index: 1,//æ¾ç¤ºçä½ç½® |
|---|
| | | onClick: function () { |
|---|
| | | this.$message.error("æ©å±çæç»Boxæé®,å¯è®¾ç½®indexå¼æå®æ¾ç¤ºä½ç½®,å¯ä½¿ç¨this.$refsæ¿å°å
æ¬èªå®ä¹æ©å±çææç»ä»¶"); |
|---|
| | | } |
|---|
| | | }], |
|---|
| | | detail: //æ°å»ºãç¼è¾å¼¹åºæ¡æç»è¡¨table表æé® |
|---|
| | | [//ViewGridæ¥è¯¢çé¢æé® |
|---|
| | | { |
|---|
| | | name: "ç¹æ2", |
|---|
| | | icon: 'el-icon-delete', |
|---|
| | | value: 'Edit', |
|---|
| | | class: '', |
|---|
| | | type: 'success', |
|---|
| | | index: 1,//æ¾ç¤ºçä½ç½® |
|---|
| | | onClick: function () { |
|---|
| | | this.$message.error("æ©å±çæç»tableæé®,å¯è®¾ç½®indexå¼æå®æ¾ç¤ºä½ç½®"); |
|---|
| | | } |
|---|
| | | }] |
|---|
| | | },//æ©å±çæé® |
|---|
| | | methods: { |
|---|
| | | //æ©å±æ¹æ³ä½¿ç¨ç¤ºä¾,æ ¹æ®éè¦å®è¡ä¸é¢çæ¹æ³ |
|---|
| | | getServiceDate() { |
|---|
| | | this.http.post("/api/SellOrder/getServiceDate", {}, 'æ£å¨è°ç¨åå°æ°æ®').then(date => { |
|---|
| | | this.$message.error("ä»åå°è·åçæå¡å¨æ¶é´æ¯ï¼" + date); |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | | //this.$message.success('mountedæ¹æ³æ§è¡æ¶,ä½ å¯ä»¥æ¤å¤ç¼åä¸å¡é»è¾'); |
|---|
| | | }, |
|---|
| | | //æ¹å¼1,éè¿selectéæ©è§¦åæ¾ç¤ºä¸éè |
|---|
| | | onInit() { |
|---|
| | | |
|---|
| | | this.buttons.splice(1,0,...[ |
|---|
| | | { |
|---|
| | | name: "ç¹æå¼¹åºæ¡", |
|---|
| | | icon: 'md-create', |
|---|
| | | value: 'Edit', |
|---|
| | | class: '', |
|---|
| | | type: 'primary', |
|---|
| | | index: 1,//æ¾ç¤ºçä½ç½® |
|---|
| | | onClick: function () { //æ©å±æé®æ§è¡äºä»¶ |
|---|
| | | //thiså¯ä»¥è·åææå±æ§ï¼å
æ¬this.$refs.gridHeader/gridBodyçè·åæ©å±ç»ä»¶å¯¹è±¡ |
|---|
| | | // this.$message("æµè¯æ©å±æé®"); |
|---|
| | | this.$refs.gridHeader.open1(); |
|---|
| | | } |
|---|
| | | }, { |
|---|
| | | name: "è°ç¨åå°", |
|---|
| | | icon: 'md-create', |
|---|
| | | value: 'Edit', |
|---|
| | | class: '', |
|---|
| | | type: 'primary', |
|---|
| | | index: 1,//æ¾ç¤ºçä½ç½® |
|---|
| | | onClick: function () { //æ©å±æé®æ§è¡äºä»¶ |
|---|
| | | this.getServiceDate(); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | ]) |
|---|
| | | |
|---|
| | | //è·å订åç±»åselecté
ç½®ï¼å½å订åç±»åselectæ¹åå¼æ¶ï¼å¨æ设置Remark,SellNo两个å段æ¯å¦æ¾ç¤º |
|---|
| | | var orderTypeOption = this.getFormOption("OrderType"); |
|---|
| | | orderTypeOption.onChange = (val) => { |
|---|
| | | //å½è®¢åç±»åselectæ¹åå¼æ¶ï¼å¦æéä¸çæ¯åè´§(对åºåå
¸ç¼å·ä¸º2)ï¼emark,SellNoéèï¼å¦åæ¾ç¤ºåºæ¥ |
|---|
| | | this.getFormOption("Remark").hidden = val == "2" |
|---|
| | | // var sellNoOption = this.getFormOption("SellNo").hidden = val == "2" |
|---|
| | | } |
|---|
| | | |
|---|
| | | //ç¹å»åå
æ ¼ç¼è¾ä¸ç»æç¼è¾(é»è®¤æ¯ç¹å»åå
æ ¼ç¼è¾ï¼é¼ æ 离å¼ç»æç¼è¾) |
|---|
| | | this.detailOptions.clickEdit = true; |
|---|
| | | |
|---|
| | | |
|---|
| | | //设置主表å计 |
|---|
| | | this.summary = true; |
|---|
| | | //设置æç»è¡¨å计 |
|---|
| | | this.detailOptions.summary = true; |
|---|
| | | //è¡¨æ ¼è®¾ç½®ä¸ºåé |
|---|
| | | // this.single=true; |
|---|
| | | // this.detailOptions.single=true; |
|---|
| | | //设置ç¼è¾è¡¨åæ°éå段çæå°ä¸æå¤§å¼ |
|---|
| | | this.editFormOptions.forEach(x => { |
|---|
| | | x.forEach(item => { |
|---|
| | | //设置è¾å
¥çæ°éçæå°å¼ä¸æ大å¼(é»è®¤æ¯1) |
|---|
| | | if (item.field == "Qty") { |
|---|
| | | item.min = 10; |
|---|
| | | item.max =100000; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }) |
|---|
| | | |
|---|
| | | //å¨æä¿®æ¹table并ç»åæ·»å äºä»¶ |
|---|
| | | this.columns.forEach(x => { |
|---|
| | | if (x.field == "Qty") { |
|---|
| | | x.formatter = (row) => { |
|---|
| | | return '<a style="color:#2196F3;">' + row.Qty + "(å¼¹åºæ¡)" + '</a>' |
|---|
| | | } |
|---|
| | | x.click = (row, column, event) => { |
|---|
| | | this.$refs.gridHeader.open2(row) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | |
|---|
| | | //å¨æ设置æ¥è¯¢çé¢tableé«åº¦ |
|---|
| | | this.tableHeight = 300; |
|---|
| | | |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | this.detailOptions.columnIndex=false; |
|---|
| | | this.detailOptions.ck=true; |
|---|
| | | //设置主表æ±å段ï¼åå°éè¦å®ç°SummaryExpressæ¹æ³ |
|---|
| | | this.columns.forEach(x => { |
|---|
| | | if (x.field == 'Qty'||x.field=='Weight') { |
|---|
| | | x.summary = true; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | //设置æç»è¡¨é«åº¦ |
|---|
| | | this.detailOptions.height = 220; |
|---|
| | | this.boxOptions.height = document.body.clientHeight * 0.90; |
|---|
| | | //设置æç»è¡¨æ±åå段ï¼åå°éè¦å®ç°GetDetailSummaryæ¹æ³ |
|---|
| | | this.detailOptions.columns.forEach(x => { |
|---|
| | | if (x.field == 'Weight' || x.field == 'Qty') { |
|---|
| | | x.summary = true; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | // this.$message.success('createæ¹æ³æ§è¡å', desc: 'ä½ å¯ä»¥SellOrder.jsä¸ç¼åä¸å¡é»è¾,å
¶ä»æ¹æ³åæ ·éç¨' }); |
|---|
| | | }, |
|---|
| | | searchBefore(param) { //æ¥è¯¢ViewGird表æ°æ®å,paramæ¥è¯¢åæ° |
|---|
| | | //ä½ å¯ä»¥æå®paramæ¥è¯¢çåæ°ï¼å¤å¦æè¿åfalseï¼åä¸ä¼æ§è¡æ¥è¯¢ |
|---|
| | | // this.$message.success(this.table.cnName + ',æ¥è¯¢å' }); |
|---|
| | | // console.log("æ©å±ç"this.detailOptions.cnName + '触åloadDetailTableBefore'); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | searchAfter(result) { //æ¥è¯¢ViewGird表æ°æ®åparamæ¥è¯¢åæ°,resultåè¿æ¥è¯¢çç»æ |
|---|
| | | // this.$notify({ |
|---|
| | | // title: 'æ¥è¯¢ç»æ', |
|---|
| | | // message: 'è¿åç对象ï¼' + JSON.stringify(result), |
|---|
| | | // type: 'success' |
|---|
| | | // }); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | searchDetailBefore(param) {//æ¥è¯¢ä»è¡¨è¡¨æ°æ®å,paramæ¥è¯¢åæ° |
|---|
| | | // this.$message.success(this.detailOptions.cnName + 'æ¥è¯¢å' }); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | searchDetailAfter(data) {//æ¥è¯¢ä»è¡¨åparamæ¥è¯¢åæ°,resultåè¿æ¥è¯¢çç»æ |
|---|
| | | // this.$notify({ |
|---|
| | | // title: 'æç»æ¥è¯¢ç»æ', |
|---|
| | | // message: 'è¿åç对象ï¼' + JSON.stringify(data), |
|---|
| | | // type: 'success' |
|---|
| | | // }); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | delBefore(ids, rows) { //æ¥è¯¢çé¢ç表å é¤å ids为å é¤çidæ°ç»,rowså é¤çè¡ |
|---|
| | | let auditStatus = rows.some(x => { return x.AuditStatus > 0 }); |
|---|
| | | // if (auditStatus) { |
|---|
| | | // this.$message.error('åªè½å é¤æªå®¡æ ¸çæ°æ®') |
|---|
| | | // return false; |
|---|
| | | // } |
|---|
| | | this.$message.success('å é¤åï¼éæ©çId:' + ids.join(',')); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | delAfter(result) {//æ¥è¯¢çé¢ç表å é¤å |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | delDetailRow(rows) { //å¼¹åºæ¡å é¤æç»è¡¨çè¡æ°æ®(åªæ¯å¯¹tableæä½ï¼å¹¶æ²¡ææä½åå°) |
|---|
| | | console.log(rows) |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | addBefore(formData) { //æ°å»ºä¿ååformData为对象ï¼å
æ¬æç»è¡¨ |
|---|
| | | //formDataæ ¼å¼ï¼ |
|---|
| | | // { |
|---|
| | | // mainData: { 主表å段1: 'x1', 主表å段2: 'x2' }, |
|---|
| | | // detailData: [{ æç»è¡¨å段1: d1 }], |
|---|
| | | // delKeys: null //å é¤æç»è¡¨è¡æ°æ®çid |
|---|
| | | // } |
|---|
| | | |
|---|
| | | //formData.mainData.xxx="xxxx";//è¿å¯ä»¥ç»§ç»æå¨æ·»å å¼ |
|---|
| | | |
|---|
| | | //å¦æéè¦åæ¶æ交å
¶ä»æ°æ®å°åå°ï¼è¯·è®¾ç½®formData.extra=xxxx |
|---|
| | | //åå°å¨è¡¨xxxxService.csä¸éåAddæ¹æ³å³å¯ä»saveDataModelåæ°ä¸æ¿å°extraæ交ç对象 |
|---|
| | | console.log(this.detailOptions.cnName + 'æ°å»ºå,æ交çæ°æ®ï¼' + JSON.stringify(formData)); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | async addBeforeAsync(formData) { |
|---|
| | | //2020.12.06å¢å æ°å»ºåå¼æ¥æ¹æ³åæ¥å¤ç |
|---|
| | | //åè½åä¸ï¼åºå«å¨äºæ¤å¤å¯ä»¥åä¸äºå¼æ¥è¯·æ±å¤ç,å
¨ï¼ |
|---|
| | | // var _result = await this.http.post("/api/SellOrder/getPageData", {}, true).then(result => { |
|---|
| | | // console.log("1ãå¼æ¥è¯·æ±å") |
|---|
| | | // return result; |
|---|
| | | // }) |
|---|
| | | // console.log("2ãå¼æ¥è¯·æ±ï¼åæ¥å¤çç»æ:" + JSON.stringify(_result)) |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | addAfter(result) {//æ°å»ºä¿ååresultè¿åçç¶æå表å对象 |
|---|
| | | console.log(this.detailOptions.cnName + 'æ°å»ºå®æå,è¿åçæ°æ®' + JSON.stringify(result)); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | updateBefore(formData) { //ç¼è¾ä¿ååformData为对象ï¼å
æ¬æç»è¡¨ãå é¤è¡çId |
|---|
| | | //formDataæ ¼å¼ï¼(èªå·±è°è¯åºè¾ç) |
|---|
| | | // { |
|---|
| | | // mainData: { 主表å段1: 'x1', 主表å段2: 'x2' }, |
|---|
| | | // detailData: [{ æç»è¡¨å段1: d1 }], |
|---|
| | | // delKeys: null //å é¤æç»è¡¨è¡æ°æ®çid |
|---|
| | | // } |
|---|
| | | |
|---|
| | | //formData.mainData.xxx="xxxx";//è¿å¯ä»¥ç»§ç»æå¨æ·»å å¼ |
|---|
| | | |
|---|
| | | //å¦æéè¦åæ¶æ交å
¶ä»æ°æ®å°åå°ï¼è¯·è®¾ç½®formData.extra=xxxx |
|---|
| | | //åå°å¨è¡¨xxxxService.csä¸éåUpdateæ¹æ³å³å¯ä»saveDataModelåæ°ä¸æ¿å°extraæ交ç对象 |
|---|
| | | |
|---|
| | | console.log(this.detailOptions.cnName + 'ç¼è¾å,æ交çæ°æ®ï¼' + JSON.stringify(formData)); |
|---|
| | | //è·åæ©å±çmodelFooterå±æ§text |
|---|
| | | // console.log(this.$refs.modelFooter.text) |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | async updateBeforeAsync(formData) { |
|---|
| | | //2020.12.06å¢å ä¿®æ¹åå¼æ¥æ¹æ³åæ¥å¤ç |
|---|
| | | //åè½åä¸ï¼åºå«å¨äºæ¤å¤å¯ä»¥åä¸äºå¼æ¥è¯·æ±å¤ç,å
¨ï¼ |
|---|
| | | var _result = await this.http.post("/api/SellOrder/getPageData", {}, true).then(result => { |
|---|
| | | console.log("1ãå¼æ¥è¯·æ±å") |
|---|
| | | return result; |
|---|
| | | }) |
|---|
| | | console.log("2ãå¼æ¥è¯·æ±ï¼åæ¥å¤çç»æ:" + JSON.stringify(_result)) |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | updateAfter(result) {//ç¼è¾ä¿ååresultè¿åçç¶æå表å对象 |
|---|
| | | // this.$message.success(this.detailOptions.cnName + 'ç¼è¾å®æå,è¿åçæ°æ®' + JSON.stringify(result)); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | auditBefore(ids, rows) {//å®¡æ ¸å |
|---|
| | | if (rows.length > 2) {//æ¯æ¬¡æå¤åªè½å®¡æ ¸2æ¡æ°æ® |
|---|
| | | this.$message.error('æå¤åªè½éæ©ä¸¤æ¡æ°æ®'); |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | auditAfter(result, rows) {// å®¡æ ¸å |
|---|
| | | if (result.status) { |
|---|
| | | result.message = "å®¡æ ¸æåããããã" + result.message; |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | resetAddFormBefore() { //éç½®æ°å»ºè¡¨ååçå
容 |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | resetAddFormAfter() { //éç½®æ°å»ºè¡¨ååçå
容 |
|---|
| | | //å¦ææäºå段ä¸éè¦éç½®ï¼åå¯ä»¥éæ°èµå¼ |
|---|
| | | this.editFormFields.Remark = 'æ°å»ºéç½®é»è®¤å¼66666'; |
|---|
| | | //ç»æç»è¡¨æ·»å é»è®¤ä¸è¡ |
|---|
| | | this.$refs.detail.rowData.push({ Remark: "æ°å»º666666" }); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | resetUpdateFormBefore() { //éç½®ç¼è¾è¡¨ååçå
容 |
|---|
| | | //this.editFormFieldså½åå¼ |
|---|
| | | console.log(this.editFormFields) |
|---|
| | | //å½åæç»è¡¨çè¡ |
|---|
| | | console.log(this.$refs.detail.rowData) |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | resetUpdateFormAfter() { //éç½®ç¼è¾è¡¨ååçå
容 |
|---|
| | | //å¦ææäºå段ä¸éè¦éç½®ï¼åå¯ä»¥éæ°èµå¼ |
|---|
| | | this.editFormFields.Remark = 'ç¼è¾éç½®é»è®¤å¼66666'; |
|---|
| | | //ç»æç»è¡¨æ·»å é»è®¤ä¸è¡ |
|---|
| | | this.$refs.detail.rowData.push({ Remark: "ç¼è¾666666" }); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | importAfter(data) { //导å
¥excelåå·æ°tableè¡¨æ ¼æ°æ® |
|---|
| | | this.search(); //å·æ°table |
|---|
| | | }, |
|---|
| | | modelOpenBefore(row) { //ç¹å»ç¼è¾/æ°å»ºæé®å¼¹åºæ¡åï¼å¯ä»¥å¨æ¤å¤åé»è¾ï¼å¦ï¼ä»åå°è·åæ°æ® |
|---|
| | | |
|---|
| | | }, |
|---|
| | | async modelOpenBeforeAsync(row) { //ç¹å»ç¼è¾/æ°å»ºæé®å¼¹åºæ¡åï¼å¯ä»¥å¨æ¤å¤åé»è¾ï¼å¦ï¼ä»åå°è·åæ°æ® |
|---|
| | | //2021.01.10 |
|---|
| | | if (row) { |
|---|
| | | console.log("ç¼è¾æä½") |
|---|
| | | } else { |
|---|
| | | console.log("æ°å»ºæä½") |
|---|
| | | } |
|---|
| | | //æå¼å¼¹åºæ¡åï¼http请æ±åæ¥æ§è¡ |
|---|
| | | // var _result = await this.http.post("url", {}, true).then(result => { |
|---|
| | | |
|---|
| | | // _result = result; |
|---|
| | | // }) |
|---|
| | | // console.log(result); |
|---|
| | | //è¿åfalseä¸ä¼å¼¹åºæ¡ |
|---|
| | | //this.$message.error("ä¸è½æå¼å¼¹åºæ¡ "); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | getFormOption(field) { |
|---|
| | | let option; |
|---|
| | | this.editFormOptions.forEach(x => { |
|---|
| | | x.forEach(item => { |
|---|
| | | if (item.field == field) { |
|---|
| | | option = item; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | return option; |
|---|
| | | }, |
|---|
| | | |
|---|
| | | //æ¹å¼2,éè¿æå¼å¼¹åºæ¡æ¶è§¦åæ¾ç¤ºä¸éè |
|---|
| | | modelOpenAfter(row) { //ç¼è¾ææ°å»ºæ¶ï¼æ ¹æ®ä¸åçæ
åµæ§å¶å段æ¯å¦æ¾ç¤º |
|---|
| | | // this.editFormOptions.forEach(x => { |
|---|
| | | // x.forEach(item => { |
|---|
| | | // if (item.field == "Remark" || item.field == "SellNo") { |
|---|
| | | // //å¦æä¸æ¯æ°å»ºï¼åéèRemark,SellNo两个å段æ¯å¦æ¾ç¤º |
|---|
| | | // //ä¹å¯ä»¥æ ¹æ®rowå½åç¼è¾è¡çå¼æ¥å¤ç |
|---|
| | | // this.$set(item, "hidden", this.currentAction != "Add") |
|---|
| | | // } |
|---|
| | | // }) |
|---|
| | | // }) |
|---|
| | | }, |
|---|
| | | rowClick({ row, column, event }) { //æ¥è¯¢çé¢tableç¹å»è¡éä¸å½åè¡ |
|---|
| | | this.$refs.table.$refs.table.toggleRowSelection(row); |
|---|
| | | }, |
|---|
| | | // detailRowClick ({ row, column, event }) { |
|---|
| | | // //ç¼è¾å¼¹åºæ¡ä»è¡¨tableç¹å»è¡éä¸å½åè¡ï¼æ²¡æä»è¡¨çä¸ç¨ç®¡ |
|---|
| | | // this.$refs.detail.$refs.table.toggleRowSelection(row); |
|---|
| | | // } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | import gridFooter from "./SellOrder2/SellOrder2GridFooter.vue" |
|---|
| | | |
|---|
| | | //èªå®ä¹ä»è¡¨éæ©æ°æ®æºé¡µé¢ |
|---|
| | | import modelBody from "./SellOrder2/SellOrder2ModelBody.vue" |
|---|
| | | import { h, resolveComponent } from 'vue'; |
|---|
| | | let extension = { |
|---|
| | | components: {//å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | gridHeader: '',//{ template: "<div>æ©å±ç»xx件</div>" }, |
|---|
| | | gridBody: { |
|---|
| | | render() { |
|---|
| | | return [ |
|---|
| | | h(resolveComponent('el-alert'), { |
|---|
| | | style: { 'margin-bottom': '12px' }, |
|---|
| | | 'show-icon': true, type: 'success', |
|---|
| | | closable: false, title: 'çé¢ç±ä»£ç çæå¨çæ,åªéå è¡ä»£ç å³å¯å®ç°ç¹å»ä¸»è¡¨è¡æ¾ç¤ºæç»è¡¨æ°æ®(ç´æ¥æ©å±gridFooterä½ç½®ç代ç ,å
·ä½ä»£ç è§æ¤ç¤ºä¾:SellOrder2.js)' |
|---|
| | | }, ''), |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | gridFooter: gridFooter, |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: "", |
|---|
| | | modelBody: modelBody,//èªå®ä¹ä»è¡¨éæ©æ°æ®æºé¡µé¢ |
|---|
| | | modelFooter: "", |
|---|
| | | }, |
|---|
| | | text: "ç¹å»ä¸»è¡¨è¡å è½½æç»è¡¨æ°æ®,å¦ææ¬å°çä¸å°æ¤èå,å¯ä»¥æç
§æ¼ç¤ºç¯å¢é
ç½®ä¸æ¤é¡µé¢èå", |
|---|
| | | buttons: { //æ ¹æ®éè¦èªè¡å®ç°æ©å±æé® |
|---|
| | | },//æ©å±çæé® |
|---|
| | | methods: { |
|---|
| | | mounted() { |
|---|
| | | }, |
|---|
| | | //æ¹å¼1,éè¿selectéæ©è§¦åæ¾ç¤ºä¸éè |
|---|
| | | onInit() { |
|---|
| | | //ç¹å»åå
æ ¼ç¼è¾ä¸ç»æç¼è¾(é»è®¤æ¯ç¹å»åå
æ ¼ç¼è¾ï¼é¼ æ 离å¼ç»æç¼è¾) |
|---|
| | | this.detailOptions.clickEdit = true; |
|---|
| | | //设置主表å计 |
|---|
| | | this.summary = true; |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | //è°æ´çé¢tableé«åº¦ |
|---|
| | | this.height = this.height - 310; |
|---|
| | | |
|---|
| | | //æç»è¡¨éæ©æ°æ®æºæä½ |
|---|
| | | //è·åæç»è¡¨å¤æ³¨åï¼ç»å¤æ³¨åæ·»å éæ©æ°æ®æä½ |
|---|
| | | |
|---|
| | | this.detailOptions.buttons.unshift({ |
|---|
| | | 'name': 'éæ©æ°æ®', |
|---|
| | | icon: "el-icon-plus", |
|---|
| | | onClick: () => { |
|---|
| | | this.$refs.modelBody.open(); |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | // let _column = this.detailOptions.columns.find(x => { return x.field == "Remark" }); |
|---|
| | | // _column.title="(å¤æ³¨)ç¹å»éæ©æ°æ®" |
|---|
| | | // //移é¤ç¼è¾æä½ |
|---|
| | | // _column.edit = null; |
|---|
| | | // //ç»å¤æ³¨åæ·»å éæ©æ°æ®æä½ |
|---|
| | | // _column.render = (h, { row, column, index }) => { |
|---|
| | | // return h("div", { style: {} }, |
|---|
| | | // [ |
|---|
| | | // h("i", { |
|---|
| | | // class: ["el-icon-zoom-out"], |
|---|
| | | // style: { |
|---|
| | | // cursor: "pointer", |
|---|
| | | // "margin-right": "8px", |
|---|
| | | // color: "#409eff", |
|---|
| | | // }, |
|---|
| | | // onClick: (e) => { |
|---|
| | | // e.stopPropagation(); |
|---|
| | | // //å¼¹åºéæ©æ°æ®æº |
|---|
| | | // this.$refs.modelBody.open(row); |
|---|
| | | // }, |
|---|
| | | // }), |
|---|
| | | // ], row.Remark) |
|---|
| | | // }; |
|---|
| | | }, |
|---|
| | | // rowDbClick({ row, column, event }){//åå»äºä»¶ |
|---|
| | | // }, |
|---|
| | | rowClick({ row, column, event }) { //æ¥è¯¢çé¢tableç¹å»è¡éä¸å½åè¡ |
|---|
| | | //åæ¶å
¶ä»è¡éä¸ |
|---|
| | | this.$refs.table.$refs.table.clearSelection(); |
|---|
| | | //设置éä¸å½åè¡ |
|---|
| | | this.$refs.table.$refs.table.toggleRowSelection(row); |
|---|
| | | if (this.$refs.gridFooter && this.$refs.gridFooter.$refs.tableList) { |
|---|
| | | //loadæ¹æ³å¯åç
§voltableç»ä»¶apiææ¡£ |
|---|
| | | this.$refs.gridFooter.$refs.tableList.load({ value: row.Order_Id, sort: "CreateDate" }) |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | searchAfter(rows) { |
|---|
| | | //页é¢å è½½æè
å·æ°æ°æ®åç´æ¥æ¾ç¤ºç¬¬ä¸è¡çæç» |
|---|
| | | if (rows.length) { |
|---|
| | | // this.$nextTick(() => { |
|---|
| | | this.$refs.gridFooter.$refs.tableList.load({ value: rows[0].Order_Id, sort: "CreateDate" }) |
|---|
| | | // }) |
|---|
| | | } else { |
|---|
| | | //没ææ°æ®æ¶ï¼æ¸
空æç»æ°æ® |
|---|
| | | this.$refs.gridFooter.$refs.tableList.rowData.splice(0) |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div style="padding: 0 4px;border-top: 10px solid #eee;"> |
|---|
| | | <h3 > |
|---|
| | | <i class="ivu-icon ivu-icon-ios-information-circle-outline"></i>订åæç» |
|---|
| | | </h3> |
|---|
| | | <div style="padding:10px;background: white;padding-top: 0;"> |
|---|
| | | <vol-table ref="tableList" |
|---|
| | | :loadKey="true" |
|---|
| | | :columns="columns" |
|---|
| | | :pagination-hide="true" |
|---|
| | | :height="210" |
|---|
| | | :defaultLoadPage="false" |
|---|
| | | @loadBefore="loadBefore" |
|---|
| | | url="/api/SellOrder/getDetailPage" |
|---|
| | | :row-index="true" |
|---|
| | | :index="false"></vol-table> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import VolTable from "@/components/basic/VolTable.vue"; |
|---|
| | | export default { |
|---|
| | | components: { |
|---|
| | | VolTable |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | loadBefore (params, callback) { |
|---|
| | | return callback(true); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | data () { |
|---|
| | | return { |
|---|
| | | tableData: [], |
|---|
| | | //ä»çæç代ç sellorder2.vueéé¢ææç»é
ç½®å¤å¶è¿æ¥å°±è½ç¨ |
|---|
| | | columns: [{field:'OrderList_Id',title:'OrderList_Id',type:'string',width:90,hidden:true,require:true,align:'left'}, |
|---|
| | | {field:'Order_Id',title:'订åId',type:'string',width:90,hidden:true,readonly:true,require:true,align:'left'}, |
|---|
| | | {field:'ProductName',title:'ååå称',type:'string',width:150,require:true,align:'left',sortable:true}, |
|---|
| | | {field:'MO',title:'æ¹æ¬¡',type:'string',width:100,require:true,align:'left'}, |
|---|
| | | {field:'Qty',title:'æ°é',type:'int',width:90,require:true,align:'left'}, |
|---|
| | | {field:'Weight',title:'éé',type:'decimal',width:90,align:'left'}, |
|---|
| | | {field:'Remark',title:'å¤æ³¨',type:'string',width:120,align:'left'}, |
|---|
| | | {field:'Creator',title:'å建人',type:'string',width:130,align:'left'}, |
|---|
| | | {field:'CreateDate',title:'å建æ¶é´',type:'datetime',width:90,align:'left'}, |
|---|
| | | {field:'Modifier',title:'ä¿®æ¹äºº',type:'string',width:100,align:'left'}, |
|---|
| | | {field:'ModifyDate',title:'ä¿®æ¹æ¶é´',type:'datetime',width:90,align:'left'}] |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | <style scoped> |
|---|
| | | h3{ |
|---|
| | | font-weight: 500; |
|---|
| | | padding-left: 10px; |
|---|
| | | background: white; |
|---|
| | | margin-top: 8px; |
|---|
| | | padding-bottom: 5px; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <VolBox v-model="model" title="éæ©æ°æ®" :lazy="true" :height="530" :width="1100" :padding="10"> |
|---|
| | | <!-- 设置æ¥è¯¢æ¡ä»¶ --> |
|---|
| | | <div style="padding-bottom: 10px"> |
|---|
| | | <span style="margin-right: 20px">请éæ©æ°æ®</span> |
|---|
| | | <el-input placeholder="ååå称" style="width: 200px" v-model="ProductName" /> |
|---|
| | | <el-button type="primary" plain style="margin-left: 10px" icon="Search" @click="search">æç´¢</el-button> |
|---|
| | | </div> |
|---|
| | | <!-- vol-tableé
ç½®çè¿äºå±æ§è§VolTableç»ä»¶apiæ件 --> |
|---|
| | | <vol-table ref="mytable" :loadKey="true" :columns="columns" :pagination="pagination" :pagination-hide="false" |
|---|
| | | :max-height="380" :url="url" :index="true" :single="false" :defaultLoadPage="false" |
|---|
| | | @loadBefore="loadTableBefore"></vol-table> |
|---|
| | | <template #footer> |
|---|
| | | <div> |
|---|
| | | <el-button plain type="primary" @click="addRow">éæ©æ°æ®</el-button> |
|---|
| | | <el-button @click="model = false">å
³é</el-button> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </VolBox> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import VolBox from "@/components/basic/VolBox.vue"; |
|---|
| | | import VolTable from "@/components/basic/VolTable.vue"; |
|---|
| | | export default { |
|---|
| | | components: { |
|---|
| | | VolBox: VolBox, |
|---|
| | | VolTable: VolTable, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | model: false, |
|---|
| | | ProductName: "", |
|---|
| | | //ä»åå°æ¥å£å è½½æ°æ®,è¿éçæ¥å£ç¨çæ¡æ¶èªå¸¦çæ¥è¯¢ï¼ä¹å¯ä»¥èªå®ä¹æ¥å£ï¼è§App_ExpertModelBody.vueä¸è°ç¨çåå°getSelectorDemoæ¹æ³ |
|---|
| | | url: "api/sellorderlist/getPageData", |
|---|
| | | columns: [ |
|---|
| | | { |
|---|
| | | field: "ProductName", |
|---|
| | | title: "ååå称", |
|---|
| | | type: "string", |
|---|
| | | bind: { key: "pn", data: [] }, |
|---|
| | | width: 150, |
|---|
| | | sort: true, |
|---|
| | | }, |
|---|
| | | { field: "MO", title: "æ¹æ¬¡", width: 100, sort: true }, |
|---|
| | | { field: "Qty", title: "æ°é", width: 90, sort: true }, |
|---|
| | | { field: "Weight", title: "éé", twidth: 90, sort: true }, |
|---|
| | | { field: "Remark", title: "å¤æ³¨", width: 120, sort: true }, |
|---|
| | | { field: "Creator", title: "å建人", width: 130, sort: true }, |
|---|
| | | { |
|---|
| | | field: "CreateDate", |
|---|
| | | title: "å建æ¶é´", |
|---|
| | | type: "datetime", |
|---|
| | | width: 145, |
|---|
| | | sort: true, |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | pagination: {}, |
|---|
| | | row: {}, //æç»è¡¨éæ©çè¡ |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | open(row) { |
|---|
| | | // this.row = row; |
|---|
| | | this.model = true; |
|---|
| | | //æå¼å¼¹åºæ¡æ¶ï¼å è½½tableæ°æ® |
|---|
| | | this.$nextTick(() => { |
|---|
| | | this.$refs.mytable.load(); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | search() { |
|---|
| | | this.$refs.mytable.load(); |
|---|
| | | }, |
|---|
| | | addRow() { |
|---|
| | | var rows = this.$refs.mytable.getSelected(); |
|---|
| | | if (!rows || rows.length == 0) { |
|---|
| | | return this.$Message.error("请éæ©è¡æ°æ®"); |
|---|
| | | } |
|---|
| | | |
|---|
| | | //ååæç»è¡¨è¡æ°æ®ï¼è§ææ¡£åç¶ç»ä»¶è°ç¨ä¸è·åæç»è¡¨è¡æ°æ®:http://v2.volcore.xyz/document/api |
|---|
| | | this.$emit('parentCall', $parent => { |
|---|
| | | |
|---|
| | | //è¿éå¯ä»¥å个å¤ææ¯å¦å·²ç»åå¨æç»è¡¨ï¼æ¾å°ä¸åå¨çæ°æ® |
|---|
| | | // rows = rows.filter(c => { |
|---|
| | | // return !$parent.$refs.detail.rowData.some(r => { return r.xx == c.xx }) |
|---|
| | | // }); |
|---|
| | | |
|---|
| | | //çææ°ç对象 |
|---|
| | | rows = rows.map(c => { |
|---|
| | | return { |
|---|
| | | ProductName: c.ProductName, |
|---|
| | | MO: c.MO, |
|---|
| | | Weight: c.Weight, |
|---|
| | | Remark: c.Remark |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | |
|---|
| | | //å¯ä»¥æ¸
空æç»è¡¨æ°æ® |
|---|
| | | //$parent.$refs.detail.rowData.splice(0); |
|---|
| | | //ååå°æç»è¡¨æ ¼ |
|---|
| | | $parent.$refs.detail.rowData.unshift(...rows); |
|---|
| | | }) |
|---|
| | | this.model = false; |
|---|
| | | }, |
|---|
| | | loadTableBefore(params) { |
|---|
| | | //æ¥è¯¢åï¼è®¾ç½®æ¥è¯¢æ¡ä»¶ |
|---|
| | | params.wheres = [ |
|---|
| | | { name: "ProductName", value: this.ProductName, displayType: "like" }, |
|---|
| | | ]; |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | |
|---|
| | | import SellOrder3GridFooter from "./SellOrder3/SellOrder3GridFooter.vue" |
|---|
| | | let extension = { |
|---|
| | | components: {//å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | gridHeader: '',//{ template: "<div>æ©å±ç»xx件</div>" }, |
|---|
| | | gridBody:'', |
|---|
| | | gridFooter: SellOrder3GridFooter, //() => import("./SellOrder3/SellOrder3GridFooter.vue"), |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: "", |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: "", //() => import("./SellOrderComponents/ModelFooter.vue"), |
|---|
| | | }, |
|---|
| | | text: "ç¨æ³ä¸ã主ä»ä¸å¯¹ä¸(2)ãä¸è´(è§SellOrder3.js)", |
|---|
| | | buttons: { //æ ¹æ®éè¦èªè¡å®ç°æ©å±æé® |
|---|
| | | },//æ©å±çæé® |
|---|
| | | methods: { |
|---|
| | | mounted() { |
|---|
| | | }, |
|---|
| | | //æ¹å¼1,éè¿selectéæ©è§¦åæ¾ç¤ºä¸éè |
|---|
| | | onInit() { |
|---|
| | | //设置为åéï¼ç¨äºæç»è¡¨å è½½æ°æ®æ¶è·å主表éè¡çid |
|---|
| | | this.single = true; |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | this.height = this.height - 350; |
|---|
| | | }, |
|---|
| | | |
|---|
| | | rowClick({ row, column, event }) { //æ¥è¯¢çé¢tableç¹å»è¡éä¸å½åè¡ |
|---|
| | | this.$refs.table.$refs.table.toggleRowSelection(row); |
|---|
| | | if (this.$refs.gridFooter && this.$refs.gridFooter.$refs.tableList) { |
|---|
| | | //æ·»å æç»è¡¨çæ°æ®(触åæç»è¡¨å è½½æ°æ®ï¼è§SellOrder3GridFooteræ¹æ³loadBefore) |
|---|
| | | //loadæ¹æ³å¯åç
§voltableç»ä»¶apiææ¡£ |
|---|
| | | this.$refs.gridFooter.$refs.tableList.load() |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | searchAfter(rows) { |
|---|
| | | //页é¢å è½½æè
å·æ°æ°æ®åç´æ¥æ¾ç¤ºç¬¬ä¸è¡çæç» |
|---|
| | | if (rows.length) { |
|---|
| | | // this.$nextTick(() => { |
|---|
| | | this.$refs.gridFooter.$refs.tableList.load({ value: rows[0].Order_Id, sort: "CreateDate" }) |
|---|
| | | // }) |
|---|
| | | } else { |
|---|
| | | //没ææ°æ®æ¶ï¼æ¸
空æç»æ°æ® |
|---|
| | | this.$refs.gridFooter.$refs.tableList.rowData.splice(0) |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | modelOpenAfter() { |
|---|
| | | //æ°å»ºå¼¹åºæ¡æ¶ï¼è®¾ç½®è®¾ç½®é»è®¤è®¢åç±»å |
|---|
| | | if (this.currentAction == "Add") { |
|---|
| | | this.editFormOptions.forEach(item => { |
|---|
| | | item.forEach(x => { |
|---|
| | | //å¦ææ¯ç¼è¾å¸å·è®¾ç½®ä¸ºåªè¯» |
|---|
| | | if (x.field == "OrderType") { |
|---|
| | | //æ°å»ºæ¶é»è®¤éæ©ä¸ç¬¬ä¸ä¸ªä¸ææ¡çå¼ï¼å¦æè¦éä¸å
¶ä»çå¼ï¼è¯·éåx.dataè·åkey |
|---|
| | | /*注æ:å¦æä¸ææ¡çæ°æ®æºæ¯èªå®ä¹sqlï¼å¹¶ä¸keyæ¯æ°åï¼è¯·å°ï¼x.data[0].key*1ï¼è½¬æ¢ææ°å*/ |
|---|
| | | this.editFormFields.OrderType = x.data[0].key; |
|---|
| | | //å¯ä»¥æå®å
¶ä»inputæ ç¾çé»è®¤å¼ |
|---|
| | | this.editFormFields.TranNo="8888" |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div style="margin-top: 15px; padding: 0 16px"> |
|---|
| | | <el-tabs type="border-card" style="min-height: 320px; box-shadow: none"> |
|---|
| | | <el-tab-pane> |
|---|
| | | <template #label> |
|---|
| | | <span><i class="el-icon-date"></i> 订åæç»</span> |
|---|
| | | </template> |
|---|
| | | <vol-table |
|---|
| | | ref="tableList" |
|---|
| | | :loadKey="true" |
|---|
| | | :columns="columns" |
|---|
| | | :pagination-hide="false" |
|---|
| | | :height="230" |
|---|
| | | :defaultLoadPage="false" |
|---|
| | | @loadBefore="loadBefore" |
|---|
| | | :endEditAfter="endEditAfter" |
|---|
| | | url="/api/SellOrder/getDetailPage" |
|---|
| | | :row-index="true" |
|---|
| | | :columnIndex="true" |
|---|
| | | :index="true" |
|---|
| | | :click-edit="true" |
|---|
| | | ></vol-table> |
|---|
| | | </el-tab-pane> |
|---|
| | | <el-tab-pane :lazy="true" label="æ¶æ¯ä¸å¿">æ¶æ¯ä¸å¿</el-tab-pane> |
|---|
| | | <el-tab-pane :lazy="true" label="è§è²ç®¡ç">è§è²ç®¡ç</el-tab-pane> |
|---|
| | | <el-tab-pane :lazy="true" label="å®æ¶ä»»å¡è¡¥å¿">å®æ¶ä»»å¡è¡¥å¿</el-tab-pane> |
|---|
| | | </el-tabs> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import VolTable from "@/components/basic/VolTable.vue"; |
|---|
| | | export default { |
|---|
| | | components: { |
|---|
| | | VolTable, |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | loadBefore(params, callback) { |
|---|
| | | //设置æ¥è¯¢ æ¡ä»¶ |
|---|
| | | |
|---|
| | | var _row; |
|---|
| | | //è·å主表éä¸çè¡ |
|---|
| | | this.$emit("parentCall", ($vue) => { |
|---|
| | | var rows = $vue.getSelectRows(); |
|---|
| | | if (rows.length) { |
|---|
| | | _row = rows[0]; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | if (!_row) { |
|---|
| | | //åæ¶éä¸ï¼æ¸
空æç» |
|---|
| | | return (this.$refs.tableList.rowData.length = 0); |
|---|
| | | // return this.$Message.error("请éä¸ä¸»è¡¨è¡æ°æ®"); |
|---|
| | | } |
|---|
| | | |
|---|
| | | //设置æ¥è¯¢æ¡ä»¶ï¼ç¨ä¸»è¡¨idå è½½æç»è¡¨æ°æ®(å¦ææ¯èªå·±å®ä¹çæ¥å£ï¼è¿éæ¡ä»¶èªå·±å¤ç) |
|---|
| | | params.value = _row.Order_Id; |
|---|
| | | //设置æåºå段(å¦ææ¯èªå·±å®ä¹çæ¥å£ï¼æåºå段ä¸ä¸å®å¡«å) |
|---|
| | | if (!params.sort) { |
|---|
| | | params.sort = "CreateDate"; |
|---|
| | | } |
|---|
| | | return callback(true); |
|---|
| | | }, |
|---|
| | | endEditAfter(row) { |
|---|
| | | //ç»æç¼è¾æ¶ï¼å¯ä»¥ç´æ¥è°ç¨åå°ç代ç è¿è¡ä¿å |
|---|
| | | console.log(row); |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | save(row) { |
|---|
| | | //ä¿å |
|---|
| | | this.$Message.info("ä¿å"); |
|---|
| | | }, |
|---|
| | | del(row) { |
|---|
| | | this.$confirm( |
|---|
| | | "确认è¦å é¤æ¤è¡æ°æ®ã" + row.ProductName + "ãï¼ï¼", |
|---|
| | | "确认信æ¯", |
|---|
| | | { |
|---|
| | | distinguishCancelAndClose: true, |
|---|
| | | confirmButtonText: "确认å é¤", |
|---|
| | | cancelButtonText: "åæ¶", |
|---|
| | | center: true |
|---|
| | | } |
|---|
| | | ) |
|---|
| | | .then(() => { |
|---|
| | | this.$message({ |
|---|
| | | type: "info", |
|---|
| | | message: "æ交å é¤è¯·æ±", |
|---|
| | | }); |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | getRender() { |
|---|
| | | //çæè¡¨æ ¼ç¼è¾é
ç½® |
|---|
| | | return (h, { row, column, index }) => { |
|---|
| | | return h( |
|---|
| | | "div", |
|---|
| | | { |
|---|
| | | style: { |
|---|
| | | cursor: "pointer", |
|---|
| | | color: " #409eff", |
|---|
| | | "font-size": "13px", |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | [ |
|---|
| | | h( |
|---|
| | | "a", |
|---|
| | | { |
|---|
| | | props: {}, |
|---|
| | | style: { "border-bottom": "1px solid" }, |
|---|
| | | onClick: (e) => { |
|---|
| | | e.stopPropagation(); |
|---|
| | | this.del(row); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | "å é¤" |
|---|
| | | ), |
|---|
| | | h( |
|---|
| | | "a", |
|---|
| | | { |
|---|
| | | props: {}, |
|---|
| | | style: { "margin-left": "9px", "border-bottom": "1px solid" }, |
|---|
| | | onClick: (e) => { |
|---|
| | | e.stopPropagation(); |
|---|
| | | this.$refs.tableList.edit.rowIndex = index; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | "ç¼è¾" |
|---|
| | | ), |
|---|
| | | h( |
|---|
| | | "a", |
|---|
| | | { |
|---|
| | | props: {}, |
|---|
| | | style: { "margin-left": "9px", "border-bottom": "1px solid" }, |
|---|
| | | onClick: (e) => { |
|---|
| | | e.stopPropagation(); |
|---|
| | | //强å¶ç»æç¼è¾ |
|---|
| | | this.$refs.tableList.edit.rowIndex = -1; |
|---|
| | | this.save(); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | "ä¿å" |
|---|
| | | ), |
|---|
| | | ] |
|---|
| | | ); |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | tableData: [], |
|---|
| | | //ä»çæç代ç sellorder2.vueéé¢ææç»é
ç½®å¤å¶è¿æ¥å°±è½ç¨ |
|---|
| | | columns: [ |
|---|
| | | { |
|---|
| | | field: "OrderList_Id", |
|---|
| | | title: "OrderList_Id", |
|---|
| | | type: "string", |
|---|
| | | width: 90, |
|---|
| | | hidden: true, |
|---|
| | | require: true, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: "Order_Id", |
|---|
| | | title: "订åId", |
|---|
| | | type: "string", |
|---|
| | | width: 90, |
|---|
| | | hidden: true, |
|---|
| | | readonly: true, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: "ProductName", |
|---|
| | | title: "ååå称", |
|---|
| | | type: "string", |
|---|
| | | bind: { key: "pn", data: [] }, |
|---|
| | | width: 150, |
|---|
| | | edit: { type: "select" }, |
|---|
| | | require: true, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: "MO", |
|---|
| | | title: "æ¹æ¬¡", |
|---|
| | | type: "string", |
|---|
| | | width: 100, |
|---|
| | | edit: { type: "" }, |
|---|
| | | require: true, |
|---|
| | | sort: true, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: "Qty", |
|---|
| | | title: "æ°é", |
|---|
| | | type: "int", |
|---|
| | | width: 90, |
|---|
| | | edit: { type: "drop" }, |
|---|
| | | summary: true, //设置æ±å |
|---|
| | | require: true, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: "Weight", |
|---|
| | | title: "éé", |
|---|
| | | type: "decimal", |
|---|
| | | summary: true, //设置æ±å |
|---|
| | | width: 90, |
|---|
| | | edit: { type: "" }, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: "Creator", |
|---|
| | | title: "å建人", |
|---|
| | | type: "string", |
|---|
| | | width: 100, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | field: "CreateDate", |
|---|
| | | title: "å建æ¶é´", |
|---|
| | | type: "datetime", |
|---|
| | | width: 140, |
|---|
| | | sort: true, |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | title: "æä½", |
|---|
| | | width: 110, |
|---|
| | | align: "center", |
|---|
| | | render: this.getRender(), |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | <style scoped> |
|---|
| | | h3 { |
|---|
| | | font-weight: 500; |
|---|
| | | padding-left: 10px; |
|---|
| | | background: white; |
|---|
| | | margin-top: 10px; |
|---|
| | | padding-top: 6px; |
|---|
| | | padding-bottom: 5px; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div> |
|---|
| | | <el-alert type="info"> |
|---|
| | | <h5>SellOrder.jsæ件ä¸çæ©å±SellOrder表æ¾ç¤ºbodyä¿¡æ¯,ä½ å¯ä»¥å¨æ¤å¤å®ä¹éè¦æ¾ç¤ºçä¿¡æ¯</h5> |
|---|
| | | </el-alert> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | export default { |
|---|
| | | components: { |
|---|
| | | VolBox: () => import("@/components/basic/VolBox.vue") |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | model: false |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | test() { |
|---|
| | | this.$emit("parentCall", $vue => { |
|---|
| | | let rows = $vue.$refs.table.rowData; |
|---|
| | | //æ¤äºæ¿å°ç$vueä½ å¯ä»¥æä½å
¶ä¸çä»»ä½å¯¹è±¡ï¼å¦: |
|---|
| | | //props.jsä¸çå±æ§ï¼this.columns/this.editFormFields |
|---|
| | | //æè
æä½å
¶ä»å¨ææ©å±çç»ä»¶å¦:$vue.$refs.gridBody/$vue.$refs.gridFooter |
|---|
| | | //$vue.$refs.tableè·åè¡¨æ ¼ä¿¡æ¯ |
|---|
| | | //$vue.refresh()å·æ°è¡¨æ ¼çæä½ |
|---|
| | | //è½æä½çææ对象å¯åç
§props.jsä¸ViewGird.uveçå±æ§ |
|---|
| | | //è½æä½çæ¹æ³methods.js/detailMethods.js |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div style="margin-top: 10px;"> |
|---|
| | | <el-alert type="info" title="gridFooteræ©å±ä½ç½®" show-icon> |
|---|
| | | <div> |
|---|
| | | æ¤ä»£ç ä½ç½®gridFooter.vueæ©å±ç»ä»¶è¢«SellOrder.jsçå±æ§gridFooterå¼ç¨,ä½ å¯ä»¥å¨æ¤å¼¹åºæ¡å®ä¹å
¶ä»ä¸å¡ã |
|---|
| | | <a style="color: #409eff; cursor: pointer" |
|---|
| | | >使ç¨æ¹å¼ä¸ä¸é¢gridHeaderä¸è´</a |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | </el-alert> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import { ref, defineComponent } from "vue"; |
|---|
| | | export default defineComponent({ |
|---|
| | | setup(props, context) { |
|---|
| | | return {} |
|---|
| | | }, |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div style="border-bottom: 10px solid rgb(228 228 228)"> |
|---|
| | | <el-alert type="success" title="gridHeaderæ©å±ä½ç½®" show-icon> |
|---|
| | | <div> |
|---|
| | | 1ãæ¤ä»£ç ä½ç½®GridHeaderExtend.vueæ©å±ç»ä»¶è¢«SellOrder.jsçå±æ§gridHeaderå¼ç¨,ä½ å¯ä»¥å¨æ¤å¼¹åºæ¡å®ä¹å
¶ä»ä¸å¡ã |
|---|
| | | <a style="color: #409eff; cursor: pointer" @click="search" |
|---|
| | | >ç¹å»è°ç¨ç¶ç»ä»¶æ¥è¯¢æ¹æ³</a |
|---|
| | | > |
|---|
| | | <a |
|---|
| | | style="color: #409eff; cursor: pointer; margin-left: 20px" |
|---|
| | | @click="add" |
|---|
| | | >ç¹å»è°ç¨ç¶ç»ä»¶æ°å»ºæ¹æ³</a |
|---|
| | | > |
|---|
| | | </div> |
|---|
| | | <div> |
|---|
| | | 2ãä½¿ç¨ this.$emit('parentCall', ($vue) => |
|---|
| | | {})å¯ä»¥è®¿é®æ´ä¸ªçé¢ä¸çææå±æ§(页é¢å
·ä½å¯¹è±¡ä¸å±æ§ï¼è§ |
|---|
| | | <a target="_blank" href="http://www.volcore.xyz/document/api" |
|---|
| | | >viewgridææ¡£</a |
|---|
| | | >) |
|---|
| | | </div> |
|---|
| | | </el-alert> |
|---|
| | | </div> |
|---|
| | | <vol-box |
|---|
| | | :lazy="true" |
|---|
| | | v-model="model1" |
|---|
| | | title="å¼¹åºæ¡2" |
|---|
| | | :width="500" |
|---|
| | | :padding="5" |
|---|
| | | :onModelClose="onModelClose" |
|---|
| | | > |
|---|
| | | <div style="height: 150px;">æé®ç¹å»çå¼¹åºæ¡</div> |
|---|
| | | </vol-box> |
|---|
| | | |
|---|
| | | |
|---|
| | | <vol-box |
|---|
| | | :lazy="true" |
|---|
| | | v-model="model2" |
|---|
| | | title="å¼¹åºæ¡2" |
|---|
| | | :width="700" |
|---|
| | | :padding="5" |
|---|
| | | :onModelClose="onModelClose" |
|---|
| | | > |
|---|
| | | <div style="height: 400px;">è¡¨æ ¼å½åè¡æ°æ®:{{ JSON.stringify(row2) }}</div> |
|---|
| | | <template #footer> |
|---|
| | | <el-button type="primary" size="small" @click="model2 = false" |
|---|
| | | >确认</el-button |
|---|
| | | > |
|---|
| | | <el-button type="default" size="small" @click="model2 = false" |
|---|
| | | >å
³éå¼¹</el-button |
|---|
| | | > |
|---|
| | | </template> |
|---|
| | | </vol-box> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import VolBox from '@/components/basic/VolBox.vue'; |
|---|
| | | |
|---|
| | | import { ref, defineComponent } from 'vue'; |
|---|
| | | export default defineComponent({ |
|---|
| | | components: { |
|---|
| | | VolBox |
|---|
| | | }, |
|---|
| | | setup(props, context) { |
|---|
| | | const search = () => { |
|---|
| | | context.emit('parentCall', ($parent) => { |
|---|
| | | $parent.search(); |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | const add = () => { |
|---|
| | | context.emit('parentCall', ($parent) => { |
|---|
| | | $parent.add(); |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | const model1 = ref(false); |
|---|
| | | const model2 = ref(false); |
|---|
| | | const open1 = () => { |
|---|
| | | model1.value = true; |
|---|
| | | }; |
|---|
| | | const row2 = ref(null); |
|---|
| | | const open2 = (row) => { |
|---|
| | | model2.value = true; |
|---|
| | | row2.value = row; |
|---|
| | | }; |
|---|
| | | return { search, add, open1, open2, model1, model2, row2 }; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div class="m-body"> |
|---|
| | | <a @click="close"> |
|---|
| | | è¿éæ¯èªå®ä¹æ©å±ç代ç ï¼å¯ä»¥è®¿é®æ´ä¸ªçé¢ä¸çææå±æ§ |
|---|
| | | this.$emit('parentCall', ($vue) => {});ç¹å»æµè¯å
³éå¼¹åºæ¡</a |
|---|
| | | > |
|---|
| | | <el-steps :active="1" simple> |
|---|
| | | <el-step title="æ¥éª¤ 1" icon="el-icon-edit"></el-step> |
|---|
| | | <el-step title="æ¥éª¤ 2" icon="el-icon-upload"></el-step> |
|---|
| | | <el-step title="æ¥éª¤ 3" icon="el-icon-picture"></el-step> |
|---|
| | | </el-steps> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import { ref, defineComponent } from "vue"; |
|---|
| | | export default defineComponent({ |
|---|
| | | setup(props, context) { |
|---|
| | | const close = () => { |
|---|
| | | context.emit("parentCall", ($parent) => { |
|---|
| | | $parent.boxModel = false; |
|---|
| | | }); |
|---|
| | | }; |
|---|
| | | return { close }; |
|---|
| | | }, |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| | | <style scoped> |
|---|
| | | .m-body { |
|---|
| | | border-top: 1px solid #eee; |
|---|
| | | margin-top: -14px; |
|---|
| | | text-align: center; |
|---|
| | | padding-top: 5px; |
|---|
| | | } |
|---|
| | | a { |
|---|
| | | color: #2d94ff; |
|---|
| | | cursor: pointer; |
|---|
| | | display: inline-block; |
|---|
| | | margin-bottom: 5px; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div style="padding:0 12px;"> |
|---|
| | | <el-alert type="success" title="èªå®ä¹ModelBodyä½ç½®ç代ç " show-icon> |
|---|
| | | å¦æéè¦è·æ´ä¸ªViewGridçVue对象,请å¨æ¹æ³ä¸ä½¿ç¨ this.$emit("parentCall", $vue |
|---|
| | | => {}) |
|---|
| | | </el-alert> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | export default { |
|---|
| | | |
|---|
| | | |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | <style scoped> |
|---|
| | | |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | |
|---|
| | | import { h, resolveComponent } from 'vue'; |
|---|
| | | import modelBody from "./vSellOrderImg/vSellOrderImgModelBody.vue" |
|---|
| | | let extension = { |
|---|
| | | components: {//å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | gridHeader: '', |
|---|
| | | gridBody: { |
|---|
| | | render() { |
|---|
| | | return h(resolveComponent('el-alert'), { |
|---|
| | | type: "success", |
|---|
| | | style: { 'margin-bottom': '12px' }, |
|---|
| | | 'show-icon': false, |
|---|
| | | closable: false, |
|---|
| | | }, 'ç¹å»æ°å»ºãç¼è¾å¼¹åºæ¡ï¼å¯ä»¥å¯¹æç»è¡¨è¿è¡ä¸ä¼ æ件æè
å¾çæä½ï¼è§vSellOrderImg.js') |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | gridFooter: '', |
|---|
| | | modelHeader: "", |
|---|
| | | //ç¹å»ä¸ä¼ å¾ççå¼¹åºæ¡ |
|---|
| | | modelBody: modelBody, |
|---|
| | | modelFooter: "", |
|---|
| | | }, |
|---|
| | | text: "ä¸å¯¹ä¸ä»è¡¨ç¼è¾ä¸ä¼ å¾ç", |
|---|
| | | methods: { |
|---|
| | | onInit() { |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | this.height = this.height - 56; |
|---|
| | | //è·åå¾çä½ç½®ï¼å¨å¾çåé¢å ä¸ä¸ªä¸ä¼ æé®,è¿éåªæ¯æ¼ç¤ºé便æ¾çä¸ä¸ªå段åå¾ç |
|---|
| | | let _index = this.detailOptions.columns.findIndex(x => { return x.field == 'Remark' }); |
|---|
| | | |
|---|
| | | //è¿éåªæ¯æ¼ç¤ºï¼å®é
æä½å¨ä»£ç çæå¨tableæ¾ç¤ºç±»å设置为å¾çåè¿éå°±ä¸ç¨æä½äº |
|---|
| | | //代ç çæå¨ä¸ç¼è¾è¡å·è®¾ç½®ä¸º0ï¼ä¸è¦è®¾ç½®ä¸ºå¤§äº0çæ°æ® |
|---|
| | | this.detailOptions.columns[_index].edit = null; |
|---|
| | | this.detailOptions.columns[_index].type = 'img'; |
|---|
| | | this.detailOptions.columns[_index].title = 'å¾ç'; |
|---|
| | | |
|---|
| | | //ä»è¡¨å¨ææ·»å ä¸å(ä¸ä¼ å¾çå),çæä¸ä¼ å¾çãä¸å é¤å¾çæä½ |
|---|
| | | this.detailOptions.columns.splice(_index, 0, { |
|---|
| | | field: "é便å", |
|---|
| | | title: "ä¸ä¼ å¾ç", |
|---|
| | | width: 150, |
|---|
| | | align: "center", |
|---|
| | | render: (h, { row, column, index }) => { |
|---|
| | | //ä¸é¢ææéè¦æ¾ç¤ºçä¿¡æ¯é½ä»rowéé¢ååºæ¥ |
|---|
| | | return h( |
|---|
| | | "div", { style: { color: '#0c83ff', 'font-size': '13px', cursor: 'pointer' } }, |
|---|
| | | [ |
|---|
| | | h( |
|---|
| | | "i", { |
|---|
| | | style: { 'margin-right': '10px' }, |
|---|
| | | class:['el-icon-upload'], |
|---|
| | | onClick: (e) => { |
|---|
| | | e.stopPropagation(); |
|---|
| | | //è®°ä½å½åæä½çæç»è¡¨è¡æ°æ® |
|---|
| | | //å¦æåæ¥æå¾ç,ä¸ä¼ å¾ççé¢æåæ¥çå¾çä¹æ¾ç¤ºåºæ¥ |
|---|
| | | let fileInfo = (row.Remark || '').split(",").filter(x => { return x }).map(img => { |
|---|
| | | //(çææä»¶æ ¼å¼) fileInfoæ ¼å¼åæ°ï¼è§voluploadç»ä»¶ |
|---|
| | | return { path: img, name: "" }; |
|---|
| | | }) |
|---|
| | | this.$refs.modelBody.open(fileInfo, row) |
|---|
| | | } |
|---|
| | | }, [], 'ä¸ä¼ å¾ç' |
|---|
| | | ), |
|---|
| | | h('i', { |
|---|
| | | class: ['el-icon-delete'], onClick: (e) => { |
|---|
| | | e.stopPropagation(); row.Remark = '' |
|---|
| | | } |
|---|
| | | }, 'å é¤å¾ç') |
|---|
| | | ]) |
|---|
| | | }, |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <VolBox |
|---|
| | | v-model="model" |
|---|
| | | title="éæ©å¾ç" |
|---|
| | | :height="228" |
|---|
| | | :width="500" |
|---|
| | | :padding="15" |
|---|
| | | > |
|---|
| | | <!-- ä¸ä¼ å¾çãexcelæå
¶ä»æ件ãæ件æ°éã大å°éå¶é½å¯ä»¥ï¼åç
§voluploadç»ä»¶api --> |
|---|
| | | <div style="height: 150px;"> |
|---|
| | | <VolUpload |
|---|
| | | style="text-align: center; border: 1px dotted #ff9800; padding: 20px" |
|---|
| | | :autoUpload="false" |
|---|
| | | :multiple="true" |
|---|
| | | :url="url" |
|---|
| | | :max-file="2" |
|---|
| | | :img="true" |
|---|
| | | :fileInfo="fileInfo" |
|---|
| | | :upload-after="uploadAfter" |
|---|
| | | > |
|---|
| | | <div>éæ©å¾ç,åªè½ä¸ä¼ 3M以å
çç
§ç</div> |
|---|
| | | </VolUpload> |
|---|
| | | </div> |
|---|
| | | </VolBox> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import { h, resolveComponent, defineAsyncComponent } from "vue"; |
|---|
| | | export default { |
|---|
| | | components: { |
|---|
| | | VolUpload: defineAsyncComponent(() => |
|---|
| | | import("@/components/basic/VolUpload.vue") |
|---|
| | | ), |
|---|
| | | VolBox: defineAsyncComponent(() => import("@/components/basic/VolBox.vue")), |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | //设置ä¿åå¾ççè·¯å¾,æ¤å¤éæ©çæ¯æ¡æ¶èªå¸¦æ¯ä¸ªè¡¨çä¸ä¼ çè·¯å¾ |
|---|
| | | //ä¹å¯ä»¥èªå®ä¹è®¾ç½®ä¸ä¼ æ件çæ¥å£ï¼å¦æéè¦ä¸ä¼ å°ç¬¬ä¸æ¹è¯·å®ç°uploadBeforeæ¹æ³ |
|---|
| | | url: "api/Sys_Dictionary/upload", |
|---|
| | | fileInfo: [], //åå§åä¸ä¸ªç©ºå¯¹è±¡ï¼ç¨æ¥åå¨ç¼è¾ä¸ä¼ å¾çæ¶çåå§å¾ç |
|---|
| | | model: false, |
|---|
| | | row: {}, //å½åæä½çæç»è¡¨è¡ |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | open(fileInfo, row) { |
|---|
| | | this.row=row; |
|---|
| | | this.fileInfo = fileInfo; |
|---|
| | | this.model = true; |
|---|
| | | }, |
|---|
| | | //ä¸ä¼ å®æï¼å°å¾çåå
¥æç»è¡¨æ°æ® |
|---|
| | | uploadAfter(result, files) { |
|---|
| | | if (!result.status) return true; |
|---|
| | | //çæå¾çä¿ååè¿åçè·¯å¾ |
|---|
| | | let imgs = files.map((x) => { |
|---|
| | | //2021.09.25ä¿®å¤ç¤ºä¾ä¸ä¼ è·¯å¾é»è¾é误çé®é¢ |
|---|
| | | if (x.path) { |
|---|
| | | return x.path; |
|---|
| | | } |
|---|
| | | return result.data + x.name; |
|---|
| | | }); |
|---|
| | | // //è·åvueç¶ç»ä»¶(æ¥è¯¢çé¢) |
|---|
| | | // this.$emit('parentCall',($parent)=>{ |
|---|
| | | // }) |
|---|
| | | //å°å¾çéè¿éå·éå¼ï¼éæ°åå
¥æç»è¡¨çè¡æ°æ®ä¸ |
|---|
| | | this.row.Remark = imgs.join(","); |
|---|
| | | this.model = false; |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | import { h, resolveComponent } from 'vue'; |
|---|
| | | let extension = { |
|---|
| | | components: { //å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | //æ©å±ç»ä»¶å¼å
¥æ¹å¼ |
|---|
| | | gridHeader: '', |
|---|
| | | gridBody: '', |
|---|
| | | gridFooter: '', |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | buttons: [], //æ©å±çæé® |
|---|
| | | methods: { //äºä»¶æ©å± |
|---|
| | | onInit() { |
|---|
| | | //ç¹å»åå
æ ¼ç¼è¾ä¸ç»æç¼è¾(é»è®¤æ¯ç¹å»åå
æ ¼ç¼è¾ï¼é¼ æ 离å¼ç»æç¼è¾) |
|---|
| | | this.detailOptions.clickEdit = true; |
|---|
| | | this.editFormOptions.forEach(x => { |
|---|
| | | x.forEach(item => { |
|---|
| | | if (item.field == 'ParentId') { |
|---|
| | | item.min = 0; |
|---|
| | | } |
|---|
| | | if (item.field == "DbSql") { |
|---|
| | | item.placeholder = "å¦æä»æ°æ®åºå è½½æ°æ®æºï¼è¯·ææ¤æ ¼å¼é
ç½®sqlè¯å¥ï¼select orderType as key,orderName as value from order å¦æéè¦æ ¹æ®ç¨æ·ä¿¡æ¯å è½½æ°æ®æºï¼è¯·é
置好æ¤sql,åä¿®æ¹åå°DictionaryHandler.GetCustomDBSqlæ¹æ³"; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | this.detailOptions.columns.forEach(x => { |
|---|
| | | if (x.field == 'OrderNo') { |
|---|
| | | x.summary = true; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | //ä¿ååä¸å
³éç¼è¾æ¡ |
|---|
| | | this.boxOptions.saveClose = false; |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | this.boxOptions.height = document.body.clientHeight * 0.87 |
|---|
| | | this.height = this.height - 45; |
|---|
| | | }, |
|---|
| | | addBefore(formData) { |
|---|
| | | return this.saveBefore(formData); |
|---|
| | | }, |
|---|
| | | updateBefore(formData) { |
|---|
| | | return this.saveBefore(formData); |
|---|
| | | }, |
|---|
| | | saveBefore(formData) { |
|---|
| | | if (this.editFormFields.DbSql && |
|---|
| | | (this.editFormFields.DbSql.indexOf('value') == -1 || |
|---|
| | | this.editFormFields.DbSql.indexOf('key') == -1) |
|---|
| | | ) { |
|---|
| | | this.$message.error("sqlè¯å¥å¿
é¡»å
æ¬key/valueå段,å¦:select orderType as key,orderName as value from order"); |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | searchBefore(param) { |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | searchAfter(result) { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | |
|---|
| | | |
|---|
| | | let extension = { |
|---|
| | | components: {//å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | gridHeader:'', |
|---|
| | | gridbody:'', |
|---|
| | | gridFooter: '', |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | buttons: [],//æ©å±çæé® |
|---|
| | | methods: {//äºä»¶æ©å± |
|---|
| | | onInit() { |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | import { h, resolveComponent } from 'vue'; |
|---|
| | | let extension = { |
|---|
| | | components: { |
|---|
| | | //å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | gridHeader: "", //{ template: "<div>æ©å±ç»xx件</div>" }, |
|---|
| | | gridBody: '', |
|---|
| | | gridFooter: "", |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: "", |
|---|
| | | modelBody: "", |
|---|
| | | modelFooter: "" |
|---|
| | | }, |
|---|
| | | buttons: [], //æ©å±çæé® |
|---|
| | | methods: { |
|---|
| | | //äºä»¶æ©å± |
|---|
| | | onInit() { |
|---|
| | | console.log("sys_log") |
|---|
| | | this.setFiexdSearchForm(true); |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | this.height = this.height - 170; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | |
|---|
| | | let extension = { |
|---|
| | | components: {//å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | gridHeader: '', |
|---|
| | | gridBody: '', |
|---|
| | | gridFooter: '', |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | buttons: [],//æ©å±çæé® |
|---|
| | | tableAction:"Sys_Role", |
|---|
| | | methods: {//äºä»¶æ©å± |
|---|
| | | onInited () { |
|---|
| | | this.height = this.height - 80; |
|---|
| | | this.editFormOptions.forEach(x => { |
|---|
| | | x.forEach(item => { |
|---|
| | | if (item.field == 'ParentId') { |
|---|
| | | item.title = "ä¸çº§è§è²"; |
|---|
| | | //设置任æèç¹é½è½éä¸(é»è®¤åªè½éä¸æåä¸ä¸ªèç¹) |
|---|
| | | item.changeOnSelect = true; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | onInit() { |
|---|
| | | //设置treetableçå¯ä¸å¼å段(è¿ä¸ªå段çå¼å¨è¡¨éé¢å¿
é¡»æ¯å¯ä¸ç) |
|---|
| | | this.rowKey="Role_Id"; |
|---|
| | | }, |
|---|
| | | /***å è½½åå°æ°æ®è§Sys_RoleController.csæ件***/ |
|---|
| | | loadTreeChildren(tree, treeNode, resolve) { //å è½½åèç¹ |
|---|
| | | let url=`api/role/getTreeTableChildrenData?roleId=${tree.Role_Id}`; |
|---|
| | | this.http.post(url,{}).then(result=>{ |
|---|
| | | resolve(result.rows) |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | /***å è½½åå°æ°æ®è§Sys_RoleController.csæ件***/ |
|---|
| | | searchBefore(params){//å¤æå è½½æ ¹èç¹æåèç¹ |
|---|
| | | //没ææ¥è¯¢æ¡ä»¶ï¼é»è®¤æ¥è¯¢è¿åæææ ¹èç¹æ°æ® |
|---|
| | | if (!params.wheres.length) { |
|---|
| | | params.value=1; |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | |
|---|
| | | import { h, resolveComponent } from 'vue'; |
|---|
| | | let extension = { |
|---|
| | | components: {//å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | gridHeader: '', |
|---|
| | | gridBody: { |
|---|
| | | render () { |
|---|
| | | return [ |
|---|
| | | h(resolveComponent('el-alert'), { |
|---|
| | | style: { 'margin-bottom': '12px' }, |
|---|
| | | 'show-icon': true, type: 'error', |
|---|
| | | closable: false, title: 'å
³äºTreeTable使ç¨' |
|---|
| | | }, ' treetableåæ ·å
¨é¨ä»£ç èªå¨çæï¼é¡µé¢çæå设置this.rowKe="xxx" tree主é®å段,å³å¯å®ææ å½¢tableé
ç½®,å
·ä½è¯´æè§Sys_Role1.js'), |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | gridFooter: '', |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | buttons: [],//æ©å±çæé® |
|---|
| | | tableAction:"Sys_Role", |
|---|
| | | methods: {//äºä»¶æ©å± |
|---|
| | | onInited () { |
|---|
| | | this.height = this.height - 80; |
|---|
| | | this.editFormOptions.forEach(x => { |
|---|
| | | x.forEach(item => { |
|---|
| | | if (item.field == 'ParentId') { |
|---|
| | | item.title = "ä¸çº§è§è²"; |
|---|
| | | //设置任æèç¹é½è½éä¸(é»è®¤åªè½éä¸æåä¸ä¸ªèç¹) |
|---|
| | | item.changeOnSelect = true; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | onInit() { |
|---|
| | | //设置treetableçå¯ä¸å¼å段(è¿ä¸ªå段çå¼å¨è¡¨éé¢å¿
é¡»æ¯å¯ä¸ç) |
|---|
| | | this.rowKey="Role_Id"; |
|---|
| | | }, |
|---|
| | | /***å è½½åå°æ°æ®è§Sys_RoleController.csæ件***/ |
|---|
| | | loadTreeChildren(tree, treeNode, resolve) { //å è½½åèç¹ |
|---|
| | | let url=`api/role/getTreeTableChildrenData?roleId=${tree.Role_Id}`; |
|---|
| | | this.http.post(url,{}).then(result=>{ |
|---|
| | | resolve(result.rows) |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | /***å è½½åå°æ°æ®è§Sys_RoleController.csæ件***/ |
|---|
| | | searchBefore(params){//å¤æå è½½æ ¹èç¹æåèç¹ |
|---|
| | | //没ææ¥è¯¢æ¡ä»¶ï¼é»è®¤æ¥è¯¢è¿åæææ ¹èç¹æ°æ® |
|---|
| | | if (!params.wheres.length) { |
|---|
| | | params.value=1; |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | import { defineAsyncComponent } from "vue"; |
|---|
| | | let extension = { |
|---|
| | | components: { //å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | gridHeader: defineAsyncComponent(() => |
|---|
| | | import("./Sys_User/Sys_UserGridHeader.vue")), |
|---|
| | | gridBody: '', |
|---|
| | | gridFooter: '', |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | text: "åªè½çå°å½åè§è²ä¸çææå¸å·", |
|---|
| | | buttons: [], //æ©å±çæé® |
|---|
| | | methods: { //äºä»¶æ©å± |
|---|
| | | onInit() { |
|---|
| | | this.boxOptions.height = 530; |
|---|
| | | this.columns.push({ |
|---|
| | | title: 'æä½', |
|---|
| | | hidden: false, |
|---|
| | | align: "center", |
|---|
| | | fixed: 'right', |
|---|
| | | width: 120, |
|---|
| | | render: (h, { row, column, index }) => { |
|---|
| | | return h( |
|---|
| | | "div", { style: { 'font-size': '13px', 'cursor': 'pointer', 'color': '#409eff' } }, [ |
|---|
| | | h( |
|---|
| | | "a", { |
|---|
| | | style: { 'margin-right': '15px' }, |
|---|
| | | onClick: (e) => { |
|---|
| | | e.stopPropagation() |
|---|
| | | this.$refs.gridHeader.open(row); |
|---|
| | | } |
|---|
| | | }, "ä¿®æ¹å¯ç " |
|---|
| | | ), |
|---|
| | | h( |
|---|
| | | "a", { |
|---|
| | | style: {}, |
|---|
| | | onClick: (e) => { |
|---|
| | | e.stopPropagation() |
|---|
| | | this.edit(row); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | "ç¼è¾" |
|---|
| | | ), |
|---|
| | | ]) |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | onInited() { }, |
|---|
| | | addAfter(result) { //ç¨æ·æ°å»ºåï¼æ¾ç¤ºéæºçæçå¯ç |
|---|
| | | if (!result.status) { |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | //æ¾ç¤ºæ°å»ºç¨æ·çå¯ç |
|---|
| | | //2020.08.28ä¼åæ°å»ºæåæ示æ¹å¼ |
|---|
| | | this.$confirm(result.message, 'æ°å»ºç¨æ·æå', { |
|---|
| | | confirmButtonText: 'ç¡®å®', |
|---|
| | | type: 'success', |
|---|
| | | center: true |
|---|
| | | }).then(() => { }) |
|---|
| | | |
|---|
| | | this.boxModel = false; |
|---|
| | | this.refresh(); |
|---|
| | | return false; |
|---|
| | | }, |
|---|
| | | modelOpenAfter() { |
|---|
| | | //ç¹å»å¼¹åºæ¡åï¼å¦ææ¯ç¼è¾ç¶æï¼ç¦æ¢ç¼è¾ç¨æ·åï¼å¦ææ°å»ºç¶æï¼å°ç¨æ·åå段设置为å¯ç¼è¾ |
|---|
| | | let isEDIT = this.currentAction == this.const.EDIT; |
|---|
| | | this.editFormOptions.forEach(item => { |
|---|
| | | item.forEach(x => { |
|---|
| | | if (x.field == "UserName") { |
|---|
| | | x.disabled=isEDIT; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | //ä¸æ¯æ°å»ºï¼æ§å«é»è®¤å¼è®¾ç½®ä¸ºç· |
|---|
| | | if (!isEDIT) { |
|---|
| | | this.editFormFields.Gender = "0"; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div> |
|---|
| | | <vol-box |
|---|
| | | v-model="model" |
|---|
| | | :padding="30" |
|---|
| | | title="ä¿®æ¹å¯ç " |
|---|
| | | :width="500" |
|---|
| | | :height="250" |
|---|
| | | > |
|---|
| | | <el-alert type="success"> |
|---|
| | | <h3> |
|---|
| | | <span>å¸å·ï¼{{ row.UserName }}</span> |
|---|
| | | <span>ç¨æ·ï¼{{ row.UserTrueName }}</span> |
|---|
| | | </h3> |
|---|
| | | </el-alert> |
|---|
| | | <div> |
|---|
| | | <el-input |
|---|
| | | placeholder="请è¾å
¥å¯ç " |
|---|
| | | v-model="password" |
|---|
| | | size="large" |
|---|
| | | style="width: 100%; margin-top: 15px" |
|---|
| | | /> |
|---|
| | | </div> |
|---|
| | | <template #footer> |
|---|
| | | <el-button |
|---|
| | | type="primary" |
|---|
| | | @click="savePwd()" |
|---|
| | | >ä¿®æ¹å¯ç </el-button |
|---|
| | | > |
|---|
| | | <el-button |
|---|
| | | @click="model = false" |
|---|
| | | >å
³é</el-button |
|---|
| | | > |
|---|
| | | </template> |
|---|
| | | </vol-box> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import { defineComponent, defineAsyncComponent } from "vue"; |
|---|
| | | export default defineComponent({ |
|---|
| | | components: { |
|---|
| | | VolBox: defineAsyncComponent(() => import("@/components/basic/VolBox.vue")) |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | row: {}, |
|---|
| | | password: "", |
|---|
| | | model: false, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | open(row) { |
|---|
| | | this.password = ""; |
|---|
| | | this.row = row; |
|---|
| | | this.model = true; |
|---|
| | | }, |
|---|
| | | savePwd() { |
|---|
| | | if (!this.password) return this.$Message.error("请è¾å¯ç "); |
|---|
| | | if (this.password.length < 6) |
|---|
| | | return this.$Message.error("å¯ç é¿åº¦è³å°6ä½"); |
|---|
| | | let url = |
|---|
| | | "/api/user/modifyUserPwd?password=" + |
|---|
| | | this.password + |
|---|
| | | "&userName=" + |
|---|
| | | this.row.UserName; |
|---|
| | | this.http.post(url, {}, true).then((x) => { |
|---|
| | | if (!x.status) { |
|---|
| | | return this.$message.error(x.message); |
|---|
| | | } |
|---|
| | | this.model = false; |
|---|
| | | this.$Message.success(x.message); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | created() {}, |
|---|
| | | }) |
|---|
| | | </script> |
|---|
| | | <style lang="less" scoped> |
|---|
| | | h3 { |
|---|
| | | font-weight: 500; |
|---|
| | | > span:last-child { |
|---|
| | | margin-left: 30px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </style> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | /***************************************************************************************** |
|---|
| | | ** Author:jxx 2022 |
|---|
| | | ** QQ:283591387 |
|---|
| | | **å®æ´ææ¡£è§ï¼http://v2.volcore.xyz/document/api ã代ç çæ页é¢ViewGridã |
|---|
| | | **常ç¨ç¤ºä¾è§ï¼http://v2.volcore.xyz/document/vueDev |
|---|
| | | **åå°æä½è§ï¼http://v2.volcore.xyz/document/netCoreDev |
|---|
| | | *****************************************************************************************/ |
|---|
| | | //æ¤jsæ件æ¯ç¨æ¥èªå®ä¹æ©å±ä¸å¡ä»£ç ï¼å¯ä»¥æ©å±ä¸äºèªå®ä¹é¡µé¢æè
éæ°é
ç½®çæç代ç |
|---|
| | | import gridHader from './Sys_WorkFlow/WorkFlowGridHeader.vue'; |
|---|
| | | import { h, resolveComponent } from 'vue'; |
|---|
| | | let extension = { |
|---|
| | | components: { |
|---|
| | | //æ¥è¯¢çé¢æ©å±ç»ä»¶ |
|---|
| | | gridHeader: gridHader, |
|---|
| | | gridBody: { |
|---|
| | | render() { |
|---|
| | | return [ |
|---|
| | | h( |
|---|
| | | resolveComponent('el-alert'), |
|---|
| | | { |
|---|
| | | style: { 'margin-bottom': '12px' }, |
|---|
| | | 'show-icon': true, |
|---|
| | | type: 'success', |
|---|
| | | closable: false, |
|---|
| | | title: 'æµç¨è®¾è®¡å¨æ ¹æ®easy-flowä¿®æ¹,表å¿
é¡»å
æ¬å®¡æ¹å段AuditStatus,å
·ä½è§ç¤ºä¾è¡¨SellOrder;åå°startupéè¦æ³¨å
¥å®¡æ¹æµç¨' |
|---|
| | | }, |
|---|
| | | '' |
|---|
| | | ) |
|---|
| | | ]; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | gridFooter: '', |
|---|
| | | //æ°å»ºãç¼è¾å¼¹åºæ¡æ©å±ç»ä»¶ |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | tableAction: '', //æå®æå¼ è¡¨çæé(è¿éå¡«å表å,é»è®¤ä¸ç¨å¡«å) |
|---|
| | | buttons: { view: [], box: [], detail: [] }, //æ©å±çæé® |
|---|
| | | methods: { |
|---|
| | | //ä¸é¢è¿äºæ¹æ³å¯ä»¥ä¿çä¹å¯ä»¥å é¤ |
|---|
| | | onInit() { |
|---|
| | | //æ¡æ¶åå§åé
ç½®åï¼ |
|---|
| | | //示ä¾ï¼å¨æé®çæåé¢æ·»å ä¸ä¸ªæé® |
|---|
| | | // this.buttons.unshift({ //ä¹å¯ä»¥ç¨pushæè
spliceæ¹æ³æ¥ä¿®æ¹buttonsæ°ç» |
|---|
| | | // name: 'æé®', //æé®å称 |
|---|
| | | // icon: 'el-icon-document', //æé®å¾æ vue2çæ¬è§iviewææ¡£iconï¼vue3çæ¬è§element uiææ¡£icon(注æä¸æ¯element pulsææ¡£) |
|---|
| | | // type: 'primary', //æé®æ ·å¼vue2çæ¬è§iviewææ¡£buttonï¼vue3çæ¬è§element uiææ¡£button |
|---|
| | | // onClick: function () { |
|---|
| | | // this.$Message.success('ç¹å»äºæé®'); |
|---|
| | | // } |
|---|
| | | // }); |
|---|
| | | //示ä¾ï¼è®¾ç½®ä¿®æ¹æ°å»ºãç¼è¾å¼¹åºæ¡å段æ ç¾çé¿åº¦ |
|---|
| | | // this.boxOptions.labelWidth = 150; |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | this.height = this.height - 50; |
|---|
| | | //æ¡æ¶åå§åé
ç½®å |
|---|
| | | //å¦æè¦é
ç½®æç»è¡¨,å¨æ¤æ¹æ³æä½ |
|---|
| | | //this.detailOptions.columns.forEach(column=>{ }); |
|---|
| | | }, |
|---|
| | | searchBefore(param) { |
|---|
| | | //çé¢æ¥è¯¢å,å¯ä»¥ç»param.wheresæ·»å æ¥è¯¢åæ° |
|---|
| | | //è¿åfalseï¼åä¸ä¼æ§è¡æ¥è¯¢ |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | searchAfter(result) { |
|---|
| | | //æ¥è¯¢åï¼resultè¿åçæ¥è¯¢æ°æ®,å¯ä»¥å¨æ¾ç¤ºå°è¡¨æ ¼åå¤çè¡¨æ ¼çå¼ |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | addBefore(formData) { |
|---|
| | | //æ°å»ºä¿ååformData为对象ï¼å
æ¬æç»è¡¨ï¼å¯ä»¥ç»ç»è¡¨å设置å¼ï¼èªå·±è¾åºçformDataçå¼ |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | updateBefore(formData) { |
|---|
| | | //ç¼è¾ä¿ååformData为对象ï¼å
æ¬æç»è¡¨ãå é¤è¡çId |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | rowClick({ row, column, event }) { |
|---|
| | | //æ¥è¯¢çé¢ç¹å»è¡äºä»¶ |
|---|
| | | // this.$refs.table.$refs.table.toggleRowSelection(row); //åå»è¡æ¶éä¸å½åè¡; |
|---|
| | | }, |
|---|
| | | async modelOpenBeforeAsync(row) { |
|---|
| | | //ç¹å»ç¼è¾/æ°å»ºæé®å¼¹åºæ¡åï¼å¯ä»¥å¨æ¤å¤åé»è¾ï¼å¦ï¼ä»åå°è·åæ°æ® |
|---|
| | | this.$refs.gridHeader.open(row); |
|---|
| | | return false; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <vol-box :lazy="false" v-model="model" :title="isAdd ? 'æ°å»ºæµç¨' : 'ç¼è¾æµç¨'" :width="width" :padding="0"> |
|---|
| | | <div :style="{ height: height + 'px' }"> |
|---|
| | | <flow-panel ref="flow"></flow-panel> |
|---|
| | | </div> |
|---|
| | | <template #footer> |
|---|
| | | <div style="text-align: center;"> |
|---|
| | | <el-button type="default" size="mini" @click="model = false">åæ¶</el-button> |
|---|
| | | <el-button type="primary" size="mini" @click="save">ä¿å</el-button> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | </vol-box> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import FlowPanel from '@/components/workflow/panel' |
|---|
| | | import VolBox from '@/components/basic/VolBox.vue'; |
|---|
| | | export default { |
|---|
| | | name: 'App', |
|---|
| | | components: { |
|---|
| | | FlowPanel, |
|---|
| | | VolBox |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | nodeList: [], |
|---|
| | | lineList: [], |
|---|
| | | model: false, |
|---|
| | | height: 500, |
|---|
| | | width: 1200, |
|---|
| | | row: null, |
|---|
| | | isAdd: false |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | created() { |
|---|
| | | this.height = document.body.clientHeight - 140; |
|---|
| | | let width = document.body.clientWidth * 0.9; |
|---|
| | | this.width = width > 1800 ? 1800 : width; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | open(row) { |
|---|
| | | this.row = row; |
|---|
| | | this.model = true; |
|---|
| | | this.isAdd = Object.keys(this.row).length == 0; |
|---|
| | | |
|---|
| | | if (row.NodeConfig) { |
|---|
| | | this.nodeList = JSON.parse(row.NodeConfig); |
|---|
| | | } else { |
|---|
| | | this.nodeList = [ |
|---|
| | | // { |
|---|
| | | // id: '1659276275052', |
|---|
| | | // name: 'æµç¨C-èç¹A', |
|---|
| | | // type: 'task', |
|---|
| | | // left: '230px', |
|---|
| | | // top: '15px', |
|---|
| | | // ico: 'el-icon-user-solid' |
|---|
| | | // }, |
|---|
| | | // { |
|---|
| | | // id: '1659276282115', |
|---|
| | | // name: 'æµç¨C-èç¹B', |
|---|
| | | // type: 'task', |
|---|
| | | // left: '225px', |
|---|
| | | // top: '165px', |
|---|
| | | // ico: 'el-icon-goods' |
|---|
| | | // } |
|---|
| | | ]; |
|---|
| | | } |
|---|
| | | if (row.LineConfig) { |
|---|
| | | this.lineList = JSON.parse(row.LineConfig); |
|---|
| | | } else { |
|---|
| | | this.lineList = [ |
|---|
| | | // { |
|---|
| | | // from: '1659276275052', |
|---|
| | | // to: '1659276282115' |
|---|
| | | // } |
|---|
| | | ]; |
|---|
| | | } |
|---|
| | | |
|---|
| | | this.$nextTick(() => { |
|---|
| | | this.$refs.flow.dataReload({ |
|---|
| | | lineList: this.lineList, |
|---|
| | | nodeList: this.nodeList |
|---|
| | | }, this.isAdd); |
|---|
| | | Object.assign(this.$refs.flow.formFields, row); |
|---|
| | | if (this.isAdd) { |
|---|
| | | this.$refs.flow.formFields.WorkName=""; |
|---|
| | | this.$refs.flow.formFields.WorkTable=""; |
|---|
| | | this.$refs.flow.formFields.WorkTableName=""; |
|---|
| | | this.$refs.flow.formFields.Remark=""; |
|---|
| | | this.$refs.flow.formFields.Weight=1; |
|---|
| | | } |
|---|
| | | if (this.$refs.flow) { |
|---|
| | | this.$refs.flow.$refs.nodeForm.$refs.filter.getOptions(row.WorkTable); |
|---|
| | | } else { |
|---|
| | | this.$refs.flow.$refs.form.reset( |
|---|
| | | Object.keys(row).length |
|---|
| | | ? row |
|---|
| | | : { WorkName: '', WorkTable: '', WorkTableName: '', Remark: '',Weight:1 } |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | save() { |
|---|
| | | let mainData = JSON.parse(JSON.stringify(this.$refs.flow.formFields)); |
|---|
| | | |
|---|
| | | if (!mainData.WorkName) { |
|---|
| | | this.$message.error('请填å左侧表åãæµç¨å称ã') |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (!mainData.WorkTable) { |
|---|
| | | this.$message.error('请éæ©å·¦ä¾§è¡¨åãæµç¨å®ä¾ã') |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | |
|---|
| | | let nodeList = this.$refs.flow.data.nodeList; |
|---|
| | | |
|---|
| | | let nodeListOptions = JSON.parse(JSON.stringify(nodeList)); |
|---|
| | | |
|---|
| | | nodeListOptions.forEach(item => { |
|---|
| | | if (item.filters && item.filters.data) { |
|---|
| | | item.filters.data = undefined; |
|---|
| | | } |
|---|
| | | if (item.userId && item.userId.length) { |
|---|
| | | item.userId = item.userId.join(','); |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | mainData.NodeConfig = JSON.stringify(nodeListOptions) |
|---|
| | | let lineList = this.$refs.flow.data.lineList; |
|---|
| | | lineList = JSON.parse(JSON.stringify(lineList)); |
|---|
| | | lineList.forEach(item => { |
|---|
| | | if (item.filters) { |
|---|
| | | item.filters.forEach(x => { |
|---|
| | | if (x.data) { |
|---|
| | | x.data = []; |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | mainData.LineConfig = JSON.stringify(lineList); |
|---|
| | | |
|---|
| | | |
|---|
| | | let rootNode = nodeList.filter(c => { return c.type == 'start' }). |
|---|
| | | map(c => { |
|---|
| | | return { |
|---|
| | | StepId: c.id, |
|---|
| | | StepName: c.name, |
|---|
| | | StepAttrType: c.type, |
|---|
| | | StepAuditType: null, |
|---|
| | | ParentId: [''], |
|---|
| | | Filters: c.filters |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | if (!rootNode.length) { |
|---|
| | | return this.$message.error('请添å æµç¨å¼å§èç¹'); |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (rootNode.length > 1) { |
|---|
| | | return this.$message.error('åªè½éæ©ä¸ä¸ªæµç¨å¼å§èç¹'); |
|---|
| | | } |
|---|
| | | let endNodeCount = nodeList.filter(c => { return c.type == 'end' }).length; |
|---|
| | | if (!endNodeCount) { |
|---|
| | | return this.$message.error('请éæ©å·¦ä¾§ãæµç¨ç»æãèç¹'); |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (endNodeCount > 1) { |
|---|
| | | return this.$message.error('åªè½éæ©ä¸ä¸ªãæµç¨ç»æãèç¹'); |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (lineList.some(c => { return c.to == rootNode[0].id })) { |
|---|
| | | return this.$message.error('ä¸å¼å§ç»ç¹åè¿'); |
|---|
| | | } |
|---|
| | | |
|---|
| | | for (let index = 0; index < rootNode.length; index++) { |
|---|
| | | const node = rootNode[index]; |
|---|
| | | node.OrderId = index; |
|---|
| | | //è¿éæä¸èç¹æå¤ä¸ªä¸çº§èç¹çæ¶åæ°æ®éå¤äºï¼æ¯å¦çº¿æèç¹ |
|---|
| | | |
|---|
| | | lineList.filter(c => { return c.from == node.StepId }).forEach(c => { |
|---|
| | | let item = nodeList.find(x => { return x.id == c.to }); |
|---|
| | | let _obj = rootNode.find(x => { return x.StepId === item.id }); |
|---|
| | | if (_obj) { |
|---|
| | | _obj.ParentId.push(node.StepId); |
|---|
| | | } else { |
|---|
| | | rootNode.push({ |
|---|
| | | ParentId: [node.StepId], //ç¶çº§id |
|---|
| | | StepId: item.id, |
|---|
| | | StepName: item.name, |
|---|
| | | StepAttrType: item.type, //èç¹ç±»å.startå¼å§ï¼endç»æ |
|---|
| | | StepType: item.auditType,//å®¡æ ¸ç±»å,è§è²ï¼ç¨æ·ï¼é¨é¨(è¿éåé¢èèåæ¶æ¯æå¤ä¸ªè§è²ãç¨æ·ãé¨é¨) |
|---|
| | | //å®¡æ ¸éæ©çå¼è§è²ï¼ç¨æ·ï¼é¨é¨(è¿éåé¢èèåæ¶æ¯æå¤ä¸ªè§è²ãç¨æ·ãé¨é¨) |
|---|
| | | StepValue: item.auditType == 1 ? item.userId.join(',') : (item.auditType == 2 ? item.roleId : item.deptId), |
|---|
| | | AuditRefuse: item.auditRefuse,//å®¡æ ¸æªéè¿(è¿åä¸ä¸èç¹,æµç¨éæ°å¼å§,æµç¨ç»æ) |
|---|
| | | AuditBack: item.auditBack, //驳å(è¿åä¸ä¸èç¹,æµç¨éæ°å¼å§,æµç¨ç»æ) |
|---|
| | | AuditMethod: item.auditMethod,//审æ¹æ¹å¼(å¯ç¨ä¼ç¾) |
|---|
| | | SendMail: 0, //å®¡æ ¸ååéé®ä»¶éç¥ï¼ |
|---|
| | | Filters: item.filters |
|---|
| | | }) |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | // rootNode.push(...data); |
|---|
| | | } |
|---|
| | | |
|---|
| | | rootNode.forEach(item => { |
|---|
| | | item.ParentId = item.ParentId.filter(x => { return x }).join(','); |
|---|
| | | if (item.Filters && item.Filters.length) { |
|---|
| | | item.Filters = item.Filters.map(m => { |
|---|
| | | return { |
|---|
| | | "field": m.field, |
|---|
| | | filterType: m.filterType, |
|---|
| | | value: Array.isArray(m.value) ? m.value.join(',') : m.value |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | item.Filters =JSON.stringify(item.Filters) |
|---|
| | | } else { |
|---|
| | | item.Filters = null; |
|---|
| | | } |
|---|
| | | |
|---|
| | | }) |
|---|
| | | |
|---|
| | | |
|---|
| | | for (let index = 0; index < rootNode.length; index++) { |
|---|
| | | const step = rootNode[index]; |
|---|
| | | if (!step.StepName) { |
|---|
| | | return this.$message.error(`请è¾å
¥èç¹å称`); |
|---|
| | | } |
|---|
| | | if (step.StepAttrType == 'node' && !step.StepValue) { |
|---|
| | | return this.$message.error( |
|---|
| | | `请éæ©ã${step.StepName}ãç审æ¹ç±»å` |
|---|
| | | ); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | let params = { |
|---|
| | | mainData: mainData, |
|---|
| | | detailData: rootNode, |
|---|
| | | delKeys: [] |
|---|
| | | }; |
|---|
| | | |
|---|
| | | let url = 'api/Sys_WorkFlow/' + (!this.isAdd ? 'update' : 'add'); |
|---|
| | | this.http.post(url, params, true).then((result) => { |
|---|
| | | if (!result.status) { |
|---|
| | | return this.$message.error(result.message); |
|---|
| | | } |
|---|
| | | this.$message.success('ä¿åæå'); |
|---|
| | | this.model = false; |
|---|
| | | this.$emit('parentCall', ($parent) => { |
|---|
| | | $parent.search(); |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | } |
|---|
| | | </script> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | /***************************************************************************************** |
|---|
| | | ** Author:jxx 2022 |
|---|
| | | ** QQ:283591387 |
|---|
| | | **å®æ´ææ¡£è§ï¼http://v2.volcore.xyz/document/api ã代ç çæ页é¢ViewGridã |
|---|
| | | **常ç¨ç¤ºä¾è§ï¼http://v2.volcore.xyz/document/vueDev |
|---|
| | | **åå°æä½è§ï¼http://v2.volcore.xyz/document/netCoreDev |
|---|
| | | *****************************************************************************************/ |
|---|
| | | //æ¤jsæ件æ¯ç¨æ¥èªå®ä¹æ©å±ä¸å¡ä»£ç ï¼å¯ä»¥æ©å±ä¸äºèªå®ä¹é¡µé¢æè
éæ°é
ç½®çæç代ç |
|---|
| | | import gridHeader from '@/components/basic/ViewGrid/ViewGridAudit.vue' |
|---|
| | | let extension = { |
|---|
| | | components: { |
|---|
| | | //æ¥è¯¢çé¢æ©å±ç»ä»¶ |
|---|
| | | gridHeader: gridHeader, |
|---|
| | | gridBody: '', |
|---|
| | | gridFooter: '', |
|---|
| | | //æ°å»ºãç¼è¾å¼¹åºæ¡æ©å±ç»ä»¶ |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | tableAction: '', //æå®æå¼ è¡¨çæé(è¿éå¡«å表å,é»è®¤ä¸ç¨å¡«å) |
|---|
| | | buttons: { view: [], box: [], detail: [] }, //æ©å±çæé® |
|---|
| | | methods: { |
|---|
| | | //ä¸é¢è¿äºæ¹æ³å¯ä»¥ä¿çä¹å¯ä»¥å é¤ |
|---|
| | | onInit() { |
|---|
| | | |
|---|
| | | //è¡¨æ ¼ä¸æ·»å èªå®ä¹æé® |
|---|
| | | this.columns.push({ |
|---|
| | | title: 'æä½', |
|---|
| | | field: 'æä½', |
|---|
| | | width: 120, |
|---|
| | | align: 'center', |
|---|
| | | render: (h, { row, column, index }) => { |
|---|
| | | return ( |
|---|
| | | <div> |
|---|
| | | <el-button |
|---|
| | | onClick={($e) => { |
|---|
| | | this.$refs.gridHeader.open([row],true); |
|---|
| | | }} |
|---|
| | | type="primary" |
|---|
| | | plain |
|---|
| | | size="small" |
|---|
| | | style="height:26px; padding: 10px !important;" |
|---|
| | | > |
|---|
| | | å®¡æ ¸ |
|---|
| | | </el-button> |
|---|
| | | <el-button |
|---|
| | | onClick={($e) => { |
|---|
| | | this.$tabs.open({ |
|---|
| | | text: row.WorkTableName || row.WorkName, |
|---|
| | | path: '/' + row.WorkTable, |
|---|
| | | query: { id: row.WorkTableKey, viewflow: 1 } |
|---|
| | | }); |
|---|
| | | }} |
|---|
| | | type="default" |
|---|
| | | plain |
|---|
| | | size="small" |
|---|
| | | style="height:26px; padding: 10px !important;" |
|---|
| | | > |
|---|
| | | æ¥ç |
|---|
| | | </el-button> |
|---|
| | | </div> |
|---|
| | | ) |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | //æ¡æ¶åå§åé
ç½®å |
|---|
| | | //å¦æè¦é
ç½®æç»è¡¨,å¨æ¤æ¹æ³æä½ |
|---|
| | | //this.detailOptions.columns.forEach(column=>{ }); |
|---|
| | | }, |
|---|
| | | searchBefore(param) { |
|---|
| | | //çé¢æ¥è¯¢å,å¯ä»¥ç»param.wheresæ·»å æ¥è¯¢åæ° |
|---|
| | | //è¿åfalseï¼åä¸ä¼æ§è¡æ¥è¯¢ |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | searchAfter(result) { |
|---|
| | | //æ¥è¯¢åï¼resultè¿åçæ¥è¯¢æ°æ®,å¯ä»¥å¨æ¾ç¤ºå°è¡¨æ ¼åå¤çè¡¨æ ¼çå¼ |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | addBefore(formData) { |
|---|
| | | //æ°å»ºä¿ååformData为对象ï¼å
æ¬æç»è¡¨ï¼å¯ä»¥ç»ç»è¡¨å设置å¼ï¼èªå·±è¾åºçformDataçå¼ |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | updateBefore(formData) { |
|---|
| | | //ç¼è¾ä¿ååformData为对象ï¼å
æ¬æç»è¡¨ãå é¤è¡çId |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | rowClick({ row, column, event }) { |
|---|
| | | //æ¥è¯¢çé¢ç¹å»è¡äºä»¶ |
|---|
| | | // this.$refs.table.$refs.table.toggleRowSelection(row); //åå»è¡æ¶éä¸å½åè¡; |
|---|
| | | }, |
|---|
| | | modelOpenAfter(row) { |
|---|
| | | //ç¹å»ç¼è¾ãæ°å»ºæé®å¼¹åºæ¡åï¼å¯ä»¥å¨æ¤å¤åé»è¾ï¼å¦ï¼ä»åå°è·åæ°æ® |
|---|
| | | //(1)å¤ææ¯ç¼è¾è¿æ¯æ°å»ºæä½ï¼ this.currentAction=='Add'; |
|---|
| | | //(2)ç»å¼¹åºæ¡è®¾ç½®é»è®¤å¼ |
|---|
| | | //(3)this.editFormFields.å段='xxx'; |
|---|
| | | //å¦æéè¦ç»ä¸ææ¡è®¾ç½®é»è®¤å¼ï¼è¯·éåthis.editFormOptionsæ¾å°å段é
置对åºdataå±æ§çkeyå¼ |
|---|
| | | //çä¸æå°±æè¾åºçï¼console.log(this.editFormOptions) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | //author:jxx |
|---|
| | | //æ¤å¤æ¯å¯¹è¡¨åçæ¹æ³ï¼ç»ä»¶ï¼æéæä½æé®çè¿è¡ä»»ææ©å±(æ¹æ³æ©å±å¯åç
§SellOrder.js) |
|---|
| | | let extension = { |
|---|
| | | components: {//å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | gridHeader: '',//{ template: "<div>æ©å±ç»xx件</div>" }, |
|---|
| | | gridBody: '', |
|---|
| | | gridFooter: '', |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | text: "ç¹å»å·¦ä¾§è¡¨ååååå³å¯å è½½æ¶éçæ°æ®", |
|---|
| | | tableAction: "formCollectionResultTree", |
|---|
| | | buttons: { view: [], box: [], detail: [] },//æ©å±çæé® |
|---|
| | | methods: {//äºä»¶æ©å± |
|---|
| | | onInit() { |
|---|
| | | this.textInline = false; |
|---|
| | | // this.ck = false; |
|---|
| | | this.load = false; |
|---|
| | | this.setFiexdSearchForm(true); |
|---|
| | | |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | this.height = this.height - 74; |
|---|
| | | }, |
|---|
| | | loadById(item) { |
|---|
| | | let columns = [ |
|---|
| | | { |
|---|
| | | title: "æ交人", |
|---|
| | | field: "Creator" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | title: "æ交æ¶é´", |
|---|
| | | field: "CreateDate" |
|---|
| | | }]; |
|---|
| | | JSON.parse(item.formOptions).formOptions.forEach(x => { |
|---|
| | | columns.push(...x.map(m => { |
|---|
| | | return { |
|---|
| | | title: m.title, |
|---|
| | | field: m.field, |
|---|
| | | type: m.type |
|---|
| | | } |
|---|
| | | })) |
|---|
| | | }) |
|---|
| | | this.formId = item.formId; |
|---|
| | | this.columns.splice(0); |
|---|
| | | this.columns.push(...columns); |
|---|
| | | this.search(); |
|---|
| | | }, |
|---|
| | | exportBefore(formData) { |
|---|
| | | formData.Value = this.formId; |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | searchBefore(formData) { |
|---|
| | | // formData.Value = this.formId; |
|---|
| | | formData.wheres.push({name:'FormId',value:this.formId}) |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | searchAfter(rows) { |
|---|
| | | rows.forEach(row => { |
|---|
| | | if (row.FormData) { |
|---|
| | | let data = JSON.parse(row.FormData); |
|---|
| | | for (const key in data) { |
|---|
| | | row[key] = Array.isArray(data[key]) ? data[key].filter(x => { return x != null && x != undefined }).join(',') : data[key]; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | return true; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <div> |
|---|
| | | <VolBox |
|---|
| | | :on-model-close="onModelClose" |
|---|
| | | :lazy="true" |
|---|
| | | v-model="model" |
|---|
| | | title="表å设计" |
|---|
| | | :height="height" |
|---|
| | | :width="width" |
|---|
| | | :padding="0" |
|---|
| | | > |
|---|
| | | <div :style="{height: height+'px'}"> |
|---|
| | | <VolFormDraggable |
|---|
| | | ref="form" |
|---|
| | | :showTips="false" |
|---|
| | | style="height:500px" |
|---|
| | | @save="save" |
|---|
| | | :userComponents="userComponents" |
|---|
| | | ></VolFormDraggable> |
|---|
| | | </div> |
|---|
| | | <template #footer> |
|---|
| | | <el-button type="default" size="small" @click="model = false" |
|---|
| | | >å
³é</el-button |
|---|
| | | > |
|---|
| | | </template> |
|---|
| | | </VolBox> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import VolFormDraggable from "@/components/basic/VolFormDraggable/index.js"; |
|---|
| | | import VolBox from "@/components/basic/VolBox.vue"; |
|---|
| | | export default { |
|---|
| | | components: { |
|---|
| | | VolBox, |
|---|
| | | VolFormDraggable, |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | height: 0, |
|---|
| | | width: 0, |
|---|
| | | model: false, |
|---|
| | | userComponents: [], |
|---|
| | | row: {}, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | created() { |
|---|
| | | this.width = document.body.clientWidth * 0.96; |
|---|
| | | this.height = document.body.clientHeight * 0.9; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | open(row) { |
|---|
| | | if (row.DaraggeOptions && row.DaraggeOptions != "[]") { |
|---|
| | | this.userComponents = JSON.parse(row.DaraggeOptions); |
|---|
| | | } else { |
|---|
| | | this.userComponents = []; |
|---|
| | | } |
|---|
| | | this.row = row; |
|---|
| | | this.model = true; |
|---|
| | | }, |
|---|
| | | onModelClose() {}, |
|---|
| | | save(options) { |
|---|
| | | if (!options) { |
|---|
| | | options = this.$refs.form.save(); |
|---|
| | | } |
|---|
| | | this.row.DaraggeOptions = JSON.stringify(options.daraggeOptions); |
|---|
| | | this.row.FormOptions = JSON.stringify(options.formOptions); |
|---|
| | | let formConfig = []; |
|---|
| | | options.formOptions.formOptions.forEach((item) => { |
|---|
| | | formConfig.push(...item); |
|---|
| | | }); |
|---|
| | | this.row.FormConfig = JSON.stringify(formConfig); |
|---|
| | | this.row.TableConfig=JSON.stringify(options.formOptions.tables); |
|---|
| | | this.http |
|---|
| | | .post("api/FormDesignOptions/update", { mainData: this.row }, true) |
|---|
| | | .then((x) => { |
|---|
| | | if (!x.status) { |
|---|
| | | this.$Message.error(x.message); |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | this.model = false; |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | //author:jxx |
|---|
| | | //æ¤å¤æ¯å¯¹è¡¨åçæ¹æ³ï¼ç»ä»¶ï¼æéæä½æé®çè¿è¡ä»»ææ©å±(æ¹æ³æ©å±å¯åç
§SellOrder.js) |
|---|
| | | import gridHeader from './FormCollectionOptionsGridHeader.vue' |
|---|
| | | import { h, resolveComponent } from 'vue'; |
|---|
| | | let extension = { |
|---|
| | | components: {//å¨ææ©å
ç»ä»¶æç»ä»¶è·¯å¾ |
|---|
| | | //表åheaderãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | gridHeader:gridHeader,//{ template: "<div>æ©å±ç»xx件</div>" }, |
|---|
| | | gridBody: { |
|---|
| | | render() { |
|---|
| | | return [ |
|---|
| | | h(resolveComponent('el-alert'), { |
|---|
| | | style: { 'margin-bottom': '12px' }, |
|---|
| | | 'show-icon': true, type: 'success', |
|---|
| | | closable: false, title: '1ãç¹å»æ°å»ºé便è¾å
¥,2ãç¹å»è¡¨æ ¼[表å设计]ç¶åä¿å,3ãç¹å»é¢è§(页é¢æå¼åæ交æ°æ®),4ãæ°æ®éé页é¢çæ¥ç»æ' |
|---|
| | | }, ''), |
|---|
| | | ] |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | gridFooter: '', |
|---|
| | | //å¼¹åºæ¡(ä¿®æ¹ãç¼è¾ãæ¥ç)headerãcontentãfooter对åºä½ç½®æ©å
çç»ä»¶ |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | buttons: {view: [], box:[], detail:[]},//æ©å±çæé® |
|---|
| | | methods: {//äºä»¶æ©å± |
|---|
| | | onInit() { |
|---|
| | | this.boxOptions.height=200; |
|---|
| | | this.initFormButton(); |
|---|
| | | }, |
|---|
| | | onInited(){ |
|---|
| | | this.height= this.height-40; |
|---|
| | | }, |
|---|
| | | initFormButton() { |
|---|
| | | this.columns.splice(this.columns.findIndex(x => { return x.field == 'FormFields' }), 1, ...[{ |
|---|
| | | title: "æä½", |
|---|
| | | field: "表å设计", |
|---|
| | | with: 80, |
|---|
| | | sort: false, |
|---|
| | | formatter: () => { |
|---|
| | | return '<a style="color: #3a8ee6;">表å设计</a>' |
|---|
| | | }, |
|---|
| | | click: (row) => { |
|---|
| | | this.$refs.gridHeader.open(row); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | title: "é¢è§", |
|---|
| | | field: "é¢è§", |
|---|
| | | with: 85, |
|---|
| | | sort: false, |
|---|
| | | formatter: () => { |
|---|
| | | return '<a style="color: #3a8ee6;">é¢è§</a>' |
|---|
| | | }, |
|---|
| | | click: (row) => { |
|---|
| | | this.$tabs.open({ |
|---|
| | | path: "/formSubmit", text: row.Title, query: { |
|---|
| | | id: row.FormId |
|---|
| | | } |
|---|
| | | }) |
|---|
| | | // this.$refs.gridHeader.open(row); |
|---|
| | | } |
|---|
| | | }]) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | /***************************************************************************************** |
|---|
| | | ** Author:jxx 2022 |
|---|
| | | ** QQ:283591387 |
|---|
| | | **å®æ´ææ¡£è§ï¼http://v2.volcore.xyz/document/api ã代ç çæ页é¢ViewGridã |
|---|
| | | **常ç¨ç¤ºä¾è§ï¼http://v2.volcore.xyz/document/vueDev |
|---|
| | | **åå°æä½è§ï¼http://v2.volcore.xyz/document/netCoreDev |
|---|
| | | *****************************************************************************************/ |
|---|
| | | //æ¤jsæ件æ¯ç¨æ¥èªå®ä¹æ©å±ä¸å¡ä»£ç ï¼å¯ä»¥æ©å±ä¸äºèªå®ä¹é¡µé¢æè
éæ°é
ç½®çæç代ç |
|---|
| | | |
|---|
| | | let extension = { |
|---|
| | | components: { |
|---|
| | | //æ¥è¯¢çé¢æ©å±ç»ä»¶ |
|---|
| | | gridHeader: '', |
|---|
| | | gridBody: '', |
|---|
| | | gridFooter: '', |
|---|
| | | //æ°å»ºãç¼è¾å¼¹åºæ¡æ©å±ç»ä»¶ |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | tableAction: 'Sys_QuartzLog', //æå®æå¼ è¡¨çæé(è¿éå¡«å表å,é»è®¤ä¸ç¨å¡«å) |
|---|
| | | buttons: { view: [], box: [], detail: [] }, //æ©å±çæé® |
|---|
| | | methods: { |
|---|
| | | //ä¸é¢è¿äºæ¹æ³å¯ä»¥ä¿çä¹å¯ä»¥å é¤ |
|---|
| | | onInit() { |
|---|
| | | //æ¡æ¶åå§åé
ç½®åï¼ |
|---|
| | | //示ä¾ï¼å¨æé®çæåé¢æ·»å ä¸ä¸ªæé® |
|---|
| | | // this.buttons.unshift({ //ä¹å¯ä»¥ç¨pushæè
spliceæ¹æ³æ¥ä¿®æ¹buttonsæ°ç» |
|---|
| | | // name: 'æé®', //æé®å称 |
|---|
| | | // icon: 'el-icon-document', //æé®å¾æ vue2çæ¬è§iviewææ¡£iconï¼vue3çæ¬è§element uiææ¡£icon(注æä¸æ¯element pulsææ¡£) |
|---|
| | | // type: 'primary', //æé®æ ·å¼vue2çæ¬è§iviewææ¡£buttonï¼vue3çæ¬è§element uiææ¡£button |
|---|
| | | // onClick: function () { |
|---|
| | | // this.$Message.success('ç¹å»äºæé®'); |
|---|
| | | // } |
|---|
| | | // }); |
|---|
| | | if (this.$route.path != '/Sys_QuartzLog') { |
|---|
| | | this.tableHeight = 345; |
|---|
| | | } |
|---|
| | | //示ä¾ï¼è®¾ç½®ä¿®æ¹æ°å»ºãç¼è¾å¼¹åºæ¡å段æ ç¾çé¿åº¦ |
|---|
| | | // this.boxOptions.labelWidth = 150; |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | //æ¡æ¶åå§åé
ç½®å |
|---|
| | | //å¦æè¦é
ç½®æç»è¡¨,å¨æ¤æ¹æ³æä½ |
|---|
| | | //this.detailOptions.columns.forEach(column=>{ }); |
|---|
| | | }, |
|---|
| | | searchBefore(param) { |
|---|
| | | //çé¢æ¥è¯¢å,å¯ä»¥ç»param.wheresæ·»å æ¥è¯¢åæ° |
|---|
| | | //è¿åfalseï¼åä¸ä¼æ§è¡æ¥è¯¢ |
|---|
| | | if (this.$route.path != '/Sys_QuartzLog') { |
|---|
| | | param.wheres.push({ |
|---|
| | | name: 'Id', |
|---|
| | | value: this.$store.getters.data().quartzId |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | searchAfter(result) { |
|---|
| | | //æ¥è¯¢åï¼resultè¿åçæ¥è¯¢æ°æ®,å¯ä»¥å¨æ¾ç¤ºå°è¡¨æ ¼åå¤çè¡¨æ ¼çå¼ |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | addBefore(formData) { |
|---|
| | | //æ°å»ºä¿ååformData为对象ï¼å
æ¬æç»è¡¨ï¼å¯ä»¥ç»ç»è¡¨å设置å¼ï¼èªå·±è¾åºçformDataçå¼ |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | updateBefore(formData) { |
|---|
| | | //ç¼è¾ä¿ååformData为对象ï¼å
æ¬æç»è¡¨ãå é¤è¡çId |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | rowClick({ row, column, event }) { |
|---|
| | | //æ¥è¯¢çé¢ç¹å»è¡äºä»¶ |
|---|
| | | // this.$refs.table.$refs.table.toggleRowSelection(row); //åå»è¡æ¶éä¸å½åè¡; |
|---|
| | | }, |
|---|
| | | modelOpenAfter(row) { |
|---|
| | | //ç¹å»ç¼è¾ãæ°å»ºæé®å¼¹åºæ¡åï¼å¯ä»¥å¨æ¤å¤åé»è¾ï¼å¦ï¼ä»åå°è·åæ°æ® |
|---|
| | | //(1)å¤ææ¯ç¼è¾è¿æ¯æ°å»ºæä½ï¼ this.currentAction=='Add'; |
|---|
| | | //(2)ç»å¼¹åºæ¡è®¾ç½®é»è®¤å¼ |
|---|
| | | //(3)this.editFormFields.å段='xxx'; |
|---|
| | | //å¦æéè¦ç»ä¸ææ¡è®¾ç½®é»è®¤å¼ï¼è¯·éåthis.editFormOptionsæ¾å°å段é
置对åºdataå±æ§çkeyå¼ |
|---|
| | | //çä¸æå°±æè¾åºçï¼console.log(this.editFormOptions) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | /***************************************************************************************** |
|---|
| | | ** Author:jxx 2022 |
|---|
| | | ** QQ:283591387 |
|---|
| | | **å®æ´ææ¡£è§ï¼http://v2.volcore.xyz/document/api ã代ç çæ页é¢ViewGridã |
|---|
| | | **常ç¨ç¤ºä¾è§ï¼http://v2.volcore.xyz/document/vueDev |
|---|
| | | **åå°æä½è§ï¼http://v2.volcore.xyz/document/netCoreDev |
|---|
| | | *****************************************************************************************/ |
|---|
| | | //æ¤jsæ件æ¯ç¨æ¥èªå®ä¹æ©å±ä¸å¡ä»£ç ï¼å¯ä»¥æ©å±ä¸äºèªå®ä¹é¡µé¢æè
éæ°é
ç½®çæç代ç |
|---|
| | | import gridBody from './Sys_QuartzOptionsGridBody'; |
|---|
| | | let extension = { |
|---|
| | | components: { |
|---|
| | | //æ¥è¯¢çé¢æ©å±ç»ä»¶ |
|---|
| | | gridHeader: '', |
|---|
| | | gridBody: gridBody, |
|---|
| | | gridFooter: '', |
|---|
| | | //æ°å»ºãç¼è¾å¼¹åºæ¡æ©å±ç»ä»¶ |
|---|
| | | modelHeader: '', |
|---|
| | | modelBody: '', |
|---|
| | | modelFooter: '' |
|---|
| | | }, |
|---|
| | | tableAction: '', //æå®æå¼ è¡¨çæé(è¿éå¡«å表å,é»è®¤ä¸ç¨å¡«å) |
|---|
| | | buttons: { view: [], box: [], detail: [] }, //æ©å±çæé® |
|---|
| | | methods: { |
|---|
| | | //ä¸é¢è¿äºæ¹æ³å¯ä»¥ä¿çä¹å¯ä»¥å é¤ |
|---|
| | | onInit() { |
|---|
| | | this.textInline = false; |
|---|
| | | this.columns.push({ |
|---|
| | | field: 'æä½', |
|---|
| | | title: 'æä½', |
|---|
| | | width: 150, |
|---|
| | | fixed: 'right', |
|---|
| | | align: 'center', |
|---|
| | | render: (h, { row, column, index }) => { |
|---|
| | | return h('div', { style: { color: '#0e84ff' } }, [ |
|---|
| | | h( |
|---|
| | | 'span', |
|---|
| | | { |
|---|
| | | style: { |
|---|
| | | cursor: 'pointer', |
|---|
| | | 'margin-right': '8px', |
|---|
| | | 'border-bottom': '1px solid' |
|---|
| | | }, |
|---|
| | | onClick: (e) => { |
|---|
| | | this.request('start', row); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | 'æ§è¡' |
|---|
| | | ), |
|---|
| | | h( |
|---|
| | | 'span', |
|---|
| | | { |
|---|
| | | style: { |
|---|
| | | cursor: 'pointer', |
|---|
| | | 'margin-right': '8px', |
|---|
| | | 'border-bottom': '1px solid' |
|---|
| | | }, |
|---|
| | | onClick: (e) => { |
|---|
| | | this.request('pause', row); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | 'æå' |
|---|
| | | ), |
|---|
| | | h( |
|---|
| | | 'span', |
|---|
| | | { |
|---|
| | | style: { |
|---|
| | | cursor: 'pointer', |
|---|
| | | 'border-bottom': '1px solid' |
|---|
| | | }, |
|---|
| | | onClick: (e) => { |
|---|
| | | this.$store.getters.data().quartzId = row.Id; |
|---|
| | | this.$refs.gridBody.open(); |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | 'æ¥å¿' |
|---|
| | | ) |
|---|
| | | ]); |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | //示ä¾ï¼è®¾ç½®ä¿®æ¹æ°å»ºãç¼è¾å¼¹åºæ¡å段æ ç¾çé¿åº¦ |
|---|
| | | // this.boxOptions.labelWidth = 150; |
|---|
| | | }, |
|---|
| | | request(action, row) { |
|---|
| | | let url = `api/Sys_QuartzOptions/${action}`; |
|---|
| | | this.http.post(url, row, true).then((result) => { |
|---|
| | | this.$message.success('æ§è¡æå'); |
|---|
| | | this.search(); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | onInited() { |
|---|
| | | this.height= this.height-50; |
|---|
| | | this.columns.forEach((col) => { |
|---|
| | | if (col.field == 'Status') { |
|---|
| | | col.align = 'center'; |
|---|
| | | col.formatter = (row) => { |
|---|
| | | // return row.Status; |
|---|
| | | if (row.Status == 1) { |
|---|
| | | return '<a style="color:red;"><span style="display: inline-block;padding: 4px;background: red; border-radius: 50%; margin-right: 5px;"></span>æå</a>'; |
|---|
| | | } |
|---|
| | | return '<a style="color:#04b348;"><span style="display: inline-block;padding: 4px;background: #20c423; border-radius: 50%; margin-right: 5px;"></span>æ£å¸¸</a>'; |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | //æ¡æ¶åå§åé
ç½®å |
|---|
| | | //å¦æè¦é
ç½®æç»è¡¨,å¨æ¤æ¹æ³æä½ |
|---|
| | | //this.detailOptions.columns.forEach(column=>{ }); |
|---|
| | | this.editFormOptions.forEach((options) => { |
|---|
| | | options.forEach((option) => { |
|---|
| | | if (option.field == 'CronExpression') { |
|---|
| | | option.extra = { |
|---|
| | | style: 'color: #0e84ff;cursor: pointer;', |
|---|
| | | text: 'æ¥ç', |
|---|
| | | click: () => { |
|---|
| | | window.open('https://cron.qqe2.com/', '_blank'); |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | }, |
|---|
| | | searchBefore(param) { |
|---|
| | | //çé¢æ¥è¯¢å,å¯ä»¥ç»param.wheresæ·»å æ¥è¯¢åæ° |
|---|
| | | //è¿åfalseï¼åä¸ä¼æ§è¡æ¥è¯¢ |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | searchAfter(result) { |
|---|
| | | //æ¥è¯¢åï¼resultè¿åçæ¥è¯¢æ°æ®,å¯ä»¥å¨æ¾ç¤ºå°è¡¨æ ¼åå¤çè¡¨æ ¼çå¼ |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | addBefore(formData) { |
|---|
| | | //æ°å»ºä¿ååformData为对象ï¼å
æ¬æç»è¡¨ï¼å¯ä»¥ç»ç»è¡¨å设置å¼ï¼èªå·±è¾åºçformDataçå¼ |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | updateBefore(formData) { |
|---|
| | | //ç¼è¾ä¿ååformData为对象ï¼å
æ¬æç»è¡¨ãå é¤è¡çId |
|---|
| | | return true; |
|---|
| | | }, |
|---|
| | | rowClick({ row, column, event }) { |
|---|
| | | //æ¥è¯¢çé¢ç¹å»è¡äºä»¶ |
|---|
| | | // this.$refs.table.$refs.table.toggleRowSelection(row); //åå»è¡æ¶éä¸å½åè¡; |
|---|
| | | }, |
|---|
| | | modelOpenAfter(row) { |
|---|
| | | if (this.currentAction == 'Add' || !this.editFormFields.TimeOut) { |
|---|
| | | this.editFormFields.TimeOut = 180; |
|---|
| | | } |
|---|
| | | this.editFormOptions.forEach((options) => { |
|---|
| | | options.forEach((option) => { |
|---|
| | | if (option.field == 'GroupName') { |
|---|
| | | option.readonly = this.currentAction != 'Add'; |
|---|
| | | } |
|---|
| | | }); |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | export default extension; |
|---|
| ¶Ô±ÈÐÂÎļþ |
| | |
|---|
| | | <template> |
|---|
| | | <vol-box |
|---|
| | | :lazy="true" |
|---|
| | | v-model="model" |
|---|
| | | title="æ§è¡æ¥å¿" |
|---|
| | | :height="500" |
|---|
| | | :width="1200" |
|---|
| | | :padding="0" |
|---|
| | | > |
|---|
| | | <QuartzLog ref="log"></QuartzLog> |
|---|
| | | <template #footer> |
|---|
| | | <div> |
|---|
| | | <el-button type="default" size="mini" @click="model = false" |
|---|
| | | >å
³é</el-button |
|---|
| | | > |
|---|
| | | </div></template |
|---|
| | | > |
|---|
| | | </vol-box> |
|---|
| | | <el-alert style="margin-bottom:10px;" :show-icon="false" type="success"> |
|---|
| | | å®æ¶ä»»å¡åªæåå¸åæä¼è¿è¡(æ¬å°ä¸ä¼æ§è¡),<a |
|---|
| | | style="color:#2d8cf0;margin-left:20px;" |
|---|
| | | target="blank" |
|---|
| | | href="http://v2.volcore.xyz/document/netCoreDev" |
|---|
| | | >æ¥çé
ç½®ææ¡£</a |
|---|
| | | > |
|---|
| | | <a |
|---|
| | | style="color:#2d8cf0;margin-left:20px;" |
|---|
| | | target="blank" |
|---|
| | | href="http://v2.volcore.xyz/document/log" |
|---|
| | | >æ¥çæ´æ°æ¹å¼</a |
|---|
| | | > |
|---|
| | | </el-alert> |
|---|
| | | </template> |
|---|
| | | <script> |
|---|
| | | import VolBox from '@/components/basic/VolBox.vue'; |
|---|
| | | import QuartzLog from '@/views/system/quartz/Sys_QuartzLog'; |
|---|
| | | //è¿é使ç¨çvue2è¯æ³ï¼ä¹å¯ä»¥åævue3è¯æ³ |
|---|
| | | export default { |
|---|
| | | components: { 'vol-box': VolBox, QuartzLog }, |
|---|
| | | methods: {}, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | model: false |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | open() { |
|---|
| | | this.model = true; |
|---|
| | | this.$nextTick(() => { |
|---|
| | | this.$refs.log.$refs.grid.search(); |
|---|
| | | }); |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| 代码管理/WMS/WMS_Client/src/extension/system/system/Sys_Department.js
代码管理/WMS/WMS_Client/src/extension/widesea_system/system/dt_log.js
代码管理/WMS/WMS_Client/src/extension/widesea_wms/system/base_routing_table.js
代码管理/WMS/WMS_Client/src/extension/widesea_wms/system/dt_stationinfo.js
代码管理/WMS/WMS_Client/src/main.js
代码管理/WMS/WMS_Client/src/router/charts.js
代码管理/WMS/WMS_Client/src/router/form.js
代码管理/WMS/WMS_Client/src/router/formsMulti.js
代码管理/WMS/WMS_Client/src/router/index.js
代码管理/WMS/WMS_Client/src/router/redirect.js
代码管理/WMS/WMS_Client/src/router/tables.js
代码管理/WMS/WMS_Client/src/router/viewGird.js
代码管理/WMS/WMS_Client/src/store/index.js
代码管理/WMS/WMS_Client/src/uitils/common.js
代码管理/WMS/WMS_Client/src/views/Home.vue
代码管理/WMS/WMS_Client/src/views/Index.vue
代码管理/WMS/WMS_Client/src/views/Login.vue
代码管理/WMS/WMS_Client/src/views/Task/widesea_wms/taskinfo/dt_agvtask.vue
代码管理/WMS/WMS_Client/src/views/Task/widesea_wms/taskinfo/dt_agvtask_hty.vue
代码管理/WMS/WMS_Client/src/views/appmanager/App_Expert.vue
代码管理/WMS/WMS_Client/src/views/appmanager/App_Expert2.vue
代码管理/WMS/WMS_Client/src/views/appmanager/App_News.vue
代码管理/WMS/WMS_Client/src/views/appmanager/App_NewsEditor.vue
代码管理/WMS/WMS_Client/src/views/appmanager/App_ReportPrice.vue
代码管理/WMS/WMS_Client/src/views/appmanager/App_Transaction.vue
代码管理/WMS/WMS_Client/src/views/appmanager/App_Transaction2.vue
代码管理/WMS/WMS_Client/src/views/appmanager/App_TransactionAvgPrice.vue
代码管理/WMS/WMS_Client/src/views/builder/builderData.js
代码管理/WMS/WMS_Client/src/views/builder/coder.vue
代码管理/WMS/WMS_Client/src/views/charts/bigdata.vue
代码管理/WMS/WMS_Client/src/views/charts/bigdata/IviewCircle.vue
代码管理/WMS/WMS_Client/src/views/charts/bigdata/chart-options.js
代码管理/WMS/WMS_Client/src/views/charts/bigdata/head_bg.png
代码管理/WMS/WMS_Client/src/views/charts/bigdata/layout.less
代码管理/WMS/WMS_Client/src/views/charts/chart.vue
代码管理/WMS/WMS_Client/src/views/charts/chartOptions.js
代码管理/WMS/WMS_Client/src/views/charts/flex.vue
代码管理/WMS/WMS_Client/src/views/charts/formChart.vue
代码管理/WMS/WMS_Client/src/views/charts/formOptions.js
代码管理/WMS/WMS_Client/src/views/extension/widesea_wms/taskinfo/dt_agvtask.js
代码管理/WMS/WMS_Client/src/views/extension/widesea_wms/taskinfo/dt_agvtask_hty.js
代码管理/WMS/WMS_Client/src/views/formDraggable/FormCollectionResultTree.vue
代码管理/WMS/WMS_Client/src/views/formDraggable/FormSubmit.vue
代码管理/WMS/WMS_Client/src/views/formDraggable/formDraggable.vue
代码管理/WMS/WMS_Client/src/views/forms/editTable.vue
代码管理/WMS/WMS_Client/src/views/forms/form.vue
代码管理/WMS/WMS_Client/src/views/forms/form1.vue
代码管理/WMS/WMS_Client/src/views/forms/form2.vue
代码管理/WMS/WMS_Client/src/views/forms/form3.vue
代码管理/WMS/WMS_Client/src/views/forms/form4.vue
代码管理/WMS/WMS_Client/src/views/forms/form5.vue
代码管理/WMS/WMS_Client/src/views/forms/form6.vue
代码管理/WMS/WMS_Client/src/views/forms/form7.vue
代码管理/WMS/WMS_Client/src/views/forms/objectValidator.vue
代码管理/WMS/WMS_Client/src/views/forms/table.vue
代码管理/WMS/WMS_Client/src/views/formsMulti/multi1.vue
代码管理/WMS/WMS_Client/src/views/formsMulti/multi2.vue
代码管理/WMS/WMS_Client/src/views/formsMulti/multi3.vue
代码管理/WMS/WMS_Client/src/views/formsMulti/multil1Extension/multi1.js
代码管理/WMS/WMS_Client/src/views/formsMulti/multil1Extension/table1.vue
代码管理/WMS/WMS_Client/src/views/formsMulti/multil2Extension/mtable.vue
代码管理/WMS/WMS_Client/src/views/formsMulti/multil2Extension/multi2.js
代码管理/WMS/WMS_Client/src/views/formsMulti/multil3Extension/comMulti.vue
代码管理/WMS/WMS_Client/src/views/formsMulti/multil3Extension/multi3.js
代码管理/WMS/WMS_Client/src/views/h5/Guide.vue
代码管理/WMS/WMS_Client/src/views/home/home-chart-options.js
代码管理/WMS/WMS_Client/src/views/html/Editor.vue
代码管理/WMS/WMS_Client/src/views/html/List.vue
代码管理/WMS/WMS_Client/src/views/index/Message.vue
代码管理/WMS/WMS_Client/src/views/index/MessageConfig.js
代码管理/WMS/WMS_Client/src/views/index/index.less
代码管理/WMS/WMS_Client/src/views/order/App_Appointment.vue
代码管理/WMS/WMS_Client/src/views/order/App_Appointment2.vue
代码管理/WMS/WMS_Client/src/views/order/SellOrder.vue
代码管理/WMS/WMS_Client/src/views/order/SellOrder2.vue
代码管理/WMS/WMS_Client/src/views/order/SellOrder3.vue
代码管理/WMS/WMS_Client/src/views/order/vSellOrderImg.vue
代码管理/WMS/WMS_Client/src/views/router/viewGird.js
代码管理/WMS/WMS_Client/src/views/signalR/Index.vue
代码管理/WMS/WMS_Client/src/views/system/Permission.vue
代码管理/WMS/WMS_Client/src/views/system/Permission/RoleTree.vue
代码管理/WMS/WMS_Client/src/views/system/Sys_Dictionary.vue
代码管理/WMS/WMS_Client/src/views/system/Sys_DictionaryList.vue
代码管理/WMS/WMS_Client/src/views/system/Sys_Log.vue
代码管理/WMS/WMS_Client/src/views/system/Sys_Menu.vue
代码管理/WMS/WMS_Client/src/views/system/Sys_Role.vue
代码管理/WMS/WMS_Client/src/views/system/Sys_Role1.vue
代码管理/WMS/WMS_Client/src/views/system/Sys_User.vue
代码管理/WMS/WMS_Client/src/views/system/UserInfo.vue
代码管理/WMS/WMS_Client/src/views/system/flow/FlowDemo.vue
代码管理/WMS/WMS_Client/src/views/system/flow/Sys_WorkFlow.vue
代码管理/WMS/WMS_Client/src/views/system/flow/Sys_WorkFlowTable.vue
代码管理/WMS/WMS_Client/src/views/system/form/FormCollectionObject.vue
代码管理/WMS/WMS_Client/src/views/system/form/FormDesignOptions.vue
代码管理/WMS/WMS_Client/src/views/system/quartz/Sys_QuartzLog.vue
代码管理/WMS/WMS_Client/src/views/system/quartz/Sys_QuartzOptions.vue
代码管理/WMS/WMS_Client/src/views/system/system/Sys_Department.vue
代码管理/WMS/WMS_Client/src/views/system/test.vue
代码管理/WMS/WMS_Client/src/views/tables/table2.vue
代码管理/WMS/WMS_Client/src/views/tables/table3.vue
代码管理/WMS/WMS_Client/src/views/tables/tableForms.js
代码管理/WMS/WMS_Client/src/views/tables/tableForms.vue
代码管理/WMS/WMS_Client/src/views/tables/tableFormsViewGrid.js
代码管理/WMS/WMS_Client/src/views/tables/tabsTable.vue
代码管理/WMS/WMS_Client/src/views/treeTable/TreeTable1.vue
代码管理/WMS/WMS_Client/src/views/treeTable/TreeTable2.vue
代码管理/WMS/WMS_Client/src/views/treeTable/TreeTable3.vue
代码管理/WMS/WMS_Client/src/views/treeTable/demo1/Table.vue
代码管理/WMS/WMS_Client/src/views/treeTable/demo1/Tree.vue
代码管理/WMS/WMS_Client/src/views/treeTable/demo1/table.js
代码管理/WMS/WMS_Client/src/views/treeTable/demo2/Table2.vue
代码管理/WMS/WMS_Client/src/views/treeTable/demo2/Tree2.vue
代码管理/WMS/WMS_Client/src/views/treeTable/demo2/tree_options.js
代码管理/WMS/WMS_Client/src/views/upload/formUpload.vue
代码管理/WMS/WMS_Client/src/views/upload/volUploadExample.vue
代码管理/WMS/WMS_Client/src/views/widesea_system/dialog/logDetial.vue
代码管理/WMS/WMS_Client/src/views/widesea_system/system/dt_log.vue
代码管理/WMS/WMS_Client/src/views/widesea_wms/system/base_routing_table.vue
代码管理/WMS/WMS_Client/src/views/widesea_wms/system/dt_stationinfo.vue
代码管理/WMS/WMS_Client/tests/unit/example.spec.js
代码管理/WMS/WMS_Client/vue.config.js
代码管理/WMS/WMS_Client/yarn.lock
代码管理/WMS/WMS_Server/.dockerignore
代码管理/WMS/WMS_Server/.gitattributes
代码管理/WMS/WMS_Server/.gitignore
代码管理/WMS/WMS_Server/Dockerfile
代码管理/WMS/WMS_Server/WIDESEA_Builder/IRepositories/Core/ISys_TableInfoRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_Builder/IServices/Core/ISys_TableInfoService.cs
代码管理/WMS/WMS_Server/WIDESEA_Builder/IServices/Core/Partial/ISys_TableInfoService.cs
代码管理/WMS/WMS_Server/WIDESEA_Builder/Properties/launchSettings.json
代码管理/WMS/WMS_Server/WIDESEA_Builder/Repositories/Core/Sys_TableInfoRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_Builder/Services/Core/Partial/Sys_TableInfoService.cs
代码管理/WMS/WMS_Server/WIDESEA_Builder/Services/Core/Sys_TableInfoService.cs
代码管理/WMS/WMS_Server/WIDESEA_Builder/Utility/ProjectPath.cs
代码管理/WMS/WMS_Server/WIDESEA_Builder/WIDESEA_Builder.csproj
代码管理/WMS/WMS_Server/WIDESEA_Comm/DataHandle/DataParse.cs
代码管理/WMS/WMS_Server/WIDESEA_Comm/DataHandle/OperateDB.cs
代码管理/WMS/WMS_Server/WIDESEA_Comm/Http/HttpHelper.cs
代码管理/WMS/WMS_Server/WIDESEA_Comm/LogInfo/WriteDBLog.cs
代码管理/WMS/WMS_Server/WIDESEA_Comm/LogInfo/WriteLog.cs
代码管理/WMS/WMS_Server/WIDESEA_Comm/WIDESEA_Comm.csproj
代码管理/WMS/WMS_Server/WIDESEA_Core/BaseInterface/IServices.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/BaseProvider/DictionaryComponent/DictionaryViewComponent.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/BaseProvider/IRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/BaseProvider/IService.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/BaseProvider/RepositoryBase.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/BaseProvider/ServerMapPath/PathProvider.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/BaseProvider/ServiceBase.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/CacheManager/IService/ICacheService.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/CacheManager/Service/MemoryCacheService .cs
代码管理/WMS/WMS_Server/WIDESEA_Core/CacheManager/Service/RedisCacheService.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Configuration/AppSetting.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Const/ApplicationContentType.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Const/DataBaseType.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Const/HtmlElementType.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Const/Secret.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Const/SqlDbTypeName.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Controllers/Basic/ApiBaseController.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Controllers/Basic/BaseController.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Controllers/Basic/WebBaseController.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/DBManager/DBConnectionAttribute.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/DBManager/DBServerProvider.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/DBManager/DbName.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/DBManager/Partial/DBServerProvider.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Dapper/DapperParseGuidTypeHandler.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Dapper/ISqlDapper.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Dapper/SqlDapper.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/EFDbContext/EFLoggerProvider.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/EFDbContext/VOLContext.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Enums/ActionPermissionOptions.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Enums/ApiMessage.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Enums/ApiStatutsCode.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Enums/CPrefix.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Enums/DbCurrentType.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Enums/LinqExpressionType.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Enums/LoggerType.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Enums/QueryOrderBy.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Enums/ResponseType.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Enums/UserAgent.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/AuthorizationResponse.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/AutofacManager/AutofacContainerModule.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/AutofacManager/AutofacContainerModuleExtension.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/AutofacManager/IDependency.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/CacheKeyExtensions.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/ConvertJsonExtension.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/EntityProperties.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/GenericExtension.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/HtmlHelperViewExtensions.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/LambdaExtensions.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/ObjectExtension.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/RequestExtension.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/Response/ResponseMsg.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/SecurityEncDecryptExtension.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/ServerExtension.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/ServiceProviderManagerExtension.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/StaticFileExtensions.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/StaticHttpContextExtensions.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Extensions/StringExtension.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Filters/ActionExecuteFilter.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Filters/ActionPermissionAttribute.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Filters/ActionPermissionFilter.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Filters/ActionPermissionRequirement.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Filters/ApiActionPermissionAttribute.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Filters/ApiAuthorizeFilter.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Filters/FixedTokenAttribute.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Filters/JWTAuthorize.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Filters/ServiceFunFilter.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/FreeDB/FreeDB.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Infrastructure/DictionaryHandler.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Infrastructure/DictionaryManager.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Middleware/ExceptionHandlerMiddleWare.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Middleware/HttpRequestMiddleware.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/ModelBinder/BaseBinderProvider.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/ModelBinder/BaseModelBinder.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/ModelBinder/BinderObject.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/ObjectActionValidator/ExpressValidator/GeneralOptions.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/ObjectActionValidator/ExpressValidator/MethodsValidator.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/ObjectActionValidator/ExpressValidator/ObjectModelValidatorState.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/ObjectActionValidator/Filters/ObjectGeneralValidatorFilter.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/ObjectActionValidator/Filters/ObjectModelValidatorFilter.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/ObjectActionValidator/NullObjectModelValidator.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/ObjectActionValidator/ValidationContainer.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Properties/launchSettings.json
代码管理/WMS/WMS_Server/WIDESEA_Core/Services/ActionExecutingLogger.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Services/Logger.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Tenancy/TenancyManager.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/UserManager/DepartmentContext.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/UserManager/RoleContext.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/UserManager/UserContext.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/ApiAuthorizeRequire.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/DateTimeExtension.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/DateTimeHelper.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/DynamicPropertyBag .cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/EPPlusHelper.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/FileHelper.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/HttpContext.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/HttpManager.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/JwtHelper.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/MailHelper.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/NPOIHelper.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/PDFHelper/IPDFService.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/PDFHelper/PDFService.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/Response/FilterResponse.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/Response/WebResponseContent.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/SecurityEncDecrypt.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/VierificationCode.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/VierificationCodeHelpers.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/VierificationCodeServices.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/Utilities/XmlHelper.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/WIDESEA_Core.csproj
代码管理/WMS/WMS_Server/WIDESEA_Core/WorkFlow/AuditBack.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/WorkFlow/AuditRefuse.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/WorkFlow/AuditStatus.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/WorkFlow/FieldFilter.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/WorkFlow/StepType.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/WorkFlow/WorkFlowContainer.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/WorkFlow/WorkFlowFilter.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/WorkFlow/WorkFlowManager.cs
代码管理/WMS/WMS_Server/WIDESEA_Core/WorkFlow/WorkFlowTableOptions.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/AttributeManager/EntityAttribute.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/AttributeManager/PermissionTableAttribute.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/BaseCore/MappingManager.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/ApiEntity/Input/ApiSys_UserInput.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/ApiEntity/OutPut/ApiSys_UserOutput.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/Core/LoadSingleDataModel.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/Core/PageGridData.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/Core/SaveDataModel.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/Core/Sys_TableColumn.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/Core/Sys_TableInfo.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/LoginInfo.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/Permissions.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/RoleAuthor.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/Sys_Department.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/Sys_Dictionary.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/Sys_DictionaryList.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/Sys_Log.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/Sys_Menu.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/Sys_Role.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/Sys_RoleAuth.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/Sys_User.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/Sys_UserDepartment.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/TableColumnInfo.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/UserInfo.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/base_routing_table.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/dt_log.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/dt_stationinfo.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/partial/Sys_Department.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/partial/Sys_User.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/partial/Sys_UserDepartment.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/partial/base_routing_table.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/partial/dt_log.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/partial/dt_stationinfo.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/System/vSys_Dictionary.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/Taskinfo/dt_agvtask.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/Taskinfo/dt_agvtask_hty.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/Taskinfo/partial/dt_agvtask.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/Taskinfo/partial/dt_agvtask_hty.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/flow/Sys_WorkFlow.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/flow/Sys_WorkFlowStep.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/flow/Sys_WorkFlowTable.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/flow/Sys_WorkFlowTableAuditLog.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/flow/Sys_WorkFlowTableStep.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/flow/partial/Sys_WorkFlow.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/flow/partial/Sys_WorkFlowStep.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/flow/partial/Sys_WorkFlowTable.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/flow/partial/Sys_WorkFlowTableAuditLog.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/DomainModels/flow/partial/Sys_WorkFlowTableStep.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/MappingManager.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/System/Sys_DepartmentMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/System/Sys_DictionaryListMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/System/Sys_DictionaryMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/System/Sys_LogMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/System/Sys_MenuMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/System/Sys_RoleMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/System/Sys_UserDepartmentMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/System/Sys_UserMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/System/base_routing_tableMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/System/dt_logMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/System/dt_stationinfoMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/System/vSys_DictionaryMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/Taskinfo/dt_agvtaskMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/Taskinfo/dt_agvtask_htyMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/flow/Sys_WorkFlowMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/flow/Sys_WorkFlowStepMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/flow/Sys_WorkFlowTableAuditLogMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/flow/Sys_WorkFlowTableMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/MappingConfiguration/flow/Sys_WorkFlowTableStepMapConfig.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/SystemModels/BaseEntity.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/SystemModels/Sys_MenuRole.cs
代码管理/WMS/WMS_Server/WIDESEA_Entity/WIDESEA_Entity.csproj
代码管理/WMS/WMS_Server/WIDESEA_System/IRepositories/System/ISys_DepartmentRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IRepositories/System/ISys_DictionaryListRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IRepositories/System/ISys_DictionaryRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IRepositories/System/ISys_LogRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IRepositories/System/ISys_MenuRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IRepositories/System/ISys_RoleRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IRepositories/System/ISys_UserRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IRepositories/System/Idt_logRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IRepositories/System/IvSys_DictionaryRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IRepositories/flow/ISys_WorkFlowRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IRepositories/flow/ISys_WorkFlowStepRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IRepositories/flow/ISys_WorkFlowTableAuditLogRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IRepositories/flow/ISys_WorkFlowTableRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IRepositories/flow/ISys_WorkFlowTableStepRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/System/ISys_DepartmentService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/System/ISys_DictionaryListService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/System/ISys_DictionaryService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/System/ISys_LogService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/System/ISys_MenuService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/System/ISys_RoleService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/System/ISys_UserService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/System/Idt_logService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/System/IvSys_DictionaryService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/System/Partial/ISys_DepartmentService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/System/Partial/ISys_DictionaryListService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/System/Partial/ISys_DictionaryService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/System/Partial/ISys_MenuService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/System/Partial/ISys_RoleService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/System/Partial/ISys_UserService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/System/Partial/Idt_logService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/flow/ISys_WorkFlowService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/flow/ISys_WorkFlowStepService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/flow/ISys_WorkFlowTableAuditLogService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/flow/ISys_WorkFlowTableService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/flow/ISys_WorkFlowTableStepService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/flow/Partial/ISys_WorkFlowService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/flow/Partial/ISys_WorkFlowStepService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/flow/Partial/ISys_WorkFlowTableAuditLogService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/flow/Partial/ISys_WorkFlowTableService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/IServices/flow/Partial/ISys_WorkFlowTableStepService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Properties/launchSettings.json
代码管理/WMS/WMS_Server/WIDESEA_System/Repositories/System/Partial/Sys_MenuRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Repositories/System/Sys_DepartmentRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Repositories/System/Sys_DictionaryListRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Repositories/System/Sys_DictionaryRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Repositories/System/Sys_LogRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Repositories/System/Sys_MenuRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Repositories/System/Sys_RoleRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Repositories/System/Sys_UserRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Repositories/System/dt_logRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Repositories/System/vSys_DictionaryRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Repositories/flow/Sys_WorkFlowRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Repositories/flow/Sys_WorkFlowStepRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Repositories/flow/Sys_WorkFlowTableAuditLogRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Repositories/flow/Sys_WorkFlowTableRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Repositories/flow/Sys_WorkFlowTableStepRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/System/Partial/Sys_DepartmentService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/System/Partial/Sys_DictionaryListService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/System/Partial/Sys_DictionaryService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/System/Partial/Sys_MenuService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/System/Partial/Sys_RoleService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/System/Partial/Sys_UserService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/System/Partial/dt_logService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/System/Sys_DepartmentService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/System/Sys_DictionaryListService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/System/Sys_DictionaryService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/System/Sys_LogService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/System/Sys_MenuService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/System/Sys_RoleService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/System/Sys_UserService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/System/dt_logService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/System/vSys_DictionaryService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/flow/Partial/Sys_WorkFlowService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/flow/Partial/Sys_WorkFlowStepService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/flow/Partial/Sys_WorkFlowTableAuditLogService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/flow/Partial/Sys_WorkFlowTableService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/flow/Partial/Sys_WorkFlowTableStepService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/flow/Sys_WorkFlowService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/flow/Sys_WorkFlowStepService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/flow/Sys_WorkFlowTableAuditLogService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/flow/Sys_WorkFlowTableService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/Services/flow/Sys_WorkFlowTableStepService.cs
代码管理/WMS/WMS_Server/WIDESEA_System/WIDESEA_System.csproj
代码管理/WMS/WMS_Server/WIDESEA_WMS/IRepositories/Taskinfo/Idt_agvtaskRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/IRepositories/Taskinfo/Idt_agvtask_htyRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/IRepositories/system/Ibase_routing_tableRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/IRepositories/system/Idt_stationinfoRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/IServices/Taskinfo/Idt_agvtaskService.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/IServices/Taskinfo/Idt_agvtask_htyService.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/IServices/Taskinfo/Partial/Idt_agvtaskService.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/IServices/Taskinfo/Partial/Idt_agvtask_htyService.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/IServices/system/Ibase_routing_tableService.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/IServices/system/Idt_stationinfoService.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/IServices/system/Partial/Ibase_routing_tableService.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/IServices/system/Partial/Idt_stationinfoService.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/Repositories/Taskinfo/dt_agvtaskRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/Repositories/Taskinfo/dt_agvtask_htyRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/Repositories/system/base_routing_tableRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/Repositories/system/dt_stationinfoRepository.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/Services/Taskinfo/Partial/dt_agvtaskService.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/Services/Taskinfo/Partial/dt_agvtask_htyService.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/Services/Taskinfo/dt_agvtaskService.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/Services/Taskinfo/dt_agvtask_htyService.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/Services/system/Partial/base_routing_tableService.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/Services/system/Partial/dt_stationinfoService.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/Services/system/base_routing_tableService.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/Services/system/dt_stationinfoService.cs
代码管理/WMS/WMS_Server/WIDESEA_WMS/WIDESEA_WMS.csproj
代码管理/WMS/WMS_Server/WIDESEA_WMSServe.sln
代码管理/WMS/WMS_Server/WIDESEA_WebApi/.config/dotnet-tools.json
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/ApiHomeController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/Builder/BuilderController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Partial/Sys_DepartmentController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Partial/Sys_DictionaryController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Partial/Sys_DictionaryListController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Partial/Sys_MenuController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Partial/Sys_RoleController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Partial/Sys_UserController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Partial/Sys_WorkFlowController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Partial/Sys_WorkFlowStepController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Partial/Sys_WorkFlowTableAuditLogController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Partial/Sys_WorkFlowTableController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Partial/Sys_WorkFlowTableStepController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Sys_DepartmentController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Sys_DictionaryController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Sys_DictionaryListController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Sys_LogController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Sys_MenuController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Sys_RoleController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Sys_UserController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Sys_WorkFlowController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Sys_WorkFlowStepController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Sys_WorkFlowTableAuditLogController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Sys_WorkFlowTableController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/System/Sys_WorkFlowTableStepController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/WIDESEA_System/Partial/dt_logController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/WIDESEA_System/dt_logController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/WIDESEA_WMS/Partial/base_routing_tableController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/WIDESEA_WMS/Partial/dt_agvtaskController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/WIDESEA_WMS/Partial/dt_agvtask_htyController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/WIDESEA_WMS/Partial/dt_stationinfoController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/WIDESEA_WMS/base_routing_tableController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/WIDESEA_WMS/dt_agvtaskController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/WIDESEA_WMS/dt_agvtask_htyController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Controllers/WIDESEA_WMS/dt_stationinfoController.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Dockerfile
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Download/20231208/Template/AGV任务20231208134657.xlsx
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Download/20231208/Template/AGV任务20231208170607.xlsx
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Download/20231208/Template/AGV任务20231208171603.xlsx
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Download/20231208/Template/AGV任务20231208173403.xlsx
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Download/20231208/Template/AGV任务20231208175204.xlsx
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Download/ExcelExport/20231208/AGV任务20231208150437.xlsx
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Download/ExcelExport/20231208/AGV任务20231208152432.xlsx
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Download/ExcelExport/20231208/AGV任务20231208172503.xlsx
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Download/ExcelExport/20231208/AGV任务20231208173004.xlsx
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Download/ExcelExport/20231208/AGV历史任务20231208154331.xlsx
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Download/ExcelExport/20231208/AGV历史任务20231208161840.xlsx
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Download/ExcelExport/20231208/AGV历史任务20231208162251.xlsx
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Download/ExcelExport/20231208/AGV历史任务20231208163634.xlsx
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Download/ExcelExport/20231208/AGV历史任务20231208163750.xlsx
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Download/ExcelExport/20231208/AGV历史任务20231208165240.xlsx
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Program.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Properties/launchSettings.json
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Startup.cs
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/AppHtml/news.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/AppHtml/productDesc.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/Controller/Controller.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/Controller/ControllerApi.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/Controller/ControllerApiPartial.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/Controller/ControllerPartial.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/DomianModel/ApiInputDomainModel.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/DomianModel/ApiOutputDomainModel.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/DomianModel/DomainModel.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/DomianModel/MappingConfiguration.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/IRepositorys/BaseIRepositorie.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/IServices/IServiceBase.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/IServices/IServiceBasePartial.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/Page/SearchPage.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/Page/Vue3SearchPage.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/Page/VueExtension.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/Page/VueSearchPage.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/Page/app/extension.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/Page/app/options.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/Page/app/page.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/Page/gridParameters.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/Page/router.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/Repositorys/BaseRepository.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/Repositorys/BaseRepositoryPartial.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/Services/ServiceBase.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Template/Services/ServiceBasePartial.html
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Upload/20231208/dt_agvtask/0a1819d1-6d55-44ba-b7c0-0a3e677cf62d_21KH231 苏州冠鸿 荆门亿纬H5项目软件系统任务-2022.11.10.xlsx
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Upload/20231208/dt_agvtask/147d9561-ba54-43dc-928a-2e5de0a05679_2014Z211-XM0603-1-BOM表-签字版.xls
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Upload/20231208/dt_agvtask/7449d43d-6d90-4e81-b6ef-81237b91e2e4_TSW449_3_103_PAR.SPF
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Upload/20231208/dt_agvtask/bae36617-a982-4c7b-a4db-2cfd08143f08_TSW449_3_C2_S2.SPF
代码管理/WMS/WMS_Server/WIDESEA_WebApi/Upload/20231208/dt_agvtask/ce28a3b3-1880-4c25-9bc6-46081bb66514_TSW449_3_103_PAR.SPF
代码管理/WMS/WMS_Server/WIDESEA_WebApi/WIDESEA_WebApi.csproj
代码管理/WMS/WMS_Server/WIDESEA_WebApi/appsettings.Development.json
代码管理/WMS/WMS_Server/WIDESEA_WebApi/appsettings.json
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/Upload/Tables/App_News/202204200018378581/img02.png
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/Upload/Tables/App_Transaction/202204172225478035/img03.png
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/Upload/Tables/App_Transaction/202204172225587342/img01.png
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/Upload/Tables/App_Transaction/202204172226012098/img04.png
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/Upload/Tables/Sys_User/202204130014502760/2.png
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/Upload/Tables/Sys_User/202307110945105304/Default.jpg.jpeg
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/css/site.css
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/favicon.ico
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/js/site.js
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/LICENSE
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/css/bootstrap-grid.css
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/css/bootstrap-grid.css.map
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/css/bootstrap-grid.min.css
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/css/bootstrap-grid.min.css.map
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/css/bootstrap-reboot.css
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/css/bootstrap-reboot.css.map
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/css/bootstrap-reboot.min.css
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/css/bootstrap-reboot.min.css.map
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/css/bootstrap.css
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/css/bootstrap.css.map
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/css/bootstrap.min.css
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/css/bootstrap.min.css.map
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/js/bootstrap.bundle.js
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/js/bootstrap.bundle.js.map
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/js/bootstrap.bundle.min.js
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/js/bootstrap.bundle.min.js.map
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/js/bootstrap.js
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/js/bootstrap.js.map
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/js/bootstrap.min.js
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/bootstrap/dist/js/bootstrap.min.js.map
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/jquery-validation-unobtrusive/LICENSE.txt
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.js
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/jquery-validation-unobtrusive/jquery.validate.unobtrusive.min.js
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/jquery-validation/LICENSE.md
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/jquery-validation/dist/additional-methods.js
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/jquery-validation/dist/additional-methods.min.js
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/jquery-validation/dist/jquery.validate.js
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/jquery-validation/dist/jquery.validate.min.js
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/jquery/LICENSE.txt
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/jquery/dist/jquery.js
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/jquery/dist/jquery.min.js
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/lib/jquery/dist/jquery.min.map
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/test.txt
代码管理/WMS/WMS_Server/WIDESEA_WebApi/wwwroot/新建文本文档.txt |
