From fc4a7ed7e76ab12852ca3269112c247a9bb68d51 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E7=BD=97=E6=96=8C=E6=9D=B0?= <> Date: Mon, 25 Nov 2024 14:40:30 +0800 Subject: [PATCH] ui --- package.json | 143 +++++++++--------- src/assets/css/global_table.css | 17 ++- .../patientRegister/PatientRegisterList.vue | 66 ++++---- src/main.js | 5 + 4 files changed, 125 insertions(+), 106 deletions(-) diff --git a/package.json b/package.json index 1101088..c2989f9 100644 --- a/package.json +++ b/package.json @@ -1,75 +1,76 @@ { - "name": "peis", - "version": "0.1.0", - "private": true, - "scripts": { - "test": "echo \"Error: no test specified\" && exit 1", - "serve": "vue-cli-service serve", - "build": "vue-cli-service build", - "lint": "vue-cli-service lint" + "name": "peis", + "version": "0.1.0", + "private": true, + "scripts": { + "test": "echo \"Error: no test specified\" && exit 1", + "serve": "vue-cli-service serve", + "build": "vue-cli-service build", + "lint": "vue-cli-service lint" + }, + "browser": { + "crypto": false + }, + "dependencies": { + "axios": "^1.3.3", + "crypto-js": "^4.1.1", + "echarts": "^5.4.3", + "element-ui": "^2.15.13", + "exceljs": "^4.3.0", + "file-saver": "^2.0.5", + "html2canvas": "^1.4.1", + "moment": "^2.29.4", + "node-polyfill-webpack-plugin": "^2.0.1", + "print-js": "^1.6.0", + "sortablejs": "^1.15.0", + "umy-ui": "^1.1.6", + "vue": "^2.6.14", + "vue-contextmenujs": "^1.4.9", + "vue-img-cutter": "^3.0.5", + "vue-json-excel": "^0.3.0", + "vue-meta": "^2.4.0", + "vue-print-nb": "^1.7.5", + "vue-router": "^3.5.1", + "vuex": "^3.6.2", + "xlsx": "^0.18.5", + "xlsx-style": "^0.8.13" + }, + "devDependencies": { + "@babel/core": "^7.12.16", + "@babel/eslint-parser": "^7.12.16", + "@vue/cli-plugin-babel": "~5.0.0", + "@vue/cli-plugin-eslint": "~5.0.0", + "@vue/cli-plugin-router": "~5.0.0", + "@vue/cli-plugin-vuex": "~5.0.0", + "@vue/cli-service": "~5.0.0", + "eslint": "^7.32.0", + "eslint-config-prettier": "^8.3.0", + "eslint-plugin-prettier": "^4.0.0", + "eslint-plugin-vue": "^8.0.3", + "prettier": "^2.4.1", + "sass": "^1.32.7", + "sass-loader": "^12.0.0", + "vue-img-cutter": "^3.0.5", + "vue-template-compiler": "^2.6.14" + }, + "eslintConfig": { + "root": true, + "env": { + "node": true }, - "browser": { - "crypto": false + "extends": [ + "plugin:vue/essential", + "eslint:recommended", + "plugin:prettier/recommended" + ], + "parserOptions": { + "parser": "@babel/eslint-parser" }, - "dependencies": { - "axios": "^1.3.3", - "crypto-js": "^4.1.1", - "echarts": "^5.4.3", - "element-ui": "^2.15.13", - "exceljs": "^4.3.0", - "file-saver": "^2.0.5", - "html2canvas": "^1.4.1", - "moment": "^2.29.4", - "node-polyfill-webpack-plugin": "^2.0.1", - "print-js": "^1.6.0", - "sortablejs": "^1.15.0", - "vue": "^2.6.14", - "vue-contextmenujs": "^1.4.9", - "vue-img-cutter": "^3.0.5", - "vue-json-excel": "^0.3.0", - "vue-meta": "^2.4.0", - "vue-print-nb": "^1.7.5", - "vue-router": "^3.5.1", - "vuex": "^3.6.2", - "xlsx": "^0.18.5", - "xlsx-style": "^0.8.13" - }, - "devDependencies": { - "@babel/core": "^7.12.16", - "@babel/eslint-parser": "^7.12.16", - "@vue/cli-plugin-babel": "~5.0.0", - "@vue/cli-plugin-eslint": "~5.0.0", - "@vue/cli-plugin-router": "~5.0.0", - "@vue/cli-plugin-vuex": "~5.0.0", - "@vue/cli-service": "~5.0.0", - "eslint": "^7.32.0", - "eslint-config-prettier": "^8.3.0", - "eslint-plugin-prettier": "^4.0.0", - "eslint-plugin-vue": "^8.0.3", - "prettier": "^2.4.1", - "sass": "^1.32.7", - "sass-loader": "^12.0.0", - "vue-img-cutter": "^3.0.5", - "vue-template-compiler": "^2.6.14" - }, - "eslintConfig": { - "root": true, - "env": { - "node": true - }, - "extends": [ - "plugin:vue/essential", - "eslint:recommended", - "plugin:prettier/recommended" - ], - "parserOptions": { - "parser": "@babel/eslint-parser" - }, - "rules": {} - }, - "browserslist": [ - "> 1%", - "last 2 versions", - "not dead" - ] + "rules": {} + }, + "browserslist": [ + "> 1%", + "last 2 versions", + "not dead" + ] } diff --git a/src/assets/css/global_table.css b/src/assets/css/global_table.css index 59a9ea1..7c9efae 100644 --- a/src/assets/css/global_table.css +++ b/src/assets/css/global_table.css @@ -1,6 +1,7 @@ /* 表格 表头 列间距控制 */ -.el-table th.el-table__cell>.cell { +.el-table th.el-table__cell>.cell, +.plTableBox .el-table th>.cell { text-align: center; /* 表格 表头 对齐方式，默认 left */ padding-right: 2px; @@ -35,7 +36,8 @@ /* 上，右，下，左 */ } -.el-table .cell { +.el-table .cell, +.plTableBox .el-table .cell { padding: 0px 2px; /* 原始 默认 0px 10px; */ line-height: 23px; @@ -69,7 +71,8 @@ /* 设置表体样式 */ -.el-table td.el-table__cell { +.el-table td.el-table__cell, +.plTableBox .el-table td.is-center { padding: 0; color: #52555F; /* 设置表体文字颜色 */ @@ -78,7 +81,11 @@ font-family: "NotoSansSC-Regular"; } + /* 表格列排序 */ -.el-table .caret-wrapper { - width: 16px; /* 默认值 24px */ + +.el-table .caret-wrapper, +.plTableBox .el-table .caret-wrapper { + width: 16px; + /* 默认值 24px */ } \ No newline at end of file diff --git a/src/components/patientRegister/PatientRegisterList.vue b/src/components/patientRegister/PatientRegisterList.vue index ed30850..26f43cd 100644 --- a/src/components/patientRegister/PatientRegisterList.vue +++ b/src/components/patientRegister/PatientRegisterList.vue @@ -4,13 +4,13 @@
- - - + + - + - +
@@ -428,7 +428,7 @@ export default { dialogColSort: false, dom: null, //用于滚动加载数据 - lazyLoading: false, //是否懒加载中 + // lazyLoading: false, //是否懒加载中 loadOpts: { totalCount: 0, skipCount: 0, @@ -480,13 +480,11 @@ export default { this.quickAsb = this.dict.asbItemAll; this.peisid = window.sessionStorage.getItem('peisid'); - - - this.$nextTick(() => { - this.scrollFull() - }) - - + // if(this.$refs.info){ + // this.$nextTick(() => { + // this.scrollFull() + // }) + // } }, computed: { ...mapState([ @@ -1230,25 +1228,33 @@ export default { }, //滚动加载数据 - scrollFull() { - this.dom = this.$refs['info'].bodyWrapper - // console.log('this.dom', this.dom) - - this.dom.addEventListener('scroll', async () => { - // // console.log('scrollTop',this.dom.scrollTop,'clientHeight',this.dom.clientHeight,'scrollHeight',this.dom.scrollHeight); - if (this.dom.scrollTop + this.dom.clientHeight + 20 > this.dom.scrollHeight && !this.lazyLoading) { - // 获取到的不是全部数据 当滚动到底部 - // console.log('scrollTop', this.dom.scrollTop, 'clientHeight', this.dom.clientHeight, 'scrollHeight', this.dom.scrollHeight); - if ((Number(this.loadOpts.skipCount) + 1) * Number(this.loadOpts.maxResultCount) >= Number(this.loadOpts.totalCount)) { - this.lazyLoading = false + async scrollFull(scroll,event) { + console.log(scroll) + if(scroll.judgeFlse){ + if ((Number(this.loadOpts.skipCount) + 1) * Number(this.loadOpts.maxResultCount) >= Number(this.loadOpts.totalCount)) { + return } else { - this.lazyLoading = true await this.load() - this.lazyLoading = false - // this.dom.scrollTop = this.dom.scrollTop - 100 } - } - }) + } + // this.dom = this.$refs.info.bodyWrapper + // console.log('this.dom', this.dom) + + // this.dom.addEventListener('scroll', async () => { + // // // console.log('scrollTop',this.dom.scrollTop,'clientHeight',this.dom.clientHeight,'scrollHeight',this.dom.scrollHeight); + // if (this.dom.scrollTop + this.dom.clientHeight + 20 > this.dom.scrollHeight && !this.lazyLoading) { + // // 获取到的不是全部数据 当滚动到底部 + // // console.log('scrollTop', this.dom.scrollTop, 'clientHeight', this.dom.clientHeight, 'scrollHeight', this.dom.scrollHeight); + // if ((Number(this.loadOpts.skipCount) + 1) * Number(this.loadOpts.maxResultCount) >= Number(this.loadOpts.totalCount)) { + // this.lazyLoading = false + // } else { + // this.lazyLoading = true + // await this.load() + // this.lazyLoading = false + // // this.dom.scrollTop = this.dom.scrollTop - 100 + // } + // } + // }) }, diff --git a/src/main.js b/src/main.js index 837a26d..ae7f69d 100644 --- a/src/main.js +++ b/src/main.js @@ -10,8 +10,13 @@ import Print from "vue-print-nb"; import Meta from 'vue-meta' import Contextmenu from 'vue-contextmenujs' //'vue-contextmenu' import "./assets/css/global_font.css"; +import UmyUi from 'umy-ui' +import 'umy-ui/lib/theme-chalk/index.css'; // 引入样式 + + +Vue.use(UmyUi); Vue.use(Contextmenu); Vue.use(Meta); Vue.use(ElementUI);