Browse Source

加了excel插件的修改

Hongxilin
donghaolin 5 months ago
parent
commit
63ef06202e
  1. 1
      vue/gold-system/README.md
  2. 16
      vue/gold-system/package-lock.json
  3. 1
      vue/gold-system/package.json
  4. 6
      vue/gold-system/src/main.ts
  5. 13
      vue/gold-system/src/views/usergoldInfo/index.vue

1
vue/gold-system/README.md

@ -23,3 +23,4 @@ npm install echarts 安装echarts组件
npm install moment 安装 moment 组件 npm install moment 安装 moment 组件
npm install mathjs 安装 mathjs 组件,解决数据计算问题 npm install mathjs 安装 mathjs 组件,解决数据计算问题
npm install vue-json-excel 安装导出 excel 组件

16
vue/gold-system/package-lock.json

@ -16,6 +16,7 @@
"moment": "^2.30.1", "moment": "^2.30.1",
"vue": "^3.5.12", "vue": "^3.5.12",
"vue-icons-plus": "^0.1.7", "vue-icons-plus": "^0.1.7",
"vue-json-excel": "^0.3.0",
"vue-router": "^4.5.0" "vue-router": "^4.5.0"
}, },
"devDependencies": { "devDependencies": {
@ -1193,6 +1194,12 @@
"node": ">=0.4.0" "node": ">=0.4.0"
} }
}, },
"node_modules/downloadjs": {
"version": "1.4.7",
"resolved": "https://mirrors.huaweicloud.com/repository/npm/downloadjs/-/downloadjs-1.4.7.tgz",
"integrity": "sha512-LN1gO7+u9xjU5oEScGFKvXhYf7Y/empUIIEAGBs1LzUq/rg5duiDrkuH5A2lQGd5jfMOb9X9usDa2oVXwJ0U/Q==",
"license": "MIT"
},
"node_modules/echarts": { "node_modules/echarts": {
"version": "5.5.1", "version": "5.5.1",
"resolved": "https://mirrors.huaweicloud.com/repository/npm/echarts/-/echarts-5.5.1.tgz", "resolved": "https://mirrors.huaweicloud.com/repository/npm/echarts/-/echarts-5.5.1.tgz",
@ -1765,6 +1772,15 @@
"vue": ">=2.7.0" "vue": ">=2.7.0"
} }
}, },
"node_modules/vue-json-excel": {
"version": "0.3.0",
"resolved": "https://mirrors.huaweicloud.com/repository/npm/vue-json-excel/-/vue-json-excel-0.3.0.tgz",
"integrity": "sha512-FrSh0tVUpw4K+ilLO8g0Qp52eFJw/hkk3rZPTEKo9qVkJgVfQtZwzj3UWc5ACYxA3jLk9HtjK+f9xKHCN4Kgag==",
"license": "MIT",
"dependencies": {
"downloadjs": "^1.4.7"
}
},
"node_modules/vue-router": { "node_modules/vue-router": {
"version": "4.5.0", "version": "4.5.0",
"resolved": "https://mirrors.huaweicloud.com/repository/npm/vue-router/-/vue-router-4.5.0.tgz", "resolved": "https://mirrors.huaweicloud.com/repository/npm/vue-router/-/vue-router-4.5.0.tgz",

1
vue/gold-system/package.json

@ -18,6 +18,7 @@
"moment": "^2.30.1", "moment": "^2.30.1",
"vue": "^3.5.12", "vue": "^3.5.12",
"vue-icons-plus": "^0.1.7", "vue-icons-plus": "^0.1.7",
"vue-json-excel": "^0.3.0",
"vue-router": "^4.5.0" "vue-router": "^4.5.0"
}, },
"devDependencies": { "devDependencies": {

6
vue/gold-system/src/main.ts

@ -6,13 +6,19 @@ import zhCn from 'element-plus/es/locale/lang/zh-cn'
import 'element-plus/dist/index.css' import 'element-plus/dist/index.css'
import * as ElementPlusIconsVue from '@element-plus/icons-vue' import * as ElementPlusIconsVue from '@element-plus/icons-vue'
import './assets/css/common.css'; // 引入公共CSS文件 import './assets/css/common.css'; // 引入公共CSS文件
import JsonExcel from 'vue-json-excel'
const app = createApp(App) const app = createApp(App)
// 全局注册 ElementPlus 图标
for (const [key, component] of Object.entries(ElementPlusIconsVue)) { for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
app.component(key, component) app.component(key, component)
} }
// 使用 ElementPlus 和路由器
app.use(ElementPlus, { app.use(ElementPlus, {
locale: zhCn, locale: zhCn,
}).use(router).mount('#app'); }).use(router).mount('#app');
// 注册 JsonExcel 组件
app.component('downloadExcel', JsonExcel)

13
vue/gold-system/src/views/usergoldInfo/index.vue

@ -193,7 +193,18 @@ onMounted(async function () {
<el-card> <el-card>
<div> <div>
<el-table :data="tableData" :height="tableHeight" style="width: 100%"> <el-table :data="tableData" :height="tableHeight" style="width: 100%">
<el-table-column prop="" label="序号" width="130" />
<el-table-column
type="index"
label="序号"
width="100px"
fixed="left"
>
<template #default="scope">
<span>{{
scope.$index + 1 + (getObj.pageNum - 1) * getObj.pageSize
}}</span>
</template>
</el-table-column>
<el-table-column prop="name" label="姓名" width="130" /> <el-table-column prop="name" label="姓名" width="130" />
<el-table-column prop="jwcode" label="精网号" width="170" /> <el-table-column prop="jwcode" label="精网号" width="170" />
<el-table-column prop="area" label="所属地区" width="200" /> <el-table-column prop="area" label="所属地区" width="200" />

Loading…
Cancel
Save