birt cmps版本升级

08335 / hivui-platform-template

hivui平台项目模板

Browse code birt cmps版本升级 master
1 parent c410e1b commit c0bd2adc5289eb8698e9a877419bdd98c1ae8bb3 hhb authored on 23 Mar 2022

Showing 4 changed files

Ignore Space Show notes View package.json
{ "name": "hi-vui-template", "version": "1.1.11", "description": "A hi-vui-template project", "author": "zhcTeam", "scripts": { "rm:vite": "rimraf node_modules/.vite && rimraf node_modules/.cache", "pm2:start": "pm2 start processes.json", "dev": "vite --host", "def": "vite --host", "build": "node build/copyBaseAssets.js && cross-env NODE_ENV=production node build/webpack.prod.conf.js", "build:modules": "cross-env NODE_ENV=production node build/webpack.prod.conf.js", "build1": "webpack --mode production --config build/webpack.prod.conf.js", "dll": "webpack --config build/webpack.dll.conf.js", "start": "webpack-dev-server --config build/webpack.dev.conf.js", "copyassets": "node build/copyBaseAssets.js" }, "devDependencies": { "@babel/core": "^7.1.2", "@babel/plugin-proposal-nullish-coalescing-operator": "^7.16.7", "@babel/plugin-proposal-optional-chaining": "^7.16.7", "@babel/plugin-syntax-dynamic-import": "^7.0.0", "@babel/preset-env": "^7.1.0", "@vitejs/plugin-vue-jsx": "^1.3.3", "@vue/babel-helper-vue-jsx-merge-props": "^1.2.1", "@vue/babel-preset-jsx": "^1.2.4", "add-asset-html-webpack-plugin": "^3.2.0", "autoprefixer": "^9.1.5", "babel-loader": "^8.0.4", "babel-plugin-component": "^1.1.1", "babel-plugin-transform-vite-meta-env": "^1.0.3", "chalk": "^3.0.0", "clean-webpack-plugin": "^0.1.19", "copy-webpack-plugin": "^4.5.3", "cross-env": "^7.0.3", "css-loader": "^1.0.0", "dotenv": "^10.0.0", "file-loader": "^2.0.0", "happypack": "^5.0.1", "html-webpack-plugin": "^4.5.2", "less": "^4.1.2", "less-loader": "^5.0.0", "mini-css-extract-plugin": "^1.6.2", "node-sass": "^4.9.3", "optimize-css-assets-webpack-plugin": "^5.0.1", "parallel-webpack": "^2.6.0", "postcss-import": "^11.1.0", "postcss-loader": "^2.1.6", "postcss-url": "^7.3.2", "progress-bar-webpack-plugin": "^2.1.0", "sass": "^1.49.0", "sass-loader": "^7.1.0", "style-loader": "^0.23.0", "thread-loader": "^3.0.4", "uglifyjs-webpack-plugin": "^2.0.1", "url-loader": "^1.1.1", "vite": "2.3.7", "vite-plugin-html": "^2.1.1", "vite-plugin-imp": "^2.0.11", "vite-plugin-pagedata": "^1.0.4", "vite-plugin-vue2": "^1.9.0", "vue-loader": "^15.4.2", "vue-template-compiler": "^2.6.14", "webpack": "^4.46.0", "webpack-cli": "^4.9.2", "webpack-dev-server": "^3.11.3", "webpack-merge": "^4.1.4" }, "dependencies": { "axios": "^0.24.0", "babel-polyfill": "^6.26.0", "canvas": "^2.9.0", "classnames": "^2.3.1", "deep-lu-trans": "^1.0.5", "element-ui": "^2.15.7", "enquire.js": "^2.1.6", "font-awesome": "^4.7.0", "hi-taskcenter": "^1.0.9", "hi-ui": "^1.1.1006", "jquery": "^3.6.0", "js-cookie": "^3.0.1", "js-md5": "^0.7.3", "js-pinyin": "^0.1.9", "lodash": "^4.17.11", "qrcodejs2": "0.0.2", "screenfull": "^6.0.0", "sortablejs": "^1.14.0", "v-clipboard": "^2.2.3", "vue": "^2.6.14", "vue-draggable-resizable": "^2.3.0", "vue-gemini-scrollbar": "^2.0.1", "vue-i18n": "^8.27.0", "vue-jstree": "^2.1.6", "vue-qr": "^3.2.4", "vue-router": "^3.0.1", "vuex": "^3.6.2", "zhc-birt-cmps": "^2.5.5", "zhc-birt-core": "^1.9.0", "zhc-flowchart": "^1.0.20" } } { "name": "hi-vui-template", "version": "1.1.11", "description": "A hi-vui-template project", "author": "zhcTeam", "scripts": { "rm:vite": "rimraf node_modules/.vite && rimraf node_modules/.cache", "pm2:start": "pm2 start processes.json", "dev": "vite --host", "def": "vite --host", "build": "node build/copyBaseAssets.js && cross-env NODE_ENV=production node build/webpack.prod.conf.js", "build:modules": "cross-env NODE_ENV=production node build/webpack.prod.conf.js", "build1": "webpack --mode production --config build/webpack.prod.conf.js", "dll": "webpack --config build/webpack.dll.conf.js", "start": "webpack-dev-server --config build/webpack.dev.conf.js", "copyassets": "node build/copyBaseAssets.js" }, "devDependencies": { "@babel/core": "^7.1.2", "@babel/plugin-proposal-nullish-coalescing-operator": "^7.16.7", "@babel/plugin-proposal-optional-chaining": "^7.16.7", "@babel/plugin-syntax-dynamic-import": "^7.0.0", "@babel/preset-env": "^7.1.0", "@vitejs/plugin-vue-jsx": "^1.3.3", "@vue/babel-helper-vue-jsx-merge-props": "^1.2.1", "@vue/babel-preset-jsx": "^1.2.4", "add-asset-html-webpack-plugin": "^3.2.0", "autoprefixer": "^9.1.5", "babel-loader": "^8.0.4", "babel-plugin-component": "^1.1.1", "babel-plugin-transform-vite-meta-env": "^1.0.3", "chalk": "^3.0.0", "clean-webpack-plugin": "^0.1.19", "copy-webpack-plugin": "^4.5.3", "cross-env": "^7.0.3", "css-loader": "^1.0.0", "dotenv": "^10.0.0", "file-loader": "^2.0.0", "happypack": "^5.0.1", "html-webpack-plugin": "^4.5.2", "less": "^4.1.2", "less-loader": "^5.0.0", "mini-css-extract-plugin": "^1.6.2", "node-sass": "^4.9.3", "optimize-css-assets-webpack-plugin": "^5.0.1", "parallel-webpack": "^2.6.0", "postcss-import": "^11.1.0", "postcss-loader": "^2.1.6", "postcss-url": "^7.3.2", "progress-bar-webpack-plugin": "^2.1.0", "sass": "^1.49.0", "sass-loader": "^7.1.0", "style-loader": "^0.23.0", "thread-loader": "^3.0.4", "uglifyjs-webpack-plugin": "^2.0.1", "url-loader": "^1.1.1", "vite": "2.3.7", "vite-plugin-html": "^2.1.1", "vite-plugin-imp": "^2.0.11", "vite-plugin-pagedata": "^1.0.4", "vite-plugin-vue2": "^1.9.0", "vue-loader": "^15.4.2", "vue-template-compiler": "^2.6.14", "webpack": "^4.46.0", "webpack-cli": "^4.9.2", "webpack-dev-server": "^3.11.3", "webpack-merge": "^4.1.4" }, "dependencies": { "axios": "^0.24.0", "babel-polyfill": "^6.26.0", "canvas": "^2.9.0", "classnames": "^2.3.1", "deep-lu-trans": "^1.0.5", "element-ui": "^2.15.7", "enquire.js": "^2.1.6", "font-awesome": "^4.7.0", "hi-taskcenter": "^1.0.9", "hi-ui": "^1.1.1006", "jquery": "^3.6.0", "js-cookie": "^3.0.1", "js-md5": "^0.7.3", "js-pinyin": "^0.1.9", "lodash": "^4.17.11", "qrcodejs2": "0.0.2", "screenfull": "^6.0.0", "sortablejs": "^1.14.0", "v-clipboard": "^2.2.3", "vue": "^2.6.14", "vue-draggable-resizable": "^2.3.0", "vue-gemini-scrollbar": "^2.0.1", "vue-i18n": "^8.27.0", "vue-jstree": "^2.1.6", "vue-qr": "^3.2.4", "vue-router": "^3.0.1", "vuex": "^3.6.2", "zhc-birt-cmps": "^2.5.4", "zhc-birt-core": "^1.9.0", "zhc-flowchart": "^1.0.20" } }

Ignore Space Show notes View

package.json

{
  "name": "hi-vui-template",
  "version": "1.1.11",
  "description": "A hi-vui-template project",
  "author": "zhcTeam",
  "scripts": {
    "rm:vite": "rimraf node_modules/.vite && rimraf node_modules/.cache",
    "pm2:start": "pm2 start processes.json",
    "dev": "vite --host",
    "def": "vite --host",
    "build": "node build/copyBaseAssets.js && cross-env NODE_ENV=production node build/webpack.prod.conf.js",
    "build:modules": "cross-env NODE_ENV=production node build/webpack.prod.conf.js",
    "build1": "webpack --mode production --config build/webpack.prod.conf.js",
    "dll": "webpack --config build/webpack.dll.conf.js",
    "start": "webpack-dev-server --config build/webpack.dev.conf.js",
    "copyassets": "node build/copyBaseAssets.js"
  },
  "devDependencies": {
    "@babel/core": "^7.1.2",
    "@babel/plugin-proposal-nullish-coalescing-operator": "^7.16.7",
    "@babel/plugin-proposal-optional-chaining": "^7.16.7",
    "@babel/plugin-syntax-dynamic-import": "^7.0.0",
    "@babel/preset-env": "^7.1.0",
    "@vitejs/plugin-vue-jsx": "^1.3.3",
    "@vue/babel-helper-vue-jsx-merge-props": "^1.2.1",
    "@vue/babel-preset-jsx": "^1.2.4",
    "add-asset-html-webpack-plugin": "^3.2.0",
    "autoprefixer": "^9.1.5",
    "babel-loader": "^8.0.4",
    "babel-plugin-component": "^1.1.1",
    "babel-plugin-transform-vite-meta-env": "^1.0.3",
    "chalk": "^3.0.0",
    "clean-webpack-plugin": "^0.1.19",
    "copy-webpack-plugin": "^4.5.3",
    "cross-env": "^7.0.3",
    "css-loader": "^1.0.0",
    "dotenv": "^10.0.0",
    "file-loader": "^2.0.0",
    "happypack": "^5.0.1",
    "html-webpack-plugin": "^4.5.2",
    "less": "^4.1.2",
    "less-loader": "^5.0.0",
    "mini-css-extract-plugin": "^1.6.2",
    "node-sass": "^4.9.3",
    "optimize-css-assets-webpack-plugin": "^5.0.1",
    "parallel-webpack": "^2.6.0",
    "postcss-import": "^11.1.0",
    "postcss-loader": "^2.1.6",
    "postcss-url": "^7.3.2",
    "progress-bar-webpack-plugin": "^2.1.0",
    "sass": "^1.49.0",
    "sass-loader": "^7.1.0",
    "style-loader": "^0.23.0",
    "thread-loader": "^3.0.4",
    "uglifyjs-webpack-plugin": "^2.0.1",
    "url-loader": "^1.1.1",
    "vite": "2.3.7",
    "vite-plugin-html": "^2.1.1",
    "vite-plugin-imp": "^2.0.11",
    "vite-plugin-pagedata": "^1.0.4",
    "vite-plugin-vue2": "^1.9.0",
    "vue-loader": "^15.4.2",
    "vue-template-compiler": "^2.6.14",
    "webpack": "^4.46.0",
    "webpack-cli": "^4.9.2",
    "webpack-dev-server": "^3.11.3",
    "webpack-merge": "^4.1.4"
  },
  "dependencies": {
    "axios": "^0.24.0",
    "babel-polyfill": "^6.26.0",
    "canvas": "^2.9.0",
    "classnames": "^2.3.1",
    "deep-lu-trans": "^1.0.5",
    "element-ui": "^2.15.7",
    "enquire.js": "^2.1.6",
    "font-awesome": "^4.7.0",
    "hi-taskcenter": "^1.0.9",
    "hi-ui": "^1.1.1006",
    "jquery": "^3.6.0",
    "js-cookie": "^3.0.1",
    "js-md5": "^0.7.3",
    "js-pinyin": "^0.1.9",
    "lodash": "^4.17.11",
    "qrcodejs2": "0.0.2",
    "screenfull": "^6.0.0",
    "sortablejs": "^1.14.0",
    "v-clipboard": "^2.2.3",
    "vue": "^2.6.14",
    "vue-draggable-resizable": "^2.3.0",
    "vue-gemini-scrollbar": "^2.0.1",
    "vue-i18n": "^8.27.0",
    "vue-jstree": "^2.1.6",
    "vue-qr": "^3.2.4",
    "vue-router": "^3.0.1",
    "vuex": "^3.6.2",
    "zhc-birt-cmps": "^2.5.5",
    "zhc-birt-core": "^1.9.0",
    "zhc-flowchart": "^1.0.20"
  }
}

{
  "name": "hi-vui-template",
  "version": "1.1.11",
  "description": "A hi-vui-template project",
  "author": "zhcTeam",
  "scripts": {
    "rm:vite": "rimraf node_modules/.vite && rimraf node_modules/.cache",
    "pm2:start": "pm2 start processes.json",
    "dev": "vite --host",
    "def": "vite --host",
    "build": "node build/copyBaseAssets.js && cross-env NODE_ENV=production node build/webpack.prod.conf.js",
    "build:modules": "cross-env NODE_ENV=production node build/webpack.prod.conf.js",
    "build1": "webpack --mode production --config build/webpack.prod.conf.js",
    "dll": "webpack --config build/webpack.dll.conf.js",
    "start": "webpack-dev-server --config build/webpack.dev.conf.js",
    "copyassets": "node build/copyBaseAssets.js"
  },
  "devDependencies": {
    "@babel/core": "^7.1.2",
    "@babel/plugin-proposal-nullish-coalescing-operator": "^7.16.7",
    "@babel/plugin-proposal-optional-chaining": "^7.16.7",
    "@babel/plugin-syntax-dynamic-import": "^7.0.0",
    "@babel/preset-env": "^7.1.0",
    "@vitejs/plugin-vue-jsx": "^1.3.3",
    "@vue/babel-helper-vue-jsx-merge-props": "^1.2.1",
    "@vue/babel-preset-jsx": "^1.2.4",
    "add-asset-html-webpack-plugin": "^3.2.0",
    "autoprefixer": "^9.1.5",
    "babel-loader": "^8.0.4",
    "babel-plugin-component": "^1.1.1",
    "babel-plugin-transform-vite-meta-env": "^1.0.3",
    "chalk": "^3.0.0",
    "clean-webpack-plugin": "^0.1.19",
    "copy-webpack-plugin": "^4.5.3",
    "cross-env": "^7.0.3",
    "css-loader": "^1.0.0",
    "dotenv": "^10.0.0",
    "file-loader": "^2.0.0",
    "happypack": "^5.0.1",
    "html-webpack-plugin": "^4.5.2",
    "less": "^4.1.2",
    "less-loader": "^5.0.0",
    "mini-css-extract-plugin": "^1.6.2",
    "node-sass": "^4.9.3",
    "optimize-css-assets-webpack-plugin": "^5.0.1",
    "parallel-webpack": "^2.6.0",
    "postcss-import": "^11.1.0",
    "postcss-loader": "^2.1.6",
    "postcss-url": "^7.3.2",
    "progress-bar-webpack-plugin": "^2.1.0",
    "sass": "^1.49.0",
    "sass-loader": "^7.1.0",
    "style-loader": "^0.23.0",
    "thread-loader": "^3.0.4",
    "uglifyjs-webpack-plugin": "^2.0.1",
    "url-loader": "^1.1.1",
    "vite": "2.3.7",
    "vite-plugin-html": "^2.1.1",
    "vite-plugin-imp": "^2.0.11",
    "vite-plugin-pagedata": "^1.0.4",
    "vite-plugin-vue2": "^1.9.0",
    "vue-loader": "^15.4.2",
    "vue-template-compiler": "^2.6.14",
    "webpack": "^4.46.0",
    "webpack-cli": "^4.9.2",
    "webpack-dev-server": "^3.11.3",
    "webpack-merge": "^4.1.4"
  },
  "dependencies": {
    "axios": "^0.24.0",
    "babel-polyfill": "^6.26.0",
    "canvas": "^2.9.0",
    "classnames": "^2.3.1",
    "deep-lu-trans": "^1.0.5",
    "element-ui": "^2.15.7",
    "enquire.js": "^2.1.6",
    "font-awesome": "^4.7.0",
    "hi-taskcenter": "^1.0.9",
    "hi-ui": "^1.1.1006",
    "jquery": "^3.6.0",
    "js-cookie": "^3.0.1",
    "js-md5": "^0.7.3",
    "js-pinyin": "^0.1.9",
    "lodash": "^4.17.11",
    "qrcodejs2": "0.0.2",
    "screenfull": "^6.0.0",
    "sortablejs": "^1.14.0",
    "v-clipboard": "^2.2.3",
    "vue": "^2.6.14",
    "vue-draggable-resizable": "^2.3.0",
    "vue-gemini-scrollbar": "^2.0.1",
    "vue-i18n": "^8.27.0",
    "vue-jstree": "^2.1.6",
    "vue-qr": "^3.2.4",
    "vue-router": "^3.0.1",
    "vuex": "^3.6.2",
    "zhc-birt-cmps": "^2.5.4",
    "zhc-birt-core": "^1.9.0",
    "zhc-flowchart": "^1.0.20"
  }
}

Ignore Space Show notes View project/hivuiBirt/components/vue-m-message/message.css
.m-message-container { position: fixed; z-index: 3010; pointer-events: none; display: flex; flex-direction: column; box-sizing: border-box; padding: 15px; } .m-message-container.is-top-left, .m-message-container.is-top-center, .m-message-container.is-top-right { width: 100%; top: 0; left: 0; } .m-message-container.is-top-left { align-items: flex-start; } .m-message-container.is-top-center { align-items: center; } .m-message-container.is-top-right { align-items: flex-end; } .m-message-container.is-center { width: 100%; height: 100%; left: 0; top: 0; align-items: center; justify-content: center; } .m-message-container.is-bottom-left, .m-message-container.is-bottom-center, .m-message-container.is-bottom-right { bottom: 0; left: 0; width: 100%; justify-content: flex-end; } .m-message-container.is-bottom-left { align-items: flex-start; } .m-message-container.is-bottom-center { align-items: center; } .m-message-container.is-bottom-right { align-items: flex-end; } .m-message-container.has-mask { background-color: rgba(255, 255, 255, 0.5); width: 100%; height: 100%; pointer-events: all; } .m-message-wrapper { display: inline-block; max-width: 500px; } .m-message-wrapper + .m-message-wrapper { margin-top: 15px; } .m-message-wrapper::before, .m-message-wrapper::after { content: ""; clear: both; display: table; } .m-message { display: flex; align-items: center; padding: 10px 16px; font-size: 14px; overflow: hidden; border-radius: 4px; box-sizing: border-box; box-shadow: 0 1px 8px rgba(0, 0, 0, 0.15); color: rgba(0, 0, 0, 0.65); background: rgba(255, 255, 255, 0.95); pointer-events: all; position: relative; } .m-message-icons { float: left; box-sizing: border-box; margin-right: 10px; } .m-message--title { font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .m-message-content { box-sizing: border-box; overflow: auto; width: 100%; } .m-message--description { line-height: 1.6; color: #777; } .m-message--title + .m-message--description { margin-top: 5px; } .m-message--icon { width: 25px; height: 25px; vertical-align: middle; display: inline-block; border-radius: 50%; } .m-message--control { position: relative; height: 100%; align-self: flex-start; white-space: nowrap; margin-right: -5px; margin-left: 10px; } .m-message--button { border: none; outline: none; background: none; cursor: pointer; font-size: 15px; color: #646464; font-weight: 600; padding: 0; width: 20px; height: 20px; line-height: 20px; text-align: center; vertical-align: middle; } .m-message--button:hover { color: #F56C6C; } .m-message--arrow-down.is-collapsed { transform: rotate(90deg); } .m-message-fade-enter-active { animation: m-message-fade-in-down 0.3s; } .m-message-fade-leave-active { animation: m-message-fade-out 0.3s; } @keyframes m-message-fade-in-down { 0% { opacity: 0; transform: translateY(-20px); } 100% { opacity: 1; transform: translateY(0px); } } @keyframes m-message-fade-out { 0% { opacity: 1; margin-top: 0; } 100% { opacity: 0; margin-top: -45px; } } .m-message-container { position: fixed; z-index: 1010; pointer-events: none; display: flex; flex-direction: column; box-sizing: border-box; padding: 15px; } .m-message-container.is-top-left, .m-message-container.is-top-center, .m-message-container.is-top-right { width: 100%; top: 0; left: 0; } .m-message-container.is-top-left { align-items: flex-start; } .m-message-container.is-top-center { align-items: center; } .m-message-container.is-top-right { align-items: flex-end; } .m-message-container.is-center { width: 100%; height: 100%; left: 0; top: 0; align-items: center; justify-content: center; } .m-message-container.is-bottom-left, .m-message-container.is-bottom-center, .m-message-container.is-bottom-right { bottom: 0; left: 0; width: 100%; justify-content: flex-end; } .m-message-container.is-bottom-left { align-items: flex-start; } .m-message-container.is-bottom-center { align-items: center; } .m-message-container.is-bottom-right { align-items: flex-end; } .m-message-container.has-mask { background-color: rgba(255, 255, 255, 0.5); width: 100%; height: 100%; pointer-events: all; } .m-message-wrapper { display: inline-block; max-width: 500px; } .m-message-wrapper + .m-message-wrapper { margin-top: 15px; } .m-message-wrapper::before, .m-message-wrapper::after { content: ""; clear: both; display: table; } .m-message { display: flex; align-items: center; padding: 10px 16px; font-size: 14px; overflow: hidden; border-radius: 4px; box-sizing: border-box; box-shadow: 0 1px 8px rgba(0, 0, 0, 0.15); color: rgba(0, 0, 0, 0.65); background: rgba(255, 255, 255, 0.95); pointer-events: all; position: relative; } .m-message-icons { float: left; box-sizing: border-box; margin-right: 10px; } .m-message--title { font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .m-message-content { box-sizing: border-box; overflow: auto; width: 100%; } .m-message--description { line-height: 1.6; color: #777; } .m-message--title + .m-message--description { margin-top: 5px; } .m-message--icon { width: 25px; height: 25px; vertical-align: middle; display: inline-block; border-radius: 50%; } .m-message--control { position: relative; height: 100%; align-self: flex-start; white-space: nowrap; margin-right: -5px; margin-left: 10px; } .m-message--button { border: none; outline: none; background: none; cursor: pointer; font-size: 15px; color: #646464; font-weight: 600; padding: 0; width: 20px; height: 20px; line-height: 20px; text-align: center; vertical-align: middle; } .m-message--button:hover { color: #F56C6C; } .m-message--arrow-down.is-collapsed { transform: rotate(90deg); } .m-message-fade-enter-active { animation: m-message-fade-in-down 0.3s; } .m-message-fade-leave-active { animation: m-message-fade-out 0.3s; } @keyframes m-message-fade-in-down { 0% { opacity: 0; transform: translateY(-20px); } 100% { opacity: 1; transform: translateY(0px); } } @keyframes m-message-fade-out { 0% { opacity: 1; margin-top: 0; } 100% { opacity: 0; margin-top: -45px; } }

Ignore Space Show notes View

project/hivuiBirt/components/vue-m-message/message.css

.m-message-container {
  position: fixed;
  z-index: 3010;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  padding: 15px;
}
.m-message-container.is-top-left,
.m-message-container.is-top-center,
.m-message-container.is-top-right {
  width: 100%;
  top: 0;
  left: 0;
}
.m-message-container.is-top-left {
  align-items: flex-start;
}
.m-message-container.is-top-center {
  align-items: center;
}
.m-message-container.is-top-right {
  align-items: flex-end;
}
.m-message-container.is-center {
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  align-items: center;
  justify-content: center;
}
.m-message-container.is-bottom-left,
.m-message-container.is-bottom-center,
.m-message-container.is-bottom-right {
  bottom: 0;
  left: 0;
  width: 100%;
  justify-content: flex-end;
}
.m-message-container.is-bottom-left {
  align-items: flex-start;
}
.m-message-container.is-bottom-center {
  align-items: center;
}
.m-message-container.is-bottom-right {
  align-items: flex-end;
}
.m-message-container.has-mask {
  background-color: rgba(255, 255, 255, 0.5);
  width: 100%;
  height: 100%;
  pointer-events: all;
}
.m-message-wrapper {
  display: inline-block;
  max-width: 500px;
}
.m-message-wrapper + .m-message-wrapper {
  margin-top: 15px;
}
.m-message-wrapper::before,
.m-message-wrapper::after {
  content: "";
  clear: both;
  display: table;
}
.m-message {
  display: flex;
  align-items: center;
  padding: 10px 16px;
  font-size: 14px;
  overflow: hidden;
  border-radius: 4px;
  box-sizing: border-box;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.15);
  color: rgba(0, 0, 0, 0.65);
  background: rgba(255, 255, 255, 0.95);
  pointer-events: all;
  position: relative;
}
.m-message-icons {
  float: left;
  box-sizing: border-box;
  margin-right: 10px;
}
.m-message--title {
  font-size: 14px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.m-message-content {
  box-sizing: border-box;
  overflow: auto;
  width: 100%;
}
.m-message--description {
  line-height: 1.6;
  color: #777;
}
.m-message--title + .m-message--description {
  margin-top: 5px;
}
.m-message--icon {
  width: 25px;
  height: 25px;
  vertical-align: middle;
  display: inline-block;
  border-radius: 50%;
}
.m-message--control {
  position: relative;
  height: 100%;
  align-self: flex-start;
  white-space: nowrap;
  margin-right: -5px;
  margin-left: 10px;
}
.m-message--button {
  border: none;
  outline: none;
  background: none;
  cursor: pointer;
  font-size: 15px;
  color: #646464;
  font-weight: 600;
  padding: 0;
  width: 20px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  vertical-align: middle;
}
.m-message--button:hover {
  color: #F56C6C;
}
.m-message--arrow-down.is-collapsed {
  transform: rotate(90deg);
}
.m-message-fade-enter-active {
  animation: m-message-fade-in-down 0.3s;
}
.m-message-fade-leave-active {
  animation: m-message-fade-out 0.3s;
}
@keyframes m-message-fade-in-down {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}
@keyframes m-message-fade-out {
  0% {
    opacity: 1;
    margin-top: 0;
  }
  100% {
    opacity: 0;
    margin-top: -45px;
  }
}

.m-message-container {
  position: fixed;
  z-index: 1010;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  padding: 15px;
}
.m-message-container.is-top-left,
.m-message-container.is-top-center,
.m-message-container.is-top-right {
  width: 100%;
  top: 0;
  left: 0;
}
.m-message-container.is-top-left {
  align-items: flex-start;
}
.m-message-container.is-top-center {
  align-items: center;
}
.m-message-container.is-top-right {
  align-items: flex-end;
}
.m-message-container.is-center {
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  align-items: center;
  justify-content: center;
}
.m-message-container.is-bottom-left,
.m-message-container.is-bottom-center,
.m-message-container.is-bottom-right {
  bottom: 0;
  left: 0;
  width: 100%;
  justify-content: flex-end;
}
.m-message-container.is-bottom-left {
  align-items: flex-start;
}
.m-message-container.is-bottom-center {
  align-items: center;
}
.m-message-container.is-bottom-right {
  align-items: flex-end;
}
.m-message-container.has-mask {
  background-color: rgba(255, 255, 255, 0.5);
  width: 100%;
  height: 100%;
  pointer-events: all;
}
.m-message-wrapper {
  display: inline-block;
  max-width: 500px;
}
.m-message-wrapper + .m-message-wrapper {
  margin-top: 15px;
}
.m-message-wrapper::before,
.m-message-wrapper::after {
  content: "";
  clear: both;
  display: table;
}
.m-message {
  display: flex;
  align-items: center;
  padding: 10px 16px;
  font-size: 14px;
  overflow: hidden;
  border-radius: 4px;
  box-sizing: border-box;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.15);
  color: rgba(0, 0, 0, 0.65);
  background: rgba(255, 255, 255, 0.95);
  pointer-events: all;
  position: relative;
}
.m-message-icons {
  float: left;
  box-sizing: border-box;
  margin-right: 10px;
}
.m-message--title {
  font-size: 14px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.m-message-content {
  box-sizing: border-box;
  overflow: auto;
  width: 100%;
}
.m-message--description {
  line-height: 1.6;
  color: #777;
}
.m-message--title + .m-message--description {
  margin-top: 5px;
}
.m-message--icon {
  width: 25px;
  height: 25px;
  vertical-align: middle;
  display: inline-block;
  border-radius: 50%;
}
.m-message--control {
  position: relative;
  height: 100%;
  align-self: flex-start;
  white-space: nowrap;
  margin-right: -5px;
  margin-left: 10px;
}
.m-message--button {
  border: none;
  outline: none;
  background: none;
  cursor: pointer;
  font-size: 15px;
  color: #646464;
  font-weight: 600;
  padding: 0;
  width: 20px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  vertical-align: middle;
}
.m-message--button:hover {
  color: #F56C6C;
}
.m-message--arrow-down.is-collapsed {
  transform: rotate(90deg);
}
.m-message-fade-enter-active {
  animation: m-message-fade-in-down 0.3s;
}
.m-message-fade-leave-active {
  animation: m-message-fade-out 0.3s;
}
@keyframes m-message-fade-in-down {
  0% {
    opacity: 0;
    transform: translateY(-20px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}
@keyframes m-message-fade-out {
  0% {
    opacity: 1;
    margin-top: 0;
  }
  100% {
    opacity: 0;
    margin-top: -45px;
  }
}

Ignore Space Show notes View project/hivuiBirt/styles/index.css
.custom-tree-node { flex: 1; display: flex; align-items: center; justify-content: space-between; font-size: 14px; padding-right: 8px; width: 80%; flex: 1 140px; } .custom-tree-node > span:nth-child(1){ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .custom-tree-node .btn{ opacity: 0; transition: opacity 0.5s; -webkit-transition: opacity 0.5s; } .custom-tree-node:hover .btn{ opacity: 1; } .custom-tree-node .btn .el-icon-edit{ color: #67c23a; } .custom-tree-node .btn .el-icon-delete{ color: #f56c6c; } .cell .el-input-group__append{ padding: 0 5px !important; text-align: center; } .cell .el-input-group__append .el-button{ padding: 0; margin: 0; } /* .el-form-item__error{ line-height: 0; } / .el-row>.zhc-birt-cell-children>.el-button { border: none; / border-right: 1px solid #ddd; / border-radius: 0; padding: 5px 15px; } / 整个滚动条 / ::-webkit-scrollbar { width: 8px; height: 10px; } / 滚动条上的滚动滑块 / ::-webkit-scrollbar-thumb { / background-color: #49b1f5; / / 关键代码 / / background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.4) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.4) 75%, transparent 75%, transparent); / background-color: rgba(0,0,0,.3); border-radius: 32px; } / 滚动条轨道 / ::-webkit-scrollbar-track { background-color: #dbeffd; border-radius: 32px; } .custom-tree-node .el-icon-folder-opened,.el-icon-folder{ color: #ffc107; } .custom-tree-node .el-icon-document{ color: #009688; } .custom-tree-node .icon-root{ color: blue; } .custom-tree-node .icon-ptm{ color: royalblue; } .custom-tree-node .el-icon-user{ color: coral;; } .custom-tree-node .icon-org, .icon-func{ color: aqua; } .custom-tree-node .icon-dpt, .icon-flow{ color: deepskyblue; } .custom-tree-node .el-button.is-disabled i{ color: #C0C4CC !important; cursor: not-allowed; } .el-table__header-wrapper th.isrequired ::before{ content: ''; color: red; margin-right: 5px; } .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content { background-color: #f0f7ff; color: #2355f1; } /* 取消查找定义input红色边框 / .el-form-item.is-error .queryPanel .el-input__inner, .el-form-item.is-error .el-pagination__sizes .el-input__inner, .el-form-item.is-error .el-pagination__jump .el-input__inner{ border-color: #DCDFE6; } / 弹框样式 / .el-dialog__body .el-main{ padding: 0; } .el-dialog .queryPanel .zhc-birt-data-list thead { display: none; } / tabs / .el-tabs--left .el-tabs__item, .el-tabs--right .el-tabs__item{ width: 60px; line-height: 24px; height: auto; word-wrap: break-word; white-space: pre-line; padding-bottom: 20px; } .el-tabs--right .el-tabs__item{ width: 40px; } .el-tabs--left, .el-tabs--right{ height: auto !important; } .el-tabs--right .queryPanel + div .el-button { margin-right: 10px; } /取消mian的padding,防止大屏看板高度超出100%/ .chart .zhc-birt-cell-children .el-main{ padding: 0; } .el-tabs .el-main{ padding: 0 } .toolBar{ padding: 5px 5% !important; border-bottom: 1px solid #c2bcc0; } .extra .toolBar{ border: none; padding: 0!important; } .dataList_title{ margin-top:5px; } .dataList_title td{ margin-top:5px; position: relative; } .dataList_title td::before{ content: ' '; display: block; width: 5px; height: 30px; position: absolute; border-radius: 5px; background: #3f96ed; } .toolBar button .icon-XLSX{ font-size: 22px; } .avatar-uploader{ background: #f5f3f6; } .avatar-uploader .el-upload { background-color: #fff; } .zhc-birt-data-list .el-form-item__content > span, .zhc-birt-data-list .el-form-item__content > .lookup > span, .zhc-birt-data-list .el-form-item__content > .el-radio-group, .zhc-birt-data-list .el-form-item__content > .el-checkbox{ padding-left: 12px; } .el-table .el-table__cell{ padding: 7px 0; } .el-table .el-table__header-wrapper .el-table__cell, .el-table .el-table__fixed-header-wrapper .el-table__cell{ background: #f5f7fa !important; } .el-table.table_edit > .el-table__body-wrapper > .el-table__body > tbody > .el-table__row > .el-table__cell, .el-table.table_edit .el-table__fixed-right > .el-table__fixed-body-wrapper > .el-table__body > tbody >.el-table__row > .el-table__cell, .el-table.table_edit .el-table__fixed-right > .el-table__fixed-body-wrapper > .el-table__body > tbody >.el-table__row > .el-table__cell{ padding-top: 0; padding-bottom: 0; } .table_edit > .el-table__body-wrapper > .el-table__body > tbody >.el-table__row > .el-table__cell .cell, .table_edit > .el-table__fixed-body-wrapper > .el-table__body > tbody >.el-table__row > .el-table__cell .cell{ padding: 0 10px; } .el-table--small .el-form-item .el-form-item__content{ line-height: 32px; } .lookup .el-input.is-focus .el-input__inner.el-input__inner { border-color: #409EFF; } .custom-tree-node { flex: 1; display: flex; align-items: center; justify-content: space-between; font-size: 14px; padding-right: 8px; width: 80%; flex: 1 140px; } .custom-tree-node > span:nth-child(1){ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .custom-tree-node .btn{ opacity: 0; transition: opacity 0.5s; -webkit-transition: opacity 0.5s; } .custom-tree-node:hover .btn{ opacity: 1; } .custom-tree-node .btn .el-icon-edit{ color: #67c23a; } .custom-tree-node .btn .el-icon-delete{ color: #f56c6c; } .cell .el-input-group__append{ padding: 0 5px !important; text-align: center; } .cell .el-input-group__append .el-button{ padding: 0; margin: 0; } / .el-form-item__error{ line-height: 0; } / .el-row>.zhc-birt-cell-children>.el-button { border: none; / border-right: 1px solid #ddd; / border-radius: 0; padding: 5px 15px; } / 整个滚动条 / ::-webkit-scrollbar { width: 8px; height: 10px; } / 滚动条上的滚动滑块 / ::-webkit-scrollbar-thumb { / background-color: #49b1f5; / / 关键代码 / / background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.4) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.4) 75%, transparent 75%, transparent); / background-color: rgba(0,0,0,.3); border-radius: 32px; } / 滚动条轨道 / ::-webkit-scrollbar-track { background-color: #dbeffd; border-radius: 32px; } .custom-tree-node .el-icon-folder-opened,.el-icon-folder{ color: #ffc107; } .custom-tree-node .el-icon-document{ color: #009688; } .custom-tree-node .icon-root{ color: blue; } .custom-tree-node .icon-ptm{ color: royalblue; } .custom-tree-node .el-icon-user{ color: coral;; } .custom-tree-node .icon-org, .icon-func{ color: aqua; } .custom-tree-node .icon-dpt, .icon-flow{ color: deepskyblue; } .custom-tree-node .el-button.is-disabled i{ color: #C0C4CC !important; cursor: not-allowed; } .el-table__header-wrapper th.isrequired ::before{ content: ''; color: red; margin-right: 5px; } .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content { background-color: #f0f7ff; color: #2355f1; } /* 取消查找定义input红色边框 / .el-form-item.is-error .queryPanel .el-input__inner, .el-form-item.is-error .el-pagination__sizes .el-input__inner, .el-form-item.is-error .el-pagination__jump .el-input__inner{ border-color: #DCDFE6; } / 弹框样式 / .el-dialog__body .el-main{ padding: 0; } .el-dialog .queryPanel .zhc-birt-data-list thead { display: none; } / tabs / .el-tabs--left .el-tabs__item, .el-tabs--right .el-tabs__item{ width: 60px; line-height: 24px; height: auto; word-wrap: break-word; white-space: pre-line; padding-bottom: 20px; } .el-tabs--right .el-tabs__item{ width: 40px; } .el-tabs--left, .el-tabs--right{ height: auto !important; } .el-tabs--right .queryPanel + div .el-button { margin-right: 10px; } /取消mian的padding,防止大屏看板高度超出100%*/ .chart .zhc-birt-cell-children .el-main{ padding: 0; } .el-tabs .el-main{ padding: 0 } .toolBar{ padding: 5px 5% !important; border-bottom: 1px solid #c2bcc0; } .extra .toolBar{ border: none; padding: 0!important; } .dataList_title{ margin-top:5px; } .dataList_title td{ margin-top:5px; position: relative; } .dataList_title td::before{ content: ' '; display: block; width: 5px; height: 30px; position: absolute; border-radius: 5px; background: #3f96ed; } .toolBar button .icon-XLSX{ font-size: 22px; } .avatar-uploader{ background: #f5f3f6; } .avatar-uploader .el-upload { background-color: #fff; } .zhc-birt-data-list .el-form-item__content > span, .zhc-birt-data-list .el-form-item__content > .lookup > span, .zhc-birt-data-list .el-form-item__content > .el-radio-group, .zhc-birt-data-list .el-form-item__content > .el-checkbox{ padding-left: 12px; } .el-table .el-table__cell{ padding: 7px 0; } .el-table .el-table__header-wrapper .el-table__cell, .el-table .el-table__fixed-header-wrapper .el-table__cell{ background: #f5f7fa !important; } .el-table.table_edit > .el-table__body-wrapper > .el-table__body > tbody > .el-table__row > .el-table__cell, .el-table.table_edit .el-table__fixed-right > .el-table__fixed-body-wrapper > .el-table__body > tbody >.el-table__row > .el-table__cell, .el-table.table_edit .el-table__fixed-right > .el-table__fixed-body-wrapper > .el-table__body > tbody >.el-table__row > .el-table__cell{ padding-top: 0; padding-bottom: 0; } .table_edit > .el-table__body-wrapper > .el-table__body > tbody >.el-table__row > .el-table__cell .cell, .table_edit > .el-table__fixed-body-wrapper > .el-table__body > tbody >.el-table__row > .el-table__cell .cell{ padding: 0 10px; } .el-table--small .el-form-item .el-form-item__content{ line-height: 32px; }

Ignore Space Show notes View

project/hivuiBirt/styles/index.css

.custom-tree-node {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 14px;
  padding-right: 8px;
  width: 80%;
  flex: 1 140px;
}
.custom-tree-node > span:nth-child(1){
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.custom-tree-node .btn{
  opacity: 0;
  transition: opacity 0.5s;
  -webkit-transition: opacity 0.5s;
}
.custom-tree-node:hover .btn{
    opacity: 1;
}
.custom-tree-node .btn .el-icon-edit{
  color: #67c23a;
}
.custom-tree-node .btn .el-icon-delete{
  color: #f56c6c;
}
.cell .el-input-group__append{
  padding: 0 5px !important;
  text-align: center;
}
.cell .el-input-group__append .el-button{
  padding: 0;
  margin: 0;
}
/* .el-form-item__error{
  line-height: 0;
} */
.el-row>.zhc-birt-cell-children>.el-button {
  border: none;
  /* border-right: 1px solid #ddd; */
  border-radius: 0;
  padding: 5px 15px;
}
/* 整个滚动条 */
::-webkit-scrollbar {
  width: 8px;
  height: 10px;
}

/* 滚动条上的滚动滑块 */
::-webkit-scrollbar-thumb {
  /* background-color: #49b1f5; */
  /* 关键代码 */
  /* background-image: -webkit-linear-gradient(45deg,
          rgba(255, 255, 255, 0.4) 25%,
          transparent 25%,
          transparent 50%,
          rgba(255, 255, 255, 0.4) 50%,
          rgba(255, 255, 255, 0.4) 75%,
          transparent 75%,
          transparent); */
  background-color: rgba(0,0,0,.3);
  border-radius: 32px;
}

/* 滚动条轨道 */
::-webkit-scrollbar-track {
  background-color: #dbeffd;
  border-radius: 32px;
}

.custom-tree-node .el-icon-folder-opened,.el-icon-folder{
    color: #ffc107;
}
.custom-tree-node .el-icon-document{
    color: #009688;
}
.custom-tree-node .icon-root{
    color: blue;
}
.custom-tree-node .icon-ptm{
    color: royalblue;
}
.custom-tree-node .el-icon-user{
    color: coral;;
}
.custom-tree-node .icon-org, .icon-func{
    color: aqua;
}
.custom-tree-node .icon-dpt, .icon-flow{
    color: deepskyblue;
}
.custom-tree-node .el-button.is-disabled i{
  color: #C0C4CC !important;
  cursor: not-allowed;
}
.el-table__header-wrapper th.isrequired ::before{
  content: '*';
  color: red;
  margin-right: 5px;
}
.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
  background-color: #f0f7ff;
  color: #2355f1;
}
/*
取消查找定义input红色边框
*/
.el-form-item.is-error .queryPanel .el-input__inner,
.el-form-item.is-error .el-pagination__sizes .el-input__inner,
.el-form-item.is-error .el-pagination__jump .el-input__inner{
  border-color: #DCDFE6;
}

/*
弹框样式
*/
.el-dialog__body .el-main{
  padding: 0;
}
.el-dialog .queryPanel .zhc-birt-data-list thead {
  display: none;
}

/*
tabs
*/
.el-tabs--left .el-tabs__item, .el-tabs--right .el-tabs__item{
  width: 60px;
  line-height: 24px;
  height: auto;
  word-wrap: break-word;
  white-space: pre-line;
  padding-bottom: 20px;
}
.el-tabs--right .el-tabs__item{
  width: 40px;
}
.el-tabs--left, .el-tabs--right{
  height: auto !important;
}
.el-tabs--right .queryPanel + div .el-button {
  margin-right: 10px;
}

/*取消mian的padding,防止大屏看板高度超出100%*/
.chart .zhc-birt-cell-children .el-main{
  padding: 0;
}

.el-tabs .el-main{
  padding: 0
}
.toolBar{
  padding: 5px 5% !important;
  border-bottom: 1px solid #c2bcc0;
}
.extra .toolBar{
  border: none;
  padding: 0!important;
}

.dataList_title{
  margin-top:5px;
}
.dataList_title td{
  margin-top:5px;
  position: relative;
}
.dataList_title td::before{
  content: ' ';
  display: block;
  width: 5px;
  height: 30px;
  position: absolute;
  border-radius: 5px;
  background: #3f96ed;
}
.toolBar button .icon-XLSX{
  font-size: 22px;
}
.avatar-uploader{
  background: #f5f3f6;
}
.avatar-uploader .el-upload {
  background-color: #fff;
}
.zhc-birt-data-list .el-form-item__content > span,
.zhc-birt-data-list .el-form-item__content > .lookup > span,
.zhc-birt-data-list .el-form-item__content > .el-radio-group,
.zhc-birt-data-list .el-form-item__content > .el-checkbox{
  padding-left: 12px;
}
.el-table .el-table__cell{
  padding: 7px 0;
}
.el-table .el-table__header-wrapper .el-table__cell,
.el-table .el-table__fixed-header-wrapper  .el-table__cell{
  background: #f5f7fa !important;
}
.el-table.table_edit > .el-table__body-wrapper > .el-table__body > tbody > .el-table__row > .el-table__cell,
.el-table.table_edit .el-table__fixed-right > .el-table__fixed-body-wrapper > .el-table__body > tbody >.el-table__row > .el-table__cell,
.el-table.table_edit .el-table__fixed-right > .el-table__fixed-body-wrapper > .el-table__body > tbody >.el-table__row > .el-table__cell{
  padding-top: 0;
  padding-bottom: 0;
}
.table_edit > .el-table__body-wrapper > .el-table__body > tbody >.el-table__row > .el-table__cell .cell,
.table_edit > .el-table__fixed-body-wrapper > .el-table__body > tbody >.el-table__row > .el-table__cell .cell{
  padding: 0 10px;
}
.el-table--small .el-form-item .el-form-item__content{
  line-height: 32px;
}
.lookup .el-input.is-focus .el-input__inner.el-input__inner {
  border-color: #409EFF;
}

/* 滚动条轨道 */
::-webkit-scrollbar-track {
  background-color: #dbeffd;
  border-radius: 32px;
}

/*
弹框样式
*/
.el-dialog__body .el-main{
  padding: 0;
}
.el-dialog .queryPanel .zhc-birt-data-list thead {
  display: none;
}

/*取消mian的padding,防止大屏看板高度超出100%*/
.chart .zhc-birt-cell-children .el-main{
  padding: 0;
}

.el-tabs .el-main{
  padding: 0
}
.toolBar{
  padding: 5px 5% !important;
  border-bottom: 1px solid #c2bcc0;
}
.extra .toolBar{
  border: none;
  padding: 0!important;
}

Ignore Space Show notes View project/hivuiBirt/templates/pages/TabTableDetail.js
/** * 查询方案、查询面板、工具条、网格，标准查询页面 * @param {} queryDataset 保存数据集，命名规范 ds_[数组下标]_[对话框id] @param {} conf 组件定义配置项 @returns / import { StringUtil } from "@birt/funclib/StringUtil.js"; import { $CONST } from "@birt/funclib/ConstUtil"; import { QueryStyleFactory } from "../query-panel/QueryStyleFactory"; export function TabTableDetail(conf) { const dlgId = StringUtil.randomString(6); const hcTableId = "HcTable_" + dlgId; const hcTabsId = "HcTabs_" + dlgId; const hcTabListId = "list_" + dlgId; const hcTabDetailId = "detail_" + dlgId; const hcQueryPanelId = "HcQueryPanel_" + dlgId; const hcFormToolbarId = "HcFormToolbar_" + dlgId; // 设置数据集id，分页 const queryDataset = conf.mainDataset; queryDataset.controlId += "_" + dlgId; queryDataset._infcPagging = { _isPagging: true, returnCount: true } // 查询面板 let hcQueryPanel = false; if (conf.hcQueryPanel) { hcQueryPanel = { controlName: "HcQueryPanel", controlId: hcQueryPanelId, dataset: queryDataset.controlId, children: [] } // 应用查询面板个性化配置 Object.assign(hcQueryPanel, QueryStyleFactory.buildForm(conf.hcQueryPanel) \|\| {}); } // 操作工具条 let hcFormToolbar = false; if (conf.hcFormToolbar) { hcFormToolbar = { controlName: "HcFormToolbar", controlId: "HcFormToolbar_" + dlgId, dataset: queryDataset.controlId, style: 'margin-right: 10px;margin-bottom: 5px;', tableId: hcTableId, children: [] } // 应用表单个性化配置 Object.assign(hcFormToolbar, conf.hcFormToolbar \|\| {}); } // 网格明细 var hcTable = { controlName: "HcTable", controlId: hcTableId, dataset: queryDataset.controlId, border: true, showAddBtn: false, // showSummary: true, height: function (parentHeight) { return parentHeight - 120; }, events: { // 双击跳转至详情页 rowDblclick: function (row, column, event) { var hcFormToolbar = this.getRefCompt(hcFormToolbarId) if(hcFormToolbar) hcFormToolbar.hide() let curtTabs = this.getRefCompt(hcTabsId); let pushParam = Object.assign({}, row); let eleNumber = this.store && this.store._getEleNumber(); if (eleNumber) { pushParam[$CONST.FLOWNUMBER] = row[eleNumber.field]; } // 下推功能路径 // pushParam[$CONST.FUNCPATH] = this.getWorkBook().getModelPath(); curtTabs.setActiveTabName(hcTabDetailId, pushParam); }, }, children: [], }; // 应用网格个性化配置 Object.assign(hcTable, conf.hcTable \|\| {}); // 详情表单 var hcDetailForm = false; if (conf.hcDetailForm) { hcDetailForm = Object.assign( conf.hcDetailForm, { height: function (parentHeight) { return parentHeight - 170; }, }) } // 分页工具条 var hcPagination = { controlName: "HcPagination", controlId: "HcPagination_" + dlgId, pageSizes: [10, 20, 50, 100], layout: "total, prev, pager, next, sizes, jumper", dataset: queryDataset.controlId, }; var isEdit = queryDataset.controlName == 'HcEditDataset' if(!isEdit){ var extraBtn = { controlName: 'HcRow', controlId: 'ElRow_extra', style: 'position: absolute;z-index:99;right:-20px;top:120px;height: 40px;line-height: 40px;display:flex', title: '导出', children: [] .concat(hcFormToolbar ? hcFormToolbar : []) } }else{ Object.assign(hcFormToolbar, {style: 'margin: -7px -4% 3px;border: none;'}) } // 返回按钮 var returnBtn = { controlName: 'HcRow', controlId: 'HcRow_' + dlgId, style: 'position: absolute;top:5px;left:5%;z-index:2001;line-height: 30px;display:flex;', children:[ { controlName: 'HcButton', controlId: 'HcButton_' + dlgId, title: '返回', icon: 'el-icon-back', style:'padding: 5px 0;', type: 'text', size: 'large', // style: 'position: absolute;top:15px;left:5%;z-index:2001', events: { click: function () { let curtTabs = this.getRefCompt(hcTabsId); let qPanel = this.getRefCompt(hcQueryPanelId); curtTabs.setActiveTabName(hcTabListId); var hcFormToolbar = this.getRefCompt(hcFormToolbarId) if(hcFormToolbar) hcFormToolbar.show() if (qPanel) { qPanel.$refs[hcQueryPanelId].doQuery() } } } }, { controlName: "HcTextLabel", controlId: "TextLabel2_1", style:"margin-left: 10px;", className: 'text_title', style:'height:20px;line-height: 20px;margin-left: 10px;border-left: 1px solid #cdd3d8;padding: 0 20px;margin-top: 5px;', title: "详情", }, ] } var hcTabs = { controlName: "HcTabs", controlId: hcTabsId, tabPosition: "top", activeTabName: hcTabListId, tabPosition: 'right', events: { click: function () { var tabs = this.getRefCompt(hcTabsId).activeTabName var hcFormToolbar = this.getRefCompt(hcFormToolbarId) if(hcFormToolbar){ if (tabs.indexOf('detail') > -1) { hcFormToolbar.hide() } else { hcFormToolbar.show() } } } }, // type: "border-card", children: [{ controlName: "HcTabPane", controlId: "HcTabPane_list_" + dlgId, label: "列表", name: hcTabListId, children: [] .concat(hcQueryPanel ? hcQueryPanel : []) .concat(hcFormToolbar && isEdit ? hcFormToolbar : []) .concat(hcTable) .concat(hcPagination) }, { controlName: "HcTabPane", controlId: "HcTabPane_detail_" + dlgId, label: "详情", name: hcTabDetailId, children: [] .concat(returnBtn) .concat(hcDetailForm ? hcDetailForm : []) } ],slot: [].concat(!isEdit ? extraBtn : []) } // 应用报表模型 var birtWorkBook = Object.assign({ controlName: "BirtWorkBook", controlId: "BirtWorkBook_" + dlgId, showToolBar: false, totalPage: 1, renderType: "pages", height: function (parentHeight) { return parentHeight - 1; }, }, conf.birtWorkBook \|\| {}) // 添加布局结构 birtWorkBook.children = [{ controlName: "BirtSheet", controlId: "BirtSheet_" + dlgId, name: "sheet_" + dlgId, pageIndex: 0, dataSets: [queryDataset], children: [{ controlName: "BirtFormSheet", controlId: "BirtFormSheet_" + dlgId, children: [] // .concat(hcQueryPanel ? hcQueryPanel : []) .concat(hcTabs) }] }] return birtWorkBook } /* * 查询方案、查询面板、工具条、网格，标准查询页面 * @param {} queryDataset 保存数据集，命名规范 ds_[数组下标]_[对话框id] @param {} conf 组件定义配置项 @returns */ import { StringUtil } from "@birt/funclib/StringUtil.js"; import { $CONST } from "@birt/funclib/ConstUtil"; import { QueryStyleFactory } from "../query-panel/QueryStyleFactory"; export function TabTableDetail(conf) { const dlgId = StringUtil.randomString(6); const hcTabsId = "HcTabs_" + dlgId; const hcTabListId = "list_" + dlgId; const hcTabDetailId = "detail_" + dlgId; const hcQueryPanelId = "HcQueryPanel_" + dlgId; // 设置数据集id，分页 var queryDataset = conf.mainDataset; queryDataset.controlId += "_" + dlgId; queryDataset._infcPagging = { _isPagging: true, returnCount: true } // 查询面板 let hcQueryPanel = false; if (conf.hcQueryPanel) { hcQueryPanel = { controlName: "HcQueryPanel", controlId: hcQueryPanelId, dataset: queryDataset.controlId, children: [] } // 应用查询面板个性化配置 Object.assign(hcQueryPanel, QueryStyleFactory.buildForm(conf.hcQueryPanel) \|\| {}); } // 操作工具条 let hcFormToolbar = false; if (conf.hcFormToolbar) { hcFormToolbar = { controlName: "HcFormToolbar", controlId: "HcFormToolbar_" + dlgId, dataset: queryDataset.controlId, children: [] } // 应用表单个性化配置 Object.assign(hcFormToolbar, conf.hcFormToolbar \|\| {}); } // 网格明细 var hcTable = { controlName: "HcTable", controlId: "HcTable_" + dlgId, dataset: queryDataset.controlId, border: true, showAddBtn: false, // showSummary: true, height: function (parentHeight) { return parentHeight - 120; }, events: { // 双击跳转至详情页 rowDblclick: function (row, column, event) { debugger let curtTabs = this.getRefCompt(hcTabsId); let pushParam = Object.assign({}, row); let eleNumber = this.store && this.store._getEleNumber(); if (eleNumber) { pushParam[$CONST.FLOWNUMBER] = row[eleNumber.field]; } // 下推功能路径 // pushParam[$CONST.FUNCPATH] = this.getWorkBook().getModelPath(); curtTabs.setActiveTabName(hcTabDetailId, pushParam); }, }, children: [], }; // 应用网格个性化配置 Object.assign(hcTable, conf.hcTable \|\| {}); // 详情表单 var hcDetailForm = false; if (conf.hcDetailForm) { hcDetailForm = Object.assign( conf.hcDetailForm, { height: function (parentHeight) { debugger return parentHeight - 170; }, }) } // 分页工具条 var hcPagination = { controlName: "HcPagination", controlId: "HcPagination_" + dlgId, pageSizes: [10, 20, 50, 100], layout: "total, prev, pager, next, sizes, jumper", dataset: queryDataset.controlId, }; // 返回按钮 var returnBtn = { controlName: 'HcButton', controlId: 'HcButton_' + dlgId, title: '返回', size: 'mini', style: 'position: absolute;top:35px;left:35px;z-index:2001', events:{ click:function(){ debugger let curtTabs = this.getRefCompt(hcTabsId); let qPanel = this.getRefCompt(hcQueryPanelId); curtTabs.setActiveTabName(hcTabListId); if(qPanel){ qPanel.$refs[hcQueryPanelId].doQuery() } } } } var hcTabs = { controlName: "HcTabs", controlId: hcTabsId, tabPosition: "top", activeTabName: hcTabListId, tabPosition: 'right', // type: "border-card", children: [ { controlName: "HcTabPane", controlId: "HcTabPane_list_" + dlgId, label: "列表", name: hcTabListId, children: [] .concat(hcQueryPanel ? hcQueryPanel : []) .concat(hcFormToolbar ? hcFormToolbar : []) .concat(hcTable) .concat(hcPagination) }, { controlName: "HcTabPane", controlId: "HcTabPane_detail_" + dlgId, label: "详情", name: hcTabDetailId, children: [] .concat(returnBtn) .concat(hcDetailForm ? hcDetailForm : []) } ] } // 应用报表模型 var birtWorkBook = Object.assign({ controlName: "BirtWorkBook", controlId: "BirtWorkBook_" + dlgId, showToolBar: false, totalPage: 1, renderType: "pages", height: function (parentHeight) { return parentHeight - 1; }, }, conf.birtWorkBook \|\| {}) // 添加布局结构 birtWorkBook.children = [ { controlName: "BirtSheet", controlId: "BirtSheet_" + dlgId, name: "sheet_" + dlgId, pageIndex: 0, dataSets: [queryDataset], children: [ { controlName: "BirtFormSheet", controlId: "BirtFormSheet_" + dlgId, children: [] // .concat(hcQueryPanel ? hcQueryPanel : []) .concat(hcTabs) } ] } ] return birtWorkBook }

Ignore Space Show notes View

project/hivuiBirt/templates/pages/TabTableDetail.js

/**
 * 查询方案、查询面板、工具条、网格，标准查询页面
 * @param {*} queryDataset 保存数据集，命名规范 ds_[数组下标]_[对话框id]
 * @param {*} conf 组件定义配置项
 * @returns 
 */
import { StringUtil } from "@birt/funclib/StringUtil.js";
import { $CONST } from "@birt/funclib/ConstUtil";
import { QueryStyleFactory } from "../query-panel/QueryStyleFactory";

export function TabTableDetail(conf) {
    const dlgId = StringUtil.randomString(6);
    const hcTableId = "HcTable_" + dlgId;
    const hcTabsId = "HcTabs_" + dlgId;
    const hcTabListId = "list_" + dlgId;
    const hcTabDetailId = "detail_" + dlgId;
    const hcQueryPanelId = "HcQueryPanel_" + dlgId;
    const hcFormToolbarId = "HcFormToolbar_" + dlgId;
    // 设置数据集id，分页
    const queryDataset = conf.mainDataset;
    queryDataset.controlId += "_" + dlgId;
    queryDataset._infcPagging = {
      _isPagging: true,
      returnCount: true
    }
  
    // 查询面板
    let hcQueryPanel = false;
    if (conf.hcQueryPanel) {
      hcQueryPanel = {
        controlName: "HcQueryPanel",
        controlId: hcQueryPanelId,
        dataset: queryDataset.controlId,
        children: []
      }
      // 应用查询面板个性化配置
      Object.assign(hcQueryPanel, QueryStyleFactory.buildForm(conf.hcQueryPanel) || {});
    }
  
    // 操作工具条
    let hcFormToolbar = false;
    if (conf.hcFormToolbar) {
      hcFormToolbar = {
        controlName: "HcFormToolbar",
        controlId: "HcFormToolbar_" + dlgId,
        dataset: queryDataset.controlId,
        style: 'margin-right: 10px;margin-bottom: 5px;',
        tableId: hcTableId,
        children: []
      }
      // 应用表单个性化配置
      Object.assign(hcFormToolbar, conf.hcFormToolbar || {});
    }
    // 网格明细
    var hcTable = {
      controlName: "HcTable",
      controlId: hcTableId,
      dataset: queryDataset.controlId,
      border: true,
      showAddBtn: false,
      // showSummary: true,
      height: function (parentHeight) {
        return parentHeight - 120;
      },
      events: {
        // 双击跳转至详情页
        rowDblclick: function (row, column, event) {
          var hcFormToolbar = this.getRefCompt(hcFormToolbarId)
          if(hcFormToolbar)
          hcFormToolbar.hide()
          let curtTabs = this.getRefCompt(hcTabsId);
          let pushParam = Object.assign({}, row);
          let eleNumber = this.store && this.store._getEleNumber();
          if (eleNumber) {
            pushParam[$CONST.FLOWNUMBER] = row[eleNumber.field];
          }
          // 下推功能路径
          // pushParam[$CONST.FUNCPATH] = this.getWorkBook().getModelPath();
          curtTabs.setActiveTabName(hcTabDetailId, pushParam);
        },
      },
      children: [],
    };
    // 应用网格个性化配置
    Object.assign(hcTable, conf.hcTable || {});
  
    // 详情表单 
    var hcDetailForm = false;
    if (conf.hcDetailForm) {
      hcDetailForm = Object.assign(
        conf.hcDetailForm, {
          height: function (parentHeight) {
            return parentHeight - 170;
          },
        })
    }
  
    // 分页工具条
    var hcPagination = {
      controlName: "HcPagination",
      controlId: "HcPagination_" + dlgId,
      pageSizes: [10, 20, 50, 100],
      layout: "total, prev, pager, next, sizes, jumper",
      dataset: queryDataset.controlId,
    };
    var isEdit = queryDataset.controlName == 'HcEditDataset'
    if(!isEdit){
      var extraBtn = {
        controlName: 'HcRow',
        controlId: 'ElRow_extra',
        style: 'position: absolute;z-index:99;right:-20px;top:120px;height: 40px;line-height: 40px;display:flex',
        title: '导出',
        children: []
        .concat(hcFormToolbar ? hcFormToolbar : [])
      }
    }else{
      Object.assign(hcFormToolbar, {style: 'margin: -7px -4% 3px;border: none;'})
    }
    // 返回按钮
    var returnBtn = {
      controlName: 'HcRow',
      controlId: 'HcRow_' + dlgId,
      style: 'position: absolute;top:5px;left:5%;z-index:2001;line-height: 30px;display:flex;',
      children:[
        {
          controlName: 'HcButton',
          controlId: 'HcButton_' + dlgId,
          title: '返回',
          icon: 'el-icon-back',
          style:'padding: 5px 0;',
          type: 'text',
          size: 'large',
          // style: 'position: absolute;top:15px;left:5%;z-index:2001',
          events: {
            click: function () {
              let curtTabs = this.getRefCompt(hcTabsId);
              let qPanel = this.getRefCompt(hcQueryPanelId);
              curtTabs.setActiveTabName(hcTabListId);
              var hcFormToolbar = this.getRefCompt(hcFormToolbarId)
              if(hcFormToolbar)
              hcFormToolbar.show()
              if (qPanel) {
                qPanel.$refs[hcQueryPanelId].doQuery()
              }
            }
          }
        },
        {
          controlName: "HcTextLabel",
          controlId: "TextLabel2_1",
          style:"margin-left: 10px;",
          className: 'text_title',
          style:'height:20px;line-height: 20px;margin-left: 10px;border-left: 1px solid #cdd3d8;padding: 0 20px;margin-top: 5px;',
          title: "详情",
        },
      ]
    }
  
    var hcTabs = {
      controlName: "HcTabs",
      controlId: hcTabsId,
      tabPosition: "top",
      activeTabName: hcTabListId,
      tabPosition: 'right',
      events: {
        click: function () {
          var tabs = this.getRefCompt(hcTabsId).activeTabName
          var hcFormToolbar = this.getRefCompt(hcFormToolbarId)
          if(hcFormToolbar){
            if (tabs.indexOf('detail') > -1) {
              hcFormToolbar.hide()
            } else {
              hcFormToolbar.show()
            }
          }
        }
      },
      // type: "border-card",
      children: [{
          controlName: "HcTabPane",
          controlId: "HcTabPane_list_" + dlgId,
          label: "列表",
          name: hcTabListId,
          children: []
            .concat(hcQueryPanel ? hcQueryPanel : [])
            .concat(hcFormToolbar && isEdit ? hcFormToolbar : [])
            .concat(hcTable)
            .concat(hcPagination)
        },
        {
          controlName: "HcTabPane",
          controlId: "HcTabPane_detail_" + dlgId,
          label: "详情",
          name: hcTabDetailId,
          children: []
            .concat(returnBtn)
            .concat(hcDetailForm ? hcDetailForm : [])
        }
      ],slot: [].concat(!isEdit ? extraBtn : [])
    }
    // 应用报表模型
    var birtWorkBook = Object.assign({
      controlName: "BirtWorkBook",
      controlId: "BirtWorkBook_" + dlgId,
      showToolBar: false,
      totalPage: 1,
      renderType: "pages",
      height: function (parentHeight) {
  
        return parentHeight - 1;
      },
    }, conf.birtWorkBook || {})
    // 添加布局结构
    birtWorkBook.children = [{
      controlName: "BirtSheet",
      controlId: "BirtSheet_" + dlgId,
      name: "sheet_" + dlgId,
      pageIndex: 0,
      dataSets: [queryDataset],
      children: [{
        controlName: "BirtFormSheet",
        controlId: "BirtFormSheet_" + dlgId,
        children: []
          // .concat(hcQueryPanel ? hcQueryPanel : [])
          .concat(hcTabs)
      }]
    }]
    return birtWorkBook
  }

export function TabTableDetail(conf) {
    const dlgId = StringUtil.randomString(6);
    const hcTabsId = "HcTabs_" + dlgId;
    const hcTabListId = "list_" + dlgId;
    const hcTabDetailId = "detail_" + dlgId;
    const hcQueryPanelId = "HcQueryPanel_" + dlgId;
    // 设置数据集id，分页
    var queryDataset = conf.mainDataset;
    queryDataset.controlId += "_" + dlgId;
    queryDataset._infcPagging = {
        _isPagging: true,
        returnCount: true
    }

// 查询面板
    let hcQueryPanel = false;
    if (conf.hcQueryPanel) {
        hcQueryPanel = {
            controlName: "HcQueryPanel",
            controlId: hcQueryPanelId,
            dataset: queryDataset.controlId,
            children: []
        }
        // 应用查询面板个性化配置
        Object.assign(hcQueryPanel, QueryStyleFactory.buildForm(conf.hcQueryPanel) || {});
    }

// 操作工具条
    let hcFormToolbar = false;
    if (conf.hcFormToolbar) {
        hcFormToolbar = {
            controlName: "HcFormToolbar",
            controlId: "HcFormToolbar_" + dlgId,
            dataset: queryDataset.controlId,
            children: []
        }
        // 应用表单个性化配置
        Object.assign(hcFormToolbar, conf.hcFormToolbar || {});
    }
    // 网格明细
    var hcTable = {
        controlName: "HcTable",
        controlId: "HcTable_" + dlgId,
        dataset: queryDataset.controlId,
        border: true,
        showAddBtn: false,
        // showSummary: true,
        height: function (parentHeight) {
            return parentHeight - 120;
        },
        events: {
            // 双击跳转至详情页
            rowDblclick: function (row, column, event) {
                debugger
                let curtTabs = this.getRefCompt(hcTabsId);
                let pushParam = Object.assign({}, row);
                let eleNumber = this.store && this.store._getEleNumber();
                if (eleNumber) {
                    pushParam[$CONST.FLOWNUMBER] = row[eleNumber.field];
                }
                // 下推功能路径
                // pushParam[$CONST.FUNCPATH] = this.getWorkBook().getModelPath();
                curtTabs.setActiveTabName(hcTabDetailId, pushParam);
            },
        },
        children: [],
    };
    // 应用网格个性化配置
    Object.assign(hcTable, conf.hcTable || {});

// 详情表单 
    var hcDetailForm = false;
    if (conf.hcDetailForm) {
        hcDetailForm = Object.assign(
            conf.hcDetailForm,
            {
                height: function (parentHeight) {
                    debugger
                    return parentHeight - 170;
                },
            })
    }

// 分页工具条
    var hcPagination = {
        controlName: "HcPagination",
        controlId: "HcPagination_" + dlgId,
        pageSizes: [10, 20, 50, 100],
        layout: "total, prev, pager, next, sizes, jumper",
        dataset: queryDataset.controlId,
    };
    // 返回按钮
    var returnBtn = {
        controlName: 'HcButton',
        controlId: 'HcButton_' + dlgId,
        title: '返回',
        size: 'mini',
        style: 'position: absolute;top:35px;left:35px;z-index:2001',
        events:{
            click:function(){
                debugger
                let curtTabs = this.getRefCompt(hcTabsId);
                let qPanel = this.getRefCompt(hcQueryPanelId);
                curtTabs.setActiveTabName(hcTabListId);
                if(qPanel){
                    qPanel.$refs[hcQueryPanelId].doQuery()
                }
            }
        }
    }
    var hcTabs = {
        controlName: "HcTabs",
        controlId: hcTabsId,
        tabPosition: "top",
        activeTabName: hcTabListId,
        tabPosition: 'right',
        // type: "border-card",
        children: [
            {
                controlName: "HcTabPane",
                controlId: "HcTabPane_list_" + dlgId,
                label: "列表",
                name: hcTabListId,
                children: []
                    .concat(hcQueryPanel ? hcQueryPanel : [])
                    .concat(hcFormToolbar ? hcFormToolbar : [])
                    .concat(hcTable)
                    .concat(hcPagination)
            },
            {
                controlName: "HcTabPane",
                controlId: "HcTabPane_detail_" + dlgId,
                label: "详情",
                name: hcTabDetailId,
                children: []
                    .concat(returnBtn)
                    .concat(hcDetailForm ? hcDetailForm : [])
            }
        ]
    }
    // 应用报表模型
    var birtWorkBook = Object.assign({
        controlName: "BirtWorkBook",
        controlId: "BirtWorkBook_" + dlgId,
        showToolBar: false,
        totalPage: 1,
        renderType: "pages",
        height: function (parentHeight) {

return parentHeight - 1;
        },
    }, conf.birtWorkBook || {})
    // 添加布局结构
    birtWorkBook.children = [
        {
            controlName: "BirtSheet",
            controlId: "BirtSheet_" + dlgId,
            name: "sheet_" + dlgId,
            pageIndex: 0,
            dataSets: [queryDataset],
            children: [
                {
                    controlName: "BirtFormSheet",
                    controlId: "BirtFormSheet_" + dlgId,
                    children: []
                        // .concat(hcQueryPanel ? hcQueryPanel : [])
                        .concat(hcTabs)
                }
            ]
        }
    ]
    return birtWorkBook
}

Show line notes below