From 47819106bfd6c0be7cae581e5dec7f1926293d8c Mon Sep 17 00:00:00 2001
From: xiangpei <xiangpei@timesnew.cn>
Date: 星期五, 03 一月 2025 17:12:44 +0800
Subject: [PATCH] 首页样式优化、流程待办表格数据完善
---
src/assets/styles/ruoyi.scss | 2
src/views/index.vue | 4 +-
src/views/flowable/task/myProcess/send/index.vue | 2
src/views/components/noticeTable.vue | 54 +++++++++++++++++++--------
src/views/components/tidingsTable.vue | 28 +++++++++-----
5 files changed, 60 insertions(+), 30 deletions(-)
diff --git a/src/assets/styles/ruoyi.scss b/src/assets/styles/ruoyi.scss
index 3a16ea5..2a328ff 100644
--- a/src/assets/styles/ruoyi.scss
+++ b/src/assets/styles/ruoyi.scss
@@ -202,7 +202,7 @@
}
.el-card__body {
- padding: 15px 20px 20px 20px !important;
+ padding: 15px 20px 15px 20px !important;
}
.card-box {
diff --git a/src/views/components/noticeTable.vue b/src/views/components/noticeTable.vue
index 319ebda..4789ab9 100644
--- a/src/views/components/noticeTable.vue
+++ b/src/views/components/noticeTable.vue
@@ -1,6 +1,6 @@
<template>
- <div>
- <div class="flex justify-between mb-[15px]">
+ <div style="position: relative">
+ <div class="flex justify-between mb-[15px]" style="align-items: center;margin-bottom: 5px">
<div class="block mb-3 font-semibold fonts">寰呭姙浜嬮」</div>
<div class="flex text-[12px]">
<div
@@ -26,7 +26,7 @@
color: '#454B5E',
fontSize: '12px'
}"
- height="280"
+ min-height="280"
max-height="280"
>
<el-table-column
@@ -37,6 +37,7 @@
:min-width="column.minWidth"
:prop="column.prop"
:show-overflow-tooltip="true"
+ :formatter="column.formatter"
>
</el-table-column>
@@ -44,35 +45,39 @@
align="center"
fixed="right"
label="鎿嶄綔"
- min-width="150"
+ min-width="90"
>
- <template #default="scope">
+ <template slot-scope="scope">
<el-button
- plain
size="small"
- type="primary"
+ type="text"
@click="handleDetail(scope.row)"
>
鏌ョ湅</el-button
>
<el-button
- plain
size="small"
- type="primary"
+ type="text"
@click="handleUpdate(scope.row)"
>
- 澶勭疆</el-button
+ 澶勭悊</el-button
>
</template>
</el-table-column>
</el-table>
- <pagination
+ <div style="position: absolute; bottom: 0px;width: 100%;">
+ <div style="width: 100%;display: flex;flex-direction: row-reverse;align-items: center">
+ <pagination
+ style="width: 100%"
v-show="total >= 0"
+ :page-sizes="[4]"
:limit="queryParams.pageSize"
:page="queryParams.pageNum"
:total="total"
@pagination="getList"
- />
+ />
+ </div>
+ </div>
</div>
</template>
<script>
@@ -85,7 +90,7 @@
total: 0,
queryParams: {
pageNum: 1,
- pageSize: 5,
+ pageSize: 4,
},
tableData: [],
currentTableHeaders: [],
@@ -93,11 +98,25 @@
{ label: "娴佺▼鐜妭", prop: "taskName", minWidth: 150, align: "left" },
{
label: "鐢宠椤圭洰",
- prop: "processName",
+ prop: "projectName",
minWidth: 150,
align: "left",
},
- { label: "瀹℃壒浜�", prop: "handlerName", minWidth: 100, align: "left" },
+ {
+ label: "澶勭悊浜�",
+ prop: "handlerName",
+ minWidth: 100,
+ align: "left",
+ formatter: (row) => {
+ if (row.handlerType === 'USER') {
+ return row.handlerName.join('銆�')
+ } else if (row.handlerType === 'DEPT') {
+ return row.handlerUnitName.join('銆�')
+ } else if (row.handlerType === 'ROLE') {
+ return row.handlerUnitName.join('銆�')
+ }
+ }
+ },
{ label: "瀹屾垚鎯呭喌", prop: "taskStatus", minWidth: 143, align: "left" },
{
label: "鍓╀綑鏃堕棿",
@@ -221,10 +240,13 @@
<style lang="scss" scoped>
.tab {
- padding: 8px;
+ padding: 6px;
border: 1px solid #dbdeea;
cursor: pointer;
width: 72px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
}
.active {
diff --git a/src/views/components/tidingsTable.vue b/src/views/components/tidingsTable.vue
index 99d3b80..8c88212 100644
--- a/src/views/components/tidingsTable.vue
+++ b/src/views/components/tidingsTable.vue
@@ -1,6 +1,6 @@
<template>
- <div>
- <div class="flex justify-between mb-[15px]">
+ <div style="position: relative">
+ <div class="flex justify-between mb-[15px]" style="align-items: center;margin-bottom: 5px">
<div class="block mb-3 font-semibold fonts">娑堟伅涓績</div>
<div class="flex text-[12px]">
<div
@@ -24,7 +24,7 @@
color: '#454B5E',
fontSize: '12px'
}"
- height="280"
+ min-height="280"
max-height="280"
>
<el-table-column
@@ -65,9 +65,8 @@
>
<template #default="scope">
<el-button
- plain
size="small"
- type="primary"
+ type="text"
@click="handleDetail(scope.row)"
>
鏌ョ湅</el-button
@@ -76,13 +75,19 @@
</template>
</el-table-column>
</el-table>
- <pagination
+ <div style="position: absolute; bottom: 0px;width: 100%;">
+ <div style="width: 100%;display: flex;flex-direction: row-reverse;align-items: center">
+ <pagination
+ style="width: 100%"
v-show="total >= 0"
+ :page-sizes="[4]"
:limit="queryParams.pageSize"
:page="queryParams.pageNum"
:total="total"
@pagination="getList"
- />
+ />
+ </div>
+ </div>
</div>
</template>
<script>
@@ -95,7 +100,7 @@
total: 0,
queryParams: {
pageNum: 1,
- pageSize: 10
+ pageSize: 4
},
tableData: [],
tabs: [
@@ -190,10 +195,13 @@
<style lang="scss" scoped>
.tab {
- padding: 8px;
+ padding: 6px;
border: 1px solid #dbdeea;
cursor: pointer;
width: 72px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
}
.active {
@@ -255,7 +263,7 @@
text-align: end;
}
::v-deep .el-pagination .btn-prev .el-icon,
- ::v-deep .el-pagination .btn-next .el-icon
+ ::v-deep .el-pagination .btn-next .el-icon
{
display: inline;
}
diff --git a/src/views/flowable/task/myProcess/send/index.vue b/src/views/flowable/task/myProcess/send/index.vue
index 76f7c37..ff75151 100644
--- a/src/views/flowable/task/myProcess/send/index.vue
+++ b/src/views/flowable/task/myProcess/send/index.vue
@@ -128,7 +128,7 @@
</el-form>
</div>
<div class="opBut">
- <el-button type="danger" size="small" @click="delegation">杞姙</el-button>
+ <el-button type="danger" size="small" @click="delegation">杞� 鍔�</el-button>
</div>
</el-dialog>
diff --git a/src/views/index.vue b/src/views/index.vue
index b4cd025..954a9f3 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -83,13 +83,13 @@
<div class="flex">
<div class="flex_card">
<el-card>
- <NoticeTable style="height: 360px" />
+ <NoticeTable style="height: 340px" />
</el-card>
</div>
<!-- 娑堟伅閫氱煡 -->
<div class="flex_card">
<el-card>
- <TidingsTable style="height: 360px" />
+ <TidingsTable style="height: 340px" />
</el-card>
</div>
<!-- 鍦板浘 -->
--
Gitblit v1.8.0