zhaoln
1 month ago
committed by
donghaolin
donghaolin
20 changed files with 5703 additions and 663 deletions
-
1gold-system/.env.test
-
272gold-system/package-lock.json
-
6gold-system/package.json
-
2gold-system/src/router/index.js
-
2gold-system/src/util/http.js
-
115gold-system/src/views/goldBeen/addGoldenBeen.vue
-
465gold-system/src/views/goldBeen/goldenBeenBalance.vue
-
13gold-system/src/views/goldBeen/goldenBeenDetail.vue
-
4gold-system/src/views/index.vue
-
12gold-system/src/views/recharge/addRecharge.vue
-
2gold-system/src/views/refund/addRefund.vue
-
12gold-system/src/views/usergold/index.vue
-
245gold-system/src/views/workspace/index.vue
-
195gold-system/src/views/z.vue
-
4949gold-system/stats.html
-
22gold-system/tsconfig.app.json
-
3gold-system/tsconfig.json
-
11gold-system/tsconfig.node.json
-
1gold-system/tsconfig.tsbuildinfo
-
32gold-system/vite.config.ts
@ -0,0 +1 @@ |
|||||
|
VITE_API_BASE='http://54.251.137.151:10704/' |
||||
@ -1,125 +1,140 @@ |
|||||
<script setup> |
<script setup> |
||||
import { ref, onMounted, reactive, computed, nextTick } from "vue"; |
|
||||
|
import { ref, onMounted, reactive, computed, nextTick } from 'vue' |
||||
|
|
||||
// 变量 |
// 变量 |
||||
const allData = ref([]); |
|
||||
const tableData = ref([]); |
|
||||
const elTableHeight = ref(''); |
|
||||
const theadHeight = ref(''); |
|
||||
const contentHeight = ref(0); |
|
||||
const showRowCount = ref(0); |
|
||||
const falseBox = ref(null); |
|
||||
const scollBoxHeight = ref(0); |
|
||||
const scrollTopRowCount = ref(0); |
|
||||
|
const allData = ref([]) |
||||
|
const tableData = ref([]) |
||||
|
const elTableHeight = ref('') |
||||
|
const theadHeight = ref('') |
||||
|
const contentHeight = ref(0) |
||||
|
const showRowCount = ref(0) |
||||
|
const falseBox = ref(null) |
||||
|
const scollBoxHeight = ref(0) |
||||
|
const scrollTopRowCount = ref(0) |
||||
|
|
||||
// 方法 |
// 方法 |
||||
onMounted(async function () { |
onMounted(async function () { |
||||
allData.value = []; |
|
||||
for (let i = 0; i < 10000; i++) { |
|
||||
allData.value.push({ |
|
||||
name: '张三' + i, |
|
||||
age: 20 + i, |
|
||||
address: '北京市海淀区' + i, |
|
||||
salary: 50000 + i, |
|
||||
date: '2022-01-01' |
|
||||
}) |
|
||||
} |
|
||||
scollBoxHeight.value = 45 * allData.value.length + 45; //多加一行，要不然滚动到底差一行 |
|
||||
nextTick(() => { |
|
||||
elTableHeight.value = document.querySelector('.table-box .el-table').offsetHeight; |
|
||||
theadHeight.value = document.querySelector('.table-box .el-table__header-wrapper').offsetHeight; |
|
||||
console.log("elTableHeight", elTableHeight.value); |
|
||||
console.log("theadHeight", theadHeight.value); |
|
||||
contentHeight.value = elTableHeight.value - theadHeight.value; |
|
||||
console.log("contentHeight", contentHeight.value); |
|
||||
showRowCount.value = Math.floor(contentHeight.value / 45); |
|
||||
console.log("showRowCount", showRowCount.value); |
|
||||
// 获取默认显示的前 <showRowCount> 条 |
|
||||
tableData.value = JSON.parse(JSON.stringify(allData.value)).splice(0, showRowCount.value); |
|
||||
|
allData.value = [] |
||||
|
for (let i = 0; i < 10000; i++) { |
||||
|
allData.value.push({ |
||||
|
name: '张三' + i, |
||||
|
age: 20 + i, |
||||
|
address: '北京市海淀区' + i, |
||||
|
salary: 50000 + i, |
||||
|
date: '2022-01-01' |
||||
}) |
}) |
||||
falseBox.value = document.querySelector('.false-box'); |
|
||||
falseBox.value.addEventListener('scroll', function (e) { |
|
||||
scrollTopRowCount.value = Math.ceil(e.target.scrollTop / 45); |
|
||||
// 获取从索引<scrollTopRowCount> 开始 <showRowCount> 条 |
|
||||
tableData.value = JSON.parse(JSON.stringify(allData.value)).splice(scrollTopRowCount.value, showRowCount.value); |
|
||||
}); |
|
||||
|
} |
||||
|
scollBoxHeight.value = 45 * allData.value.length + 45 //多加一行，要不然滚动到底差一行 |
||||
|
nextTick(() => { |
||||
|
elTableHeight.value = document.querySelector( |
||||
|
'.table-box .el-table' |
||||
|
).offsetHeight |
||||
|
theadHeight.value = document.querySelector( |
||||
|
'.table-box .el-table__header-wrapper' |
||||
|
).offsetHeight |
||||
|
console.log('elTableHeight', elTableHeight.value) |
||||
|
console.log('theadHeight', theadHeight.value) |
||||
|
contentHeight.value = elTableHeight.value - theadHeight.value |
||||
|
console.log('contentHeight', contentHeight.value) |
||||
|
showRowCount.value = Math.floor(contentHeight.value / 45) |
||||
|
console.log('showRowCount', showRowCount.value) |
||||
|
// 获取默认显示的前 <showRowCount> 条 |
||||
|
tableData.value = JSON.parse(JSON.stringify(allData.value)).splice( |
||||
|
0, |
||||
|
showRowCount.value |
||||
|
) |
||||
|
}) |
||||
|
falseBox.value = document.querySelector('.false-box') |
||||
|
falseBox.value.addEventListener('scroll', function (e) { |
||||
|
scrollTopRowCount.value = Math.ceil(e.target.scrollTop / 45) |
||||
|
// 获取从索引<scrollTopRowCount> 开始 <showRowCount> 条 |
||||
|
tableData.value = JSON.parse(JSON.stringify(allData.value)).splice( |
||||
|
scrollTopRowCount.value, |
||||
|
showRowCount.value |
||||
|
) |
||||
|
}) |
||||
}) |
}) |
||||
|
|
||||
</script> |
</script> |
||||
|
|
||||
<template> |
<template> |
||||
<div class="box" style="width: 1000px; height: 500px; overflow: hidden; position: relative;"> |
|
||||
<!-- false-box这是一个用来显示滚动条的方法 --> |
|
||||
<div class="false-box" |
|
||||
style="width: 100%; height: 100%; position: absolute; top: 0%; left: 0%; overflow: auto;"> |
|
||||
<div class="scroll-box" :style="{ 'height': scollBoxHeight + 'px' }"> |
|
||||
<!-- scroll-box是用来撑起盒子的方法 --> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div class="table-box"> |
|
||||
<el-table class="el-table" :data="allData" style="width: 100%"> |
|
||||
<el-table-column prop="name" label="姓名" width="180"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="age" label="年龄" width="180"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="address" label="地址"> |
|
||||
</el-table-column> |
|
||||
<el-table-column prop="salary" label="薪资" width="180"> |
|
||||
|
|
||||
</el-table-column> |
|
||||
<el-table-column prop="date" label="日期" width="180"> |
|
||||
</el-table-column> |
|
||||
|
|
||||
|
|
||||
</el-table> |
|
||||
</div> |
|
||||
|
<div |
||||
|
class="box" |
||||
|
style="width: 1000px; height: 500px; overflow: hidden; position: relative" |
||||
|
> |
||||
|
<!-- false-box这是一个用来显示滚动条的方法 --> |
||||
|
<div |
||||
|
class="false-box" |
||||
|
style=" |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
position: absolute; |
||||
|
top: 0%; |
||||
|
left: 0%; |
||||
|
overflow: auto; |
||||
|
" |
||||
|
> |
||||
|
<div class="scroll-box" :style="{ height: scollBoxHeight + 'px' }"> |
||||
|
<!-- scroll-box是用来撑起盒子的方法 --> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="table-box"> |
||||
|
<el-table class="el-table" :data="allData" style="width: 100%"> |
||||
|
<el-table-column prop="name" label="姓名" width="180"> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="age" label="年龄" width="180"> </el-table-column> |
||||
|
<el-table-column prop="address" label="地址"> </el-table-column> |
||||
|
<el-table-column prop="salary" label="薪资" width="180"> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="date" label="日期" width="180"> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
</div> |
</div> |
||||
|
</div> |
||||
</template> |
</template> |
||||
|
|
||||
<style scoped> |
<style scoped> |
||||
.box { |
.box { |
||||
width: 1000px; |
|
||||
height: 500px; |
|
||||
overflow: hidden; |
|
||||
position: relative; |
|
||||
|
width: 1000px; |
||||
|
height: 500px; |
||||
|
overflow: hidden; |
||||
|
position: relative; |
||||
} |
} |
||||
|
|
||||
.false-box { |
.false-box { |
||||
width: 100%; |
|
||||
height: 100%; |
|
||||
position: absolute; |
|
||||
top: 0%; |
|
||||
left: 0%; |
|
||||
overflow: auto; |
|
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
position: absolute; |
||||
|
top: 0%; |
||||
|
left: 0%; |
||||
|
overflow: auto; |
||||
} |
} |
||||
|
|
||||
.scroll-box { |
.scroll-box { |
||||
width: 100%; |
|
||||
height: 1000px; |
|
||||
position: absolute; |
|
||||
top: 0%; |
|
||||
left: 0%; |
|
||||
|
width: 100%; |
||||
|
height: 1000px; |
||||
|
position: absolute; |
||||
|
top: 0%; |
||||
|
left: 0%; |
||||
} |
} |
||||
|
|
||||
.table-box { |
.table-box { |
||||
width: calc(100% - 20px); |
|
||||
height: 100%; |
|
||||
position: absolute; |
|
||||
top: 0%; |
|
||||
left: 0%; |
|
||||
|
width: calc(100% - 20px); |
||||
|
height: 100%; |
||||
|
position: absolute; |
||||
|
top: 0%; |
||||
|
left: 0%; |
||||
} |
} |
||||
|
|
||||
|
|
||||
::v-deep .el-table { |
|
||||
width: 100%; |
|
||||
height: 100%; |
|
||||
|
:deep(.el-table) { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
} |
} |
||||
|
|
||||
.el-table .el-table__row { |
.el-table .el-table__row { |
||||
height: 45px; |
|
||||
|
height: 45px; |
||||
} |
} |
||||
|
|
||||
.el-table .el-table__row td { |
.el-table .el-table__row td { |
||||
padding: 0px |
|
||||
|
padding: 0px; |
||||
} |
} |
||||
</style> |
</style> |
||||
4949
gold-system/stats.html
File diff suppressed because it is too large
View File
File diff suppressed because it is too large
View File
@ -1,27 +1,41 @@ |
|||||
{ |
{ |
||||
"compilerOptions": { |
"compilerOptions": { |
||||
|
"strict": true, |
||||
|
"skipLibCheck": true, |
||||
"composite": true, |
"composite": true, |
||||
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo", |
"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo", |
||||
"target": "ES2020", |
"target": "ES2020", |
||||
|
"noEmitOnError": false, |
||||
"useDefineForClassFields": true, |
"useDefineForClassFields": true, |
||||
"module": "ESNext", |
"module": "ESNext", |
||||
"lib": ["ES2020", "DOM", "DOM.Iterable"], |
"lib": ["ES2020", "DOM", "DOM.Iterable"], |
||||
"skipLibCheck": true, |
|
||||
|
|
||||
/* Bundler mode */ |
/* Bundler mode */ |
||||
"moduleResolution": "Bundler", |
"moduleResolution": "Bundler", |
||||
"allowImportingTsExtensions": true, |
"allowImportingTsExtensions": true, |
||||
"isolatedModules": true, |
"isolatedModules": true, |
||||
"moduleDetection": "force", |
"moduleDetection": "force", |
||||
"noEmit": true, |
"noEmit": true, |
||||
|
"emitDeclarationOnly": false, |
||||
"jsx": "preserve", |
"jsx": "preserve", |
||||
|
|
||||
/* Linting */ |
/* Linting */ |
||||
"strict": true, |
|
||||
|
// "strict": true, |
||||
"noUnusedLocals": true, |
"noUnusedLocals": true, |
||||
"noUnusedParameters": true, |
"noUnusedParameters": true, |
||||
"noFallthroughCasesInSwitch": true, |
"noFallthroughCasesInSwitch": true, |
||||
"noUncheckedSideEffectImports": true, |
"noUncheckedSideEffectImports": true, |
||||
"noImplicitAny": false |
|
||||
|
"noImplicitAny": false, |
||||
|
"baseUrl": ".", |
||||
|
"paths": { |
||||
|
"@/*": ["src/*"] |
||||
|
} |
||||
}, |
}, |
||||
"include": ["src/**/*.ts", "src/**/*.tsx", "src/**/*.vue"] |
|
||||
|
"include": [ |
||||
|
"src/**/*.ts", |
||||
|
"src/**/*.tsx", |
||||
|
"src/**/*.d.ts", |
||||
|
"src/**/*.vue", |
||||
|
"src/util/http.js" |
||||
|
] |
||||
} |
} |
||||
@ -0,0 +1 @@ |
|||||
|
{"root":["./src/main.ts","./src/vite-env.d.ts","./src/app.vue","./src/views/index.vue","./src/views/login.vue","./src/views/nopermissionpage.vue","./src/views/z.vue","./src/views/audit/rechargeaudit.vue","./src/views/audit/refundaudit.vue","./src/views/consume/addconsume.vue","./src/views/consume/allconsume.vue","./src/views/goldbeen/addgoldenbeen.vue","./src/views/goldbeen/goldenbeenbalance.vue","./src/views/goldbeen/goldenbeendetail.vue","./src/views/managerecharge/activity.vue","./src/views/managerecharge/rate.vue","./src/views/permissions/index.vue","./src/views/recharge/addrecharge.vue","./src/views/recharge/adminrecharge.vue","./src/views/recharge/allrecharge.vue","./src/views/refund/addrefund.vue","./src/views/refund/allrefund.vue","./src/views/usergold/index.vue","./src/views/usergoldinfo/index.vue","./src/views/workspace/index.vue"],"errors":true,"version":"5.6.3"} |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue