bonus
/
bonus-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优化

This commit is contained in:
hayu 2026-01-25 20:07:05 +08:00
parent 70ea17331f
commit e8f688ed71
2 changed files with 571 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

160
src/layout/components/Navbar.vue
View File

@ -32,6 +32,19 @@
<el-tooltip content="布局大小" effect="dark" placement="bottom">
<size-select id="size-select" class="right-menu-item hover-effect" />
</el-tooltip> -->
<div class="right-menu-item hover-effect bar-item">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAEKADAAQAAAABAAAAEAAAAAA0VXHyAAABPUlEQVQ4EYWTvUoDQRSFHbezCmIZAhLs7PQJxM4U8TmsBEvbVCkCeYC8QwQrU2sjEiSNjaKkFFTQIoG4+c44F5ZlZrxw9sw95+7d+Vu3QZRleQTtA6eceANXzrmVz3hQcwmdg3dwhjeBvdHDjMXYF/zVDGsFC/IT7zP4qJnVtEnSrwqVsZoca2q56ORMvKdNm2aCGwnd5B01WFoW4Xu0u4hu0kBLuE5M8xm9ANvgIVIz9F1CwQC+AZOAEdy2zzBWk1tg0TfPnzvqFsIusHsw55w/rQi/YLwHDsAXmOLPYX8PuhR8W+vAK/gi+G3GWk49xgiF9uC17oRcTRpAy0nFqU6hpS9FQl4TpHy90vrvHqgoG2pQZirkZX01mCUa/KC/ZHy9NtMmHoJH8FvZKW1sVxWw7oAum34eC/2APflrp+zfNar0B+8AAAAASUVORK5CYII=" alt="提醒">
</div>
<div class="right-menu-item hover-effect bar-item">
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAPCAYAAADtc08vAAAAAXNSR0IArs4c6QAAAERlWElmTU0AKgAAAAgAAYdpAAQAAAABAAAAGgAAAAAAA6ABAAMAAAABAAEAAKACAAQAAAABAAAAEKADAAQAAAABAAAADwAAAADW5XGhAAAA5klEQVQoFe3TvQ7BUBTA8atFI2kwSHyEGCwGmzcwGCS8g0RisHgJs3fgCRgkBovdxGAyMROLwVD/c28HqRrEYnCSX3PuPacnTdurFOF5Xgw7nLFCFxGpSUju70lNeqQ3bqqmochGMOZs2L5ZsMi6pAeQTGUR0iBbQ19YWe6ZWExpy0Poaa+XLFviXXRkwFfxH6DUb7wDh+94w/WD7ym9FzhRLnf0UEEdVTTRwnMsWCyxxwZ96EMyIBlDnuKEI9bYwvzvSh3Ia2iggDKSGEGftgT/dQZyKi2kkNdFU8+xTsP2+11yV/IH7VrRz1OSP24AAAAASUVORK5CYII=" alt="提醒">
</div>
<div class="right-menu-item hover-effect bar-item">
<span class="bar-text">收藏</span>
</div>
<!-- 代办 -->
<div class="right-menu-item hover-effect bar-item" @click="goTodo">
<span class="bar-text">待办</span>
@ -205,7 +218,7 @@
<i class="el-icon-t-shirt" style="font-size: 19px; color: #000;"></i>
<span>一键换肤</span>
</div>
<div class="user-item">
<div class="user-item" @click="clearCacheSimple">
<i class="el-icon-delete" style="font-size: 19px; color: #000;"></i>
<span>清除缓存</span>
</div>
@ -213,11 +226,11 @@
<i class="el-icon-data-analysis" style="font-size: 19px; color: #000;"></i>
<span>测试网络速度</span>
</div>
<div class="user-item">
<div class="user-item" @click="gotoFeedback">
<i class="el-icon-edit-outline" style="font-size: 19px; color: #000;"></i>
<span>意见反馈/闭环</span>
</div>
<div class="user-item">
<div class="user-item" @click="showContactDialog">
<i class="el-icon-phone-outline" style="font-size: 19px; color: #000;"></i>
<span>联系我们</span>
</div>
@ -229,8 +242,8 @@
<!-- 底部 -->
<div class="user-footer">
软件名称：e基建2.0<br />
版本号：2.0.15
软件名称：机械化施工装备管理（共享）平台<br />
版本号：V1.0.4
</div>
<!-- 触发区域（右上角头像+名字） -->
@ -327,7 +340,34 @@
</div>
</div>
</div>
<el-dialog
:visible.sync="contactDialogVisible"
width="400px"
center
:append-to-body="true"
custom-class="contact-dialog"
:show-header="false"
>
<div class="contact-content">
<!-- 外层Flex容器：实现图标+标题同行 -->
<div class="contact-title-wrap">
<div class="contact-icon">
<i class="el-icon-warning"></i>
</div>
<div class="contact-title">联系我们</div>
</div>
<!-- 联系电话单独一行 -->
<div class="contact-phone">联系电话：{{ contactPhone }}</div>
</div>
<div slot="footer" class="dialog-footer">
<el-button @click="contactDialogVisible = false">取消</el-button>
<el-button type="primary" @click="handleContactConfirm">确定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
@ -385,7 +425,9 @@ export default {
title: '待办提醒',
desc: '您有5条待办事项未处理，预计截止时间2026-01-30'
}
]
],
contactDialogVisible: false, // 控制联系我们弹窗显示
contactPhone: '田经理15212781264，刘经理19855530627' // 联系电话
}
},
computed: {
@ -428,6 +470,9 @@ export default {
this.$refs.messagePopover.doClose(); // 关闭消息弹窗
// this.$router.push({ path: '/message' }); // 跳消息列表
},
gotoFeedback(){
this.$router.push({ path: '/feedback' })
},
getUser() {
getUserProfile().then((response) => {
console.log("用户信息", response.data);
@ -440,25 +485,28 @@ export default {
this.download('material-mall/todo/downLoadUserManual', {
}, `机械化施工装备管理（共享）平台操作手册V1.0.pdf`)
},
clearCacheSimple() {
// 清除本地存储
localStorage.clear();
sessionStorage.clear();
this.$message.success('缓存清除成功！');
setTimeout(() => location.reload(), 1000);
},
showContactDialog() {
this.contactDialogVisible = true;
},
handleContactConfirm() {
this.contactDialogVisible = false;
},
async logout() {
this.$confirm('确定注销并退出系统吗？', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
this.$store.dispatch('LogOut').then((res) => {
this.$store.dispatch('tagsView/delAllViews')
if (process.env.VUE_APP_BASE_API == '/iws/jxhzb-api') {
window.location.href = 'http://sgwpdm.ah.sgcc.com.cn/iws'
} else {
this.$router.push({ path: '/login' })
}
})
.then(() => {
this.$store.dispatch('LogOut').then((res) => {
this.$store.dispatch('tagsView/delAllViews')
if (process.env.VUE_APP_BASE_API == '/iws/jxhzb-api') {
window.location.href = 'http://sgwpdm.ah.sgcc.com.cn/iws'
} else {
this.$router.push({ path: '/login' })
}
})
})
.catch((err) => {
console.log('🚀 ~ err-退出登录:', err)
})
},
handleMenuClick(item) {
if (item.redirect == 'index' || item.redirect == 'index1') {
@ -967,10 +1015,6 @@ export default {
}
}
.user-item.logout {
color: #f56c6c;
}
/* 底部 */
.user-footer {
font-size: 12px;
@ -980,4 +1024,66 @@ export default {
line-height: 18px;
}
/* 联系我们弹窗样式 - 修复同行显示+样式优化 */
.contact-dialog {
.el-dialog__body {
padding: 20px 10px 10px;
text-align: center;
margin: 0; /* 清除默认边距，避免居中偏移 */
}
.contact-content {
// 整体内容居中
display: flex;
flex-direction: column;
gap: 16px; /* 标题行与电话行的间距 */
// 图标+标题 同行容器
.contact-title-wrap {
display: flex;
gap: 8px; // 图标与文字的间距，可根据需要调整
}
.contact-icon {
font-size: 24px;
color: #f5a623; // 黄色感叹号，匹配截图
line-height: 1; // 清除行高，避免垂直偏移
}
.contact-title {
display: block;
overflow: hidden;
color: rgba(0, 0, 0, .85);
font-weight: 500;
font-size: 16px;
line-height: 1.4;
}
.contact-phone {
margin-left: 34px;
color: rgba(0, 0, 0, .65);
font-size: 14px;
}
}
.dialog-footer {
padding-top: 15px;
text-align: right;
border-top: 1px solid #e6e6e6;
margin: 0; // 清除默认边距
.el-button {
width: 80px; // 按钮统一宽度，美观
margin: 0 4px; // 按钮之间的小间距
}
}
// 可选：添加弹框圆角+轻微阴影，更贴近截图视觉效果
.el-dialog__wrapper .el-dialog {
border-radius: 12px;
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
}
</style>

438
src/views/feedback/index.vue Normal file
View File

@ -0,0 +1,438 @@
<template>
<div class="app-container">
<el-card style="margin-bottom: 20px" shadow="never">
<el-form :model="queryParams" ref="queryForm" label-width="120px" inline @submit.native.prevent>
<!-- 固定显示：前四个筛选项 -->
<el-form-item label="问题编号" prop="proName">
<el-input
v-model="queryParams.proName"
placeholder="请输入"
clearable
@keyup.enter.native="handleQuery"
style="width: 240px"
/>
</el-form-item>
<el-form-item label="问题处理状态" prop="taskStatus">
<el-select
v-model="queryParams.taskStatus"
placeholder="请选择"
clearable
filterable
style="width: 240px"
>
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</el-form-item>
<el-form-item label="管理专业" prop="manageMajor">
<el-select
v-model="queryParams.manageMajor"
placeholder="请选择"
clearable
filterable
style="width: 240px"
>
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</el-form-item>
<el-form-item label="省公司" prop="provinceCompany">
<el-select
v-model="queryParams.provinceCompany"
placeholder="请选择"
clearable
filterable
style="width: 240px"
>
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</el-form-item>
<!-- 👉 关键：展开更多按钮靠右 -->
<div style="display: flex; justify-content: flex-end; margin-bottom: 10px;">
<div
style="cursor: pointer; color: #666; display: flex; align-items: center;"
@click="showSearch = !showSearch"
>
<i :class="showSearch ? 'el-icon-arrow-up' : 'el-icon-arrow-down'" style="color: #2CBAB2; margin-right: 4px;"></i>
<span>{{ showSearch ? '收起更多' : '展开更多' }}</span>
</div>
</div>
<!-- 可折叠区域 -->
<div v-show="showSearch" style="width: 100%; margin-top: 10px;">
<div style="height: 20px; width: 100%;"></div>
<el-form-item label="提报人" prop="reporter">
<el-input
v-model="queryParams.reporter"
placeholder="请输入"
clearable
@keyup.enter.native="handleQuery"
style="width: 240px"
/>
</el-form-item>
<el-form-item label="问题类型" prop="problemType">
<el-select
v-model="queryParams.problemType"
placeholder="请选择"
clearable
filterable
style="width: 240px"
>
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</el-form-item>
<el-form-item label="建设管理单位" prop="constructionUnit">
<el-select
v-model="queryParams.constructionUnit"
placeholder="请选择"
clearable
filterable
style="width: 240px"
>
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</el-form-item>
<el-form-item label="责任人" prop="responsiblePerson">
<el-input
v-model="queryParams.responsiblePerson"
placeholder="请输入"
clearable
@keyup.enter.native="handleQuery"
style="width: 240px"
/>
</el-form-item>
<div style="height: 20px; width: 100%;"></div>
<el-form-item label="反馈层级" prop="feedbackLevel">
<el-select
v-model="queryParams.feedbackLevel"
placeholder="请选择"
clearable
filterable
style="width: 240px"
>
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</el-form-item>
<el-form-item label="计划解决时间" prop="planSolveTime">
<el-select
v-model="queryParams.planSolveTime"
placeholder="请选择"
clearable
filterable
style="width: 240px"
>
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</el-form-item>
<el-form-item label="期望解决时间" prop="expectSolveTime">
<el-select
v-model="queryParams.expectSolveTime"
placeholder="请选择"
clearable
filterable
style="width: 240px"
>
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</el-form-item>
<el-form-item label="问题闭环时间" prop="closeTime">
<el-select
v-model="queryParams.closeTime"
placeholder="请选择"
clearable
filterable
style="width: 240px"
>
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</el-form-item>
<div style="height: 20px; width: 100%;"></div>
<el-form-item label="问题提出时间" prop="proposeTime">
<el-select
v-model="queryParams.proposeTime"
placeholder="请选择"
clearable
filterable
style="width: 240px"
>
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</el-form-item>
<el-form-item label="功能名称" prop="functionName">
<el-select
v-model="queryParams.functionName"
placeholder="请选择"
clearable
filterable
style="width: 240px"
>
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</el-form-item>
<el-form-item label="岗位角色" prop="postRole">
<el-input
v-model="queryParams.postRole"
placeholder="请输入"
clearable
@keyup.enter.native="handleQuery"
style="width: 240px"
/>
</el-form-item>
<el-form-item label="优先级" prop="priority">
<el-select
v-model="queryParams.priority"
placeholder="请选择"
clearable
filterable
style="width: 240px"
>
<el-option v-for="item in statusList" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</el-form-item>
<div style="height: 20px; width: 100%;"></div>
<el-form-item label="问题描述" prop="problemDesc">
<el-input
v-model="queryParams.problemDesc"
placeholder="请输入"
clearable
@keyup.enter.native="handleQuery"
style="width: 240px"
/>
</el-form-item>
</div>
<!-- 查询/重置按钮 -->
<el-form-item style="float: right; margin-top: 15px;">
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">查询</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="handleReset">重置</el-button>
</el-form-item>
</el-form>
</el-card>
<el-card class="content-box" shadow="never">
<el-row :gutter="10" class="mb8" justify="end" style="padding: 10px 0;margin-bottom: 15px;border-bottom: 1px solid #F0F0F0;">
<el-col :span="4">
<span style="font-size: 20px; font-weight: 800">反馈列表</span>
</el-col>
</el-row>
<el-table
v-loading="isLoading"
:data="tableList"
highlight-current-row
border
stripe
height="546"
style="width: 100%"
>
<el-table-column
type="index"
width="55"
label="编号"
align="center"
:index="(index) => (queryParams.pageNum - 1) * queryParams.pageSize + index + 1"
/>
<el-table-column
v-for="(column, index) in tableColumns"
show-overflow-tooltip
:key="index"
:label="column.label"
:prop="column.prop"
align="center"
>
<template v-slot="{ row }" v-if="column.prop == 'taskStatus'">
<el-tag v-if="row.taskStatus == '1'" type="warning">待出库</el-tag>
<el-tag v-if="row.taskStatus == '2'" type="warning">出库中</el-tag>
<el-tag v-if="row.taskStatus == '3'" type="success">完成出库</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" align="center">
<template slot-scope="{ row }">
<el-button v-if="row.taskStatus == '3'" type="text" style="color: #2CBAB2;" @click="handleApprove(row)">查看</el-button>
<el-button v-if="row.taskStatus != '3'" type="text" style="color: #2CBAB2;" @click="handleView(row)">出库</el-button>
</template>
</el-table-column>
</el-table>
<pagination
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
</el-card>
</div>
</template>
<script>
import { getOutboundList } from '@/api/business/outbound'
export default {
name: 'ApproveList',
data() {
return {
isLoading: false,
showSearch: false,
timeRange: [],
queryParams: {
pageNum: 1,
pageSize: 10,
status: null,
proName: null,
startTime: null,
endTime: null,
taskStatus: null,
manageMajor: null,
provinceCompany: null,
reporter: null,
problemType: null,
constructionUnit: null,
responsiblePerson: null,
feedbackLevel: null,
planSolveTime: null,
expectSolveTime: null,
closeTime: null,
proposeTime: null,
functionName: null,
postRole: null,
priority: null,
problemDesc: null
},
statusList: [
{ label: '待出库', value: '1' },
{ label: '出库中', value: '2' },
{ label: '完成出库', value: '3' }
],
total: 0,
tableColumns: [
{ label: '问题描述', prop: 'code' },
{ label: '问题类型', prop: 'proName' },
{ label: '功能名称', prop: 'devNum' },
{ label: '优先级', prop: 'toolNum' },
{ label: '问题处理状态', prop: 'taskStatus' },
{ label: '问题闭环时间', prop: 'createBy' },
{ label: '问题提出时间', prop: 'createTime' },
{ label: '期望解决时间', prop: 'createTime' },
{ label: '反馈层级', prop: 'createTime' },
{ label: '省公司', prop: 'createTime' },
{ label: '建设管理单位', prop: 'createTime' },
{ label: '提报人', prop: 'createTime' },
{ label: '管理专业', prop: 'createTime' },
{ label: '岗位角色', prop: 'createTime' },
{ label: '责任人', prop: 'createTime' },
{ label: '计划解决时间', prop: 'createTime' }
],
tableList: []
}
},
created() {
this.getList()
},
methods: {
handleQuery() {
this.queryParams.pageNum = 1
this.getList()
},
handleReset() {
this.queryParams.pageNum = 1
this.queryParams.pageSize = 10
this.timeRange = []
this.$refs.queryForm.resetFields()
this.getList()
},
async getList() {
console.log('列表-查询', this.queryParams)
this.isLoading = true
this.queryParams.startTime = '2028-01-01'
this.queryParams.endTime = '2028-01-01'
try {
const params = { ...this.queryParams }
const res = await getOutboundList(params)
this.tableList = res.rows || []
this.total = res.total || 0
} catch (error) {
this.tableList = []
this.total = 0
} finally {
this.isLoading = false
}
},
handleView(row) {
this.$router.push({ path: '/business/outbound/details', query: { id: row.id, isView: true } })
},
handleApprove(row) {
this.$router.push({ path: '/business/outbound/details', query: { id: row.id } })
}
}
}
</script>
<style lang="scss" scoped>
.app-container{
background: #F0F0F0;
padding: 20px;
}
::v-deep.el-button--primary{
background-color: #2CBAB2;
border-color: #2CBAB2;
}
::v-deep.el-button--danger{
background-color: #FF5129;
border-color: #FF5129;
}
::v-deep.el-tag.el-tag--info {
background-color: #F5F5F5;
border-color: #B3B3B3;
color: #B3B3B3;
}
::v-deep.el-tag.el-tag--warn{
background-color: rgba(255,171,41,0.1);
border: #FFAB29;
color: #FFAB29;
}
::v-deep.el-tag.el-tag--success {
background-color: rgba(52,226,199,0.1);
border-color: #34E2C7;
color: #34E2C7;
}
.el-form-item {
margin-bottom: 15px;
&:last-child {
margin-bottom: 0;
}
}
.content-box {
border-radius: 8px;
height: calc(100vh - 230px);
display: flex;
flex-direction: column;
overflow: hidden;
::v-deep .el-card__body {
display: flex !important;
flex-direction: column !important;
height: 100% !important;
padding: 20px;
}
}
</style>