添加供应商日志界面

This commit is contained in:
wangchengming 2025-08-18 19:29:59 +08:00
parent 59b49fe634
commit ace1976df8
2 changed files with 163 additions and 4 deletions

View File

@ -1,6 +1,6 @@
<template>
<div class="app-container">
<div v-if="!showForm && !showDetail">
<div v-if="!showForm && !showDetail && !showLogs">
<div class="searchPanel">
<div class="more-search-pane">
<div class="search-where-container">
@ -110,7 +110,8 @@
</div>
<el-card class="mt20">
<el-row :gutter="10" class="my_row"><el-col :span="12">
<el-row :gutter="10" class="my_row">
<el-col :span="12">
<el-form :inline="true" class="searchInputForm">
<el-form-item label="">
<el-input v-model="queryParams.keyword" placeholder="请输入供应商名称/集团公司名称/联系人/联系人电话"
@ -183,7 +184,7 @@
v-hasPermi="['problemFeedback:edit']">修改</div>
<div class="popBtns" @click="handleDelete(scope.row)"
v-hasPermi="['problemFeedback:edit']">删除</div>
<div class="popBtns" @click="handleUpdate(scope.row)"
<div class="popBtns" @click="handleLogs(scope.row)"
v-hasPermi="['problemFeedback:edit']">日志</div>
<template #reference>
<img style="cursor: pointer;" :src="scope.row.currentImageSrc"
@ -201,6 +202,7 @@
</div>
<supplier-form ref="supplierFormRef" v-if="showForm" @handleShowList="handleShowList" />
<supplier-detail ref="supplierDetailRef" v-if="showDetail" @handleShowList="handleCloseDetail" />
<supplier-logs ref="supplierLogsRef" v-if="showLogs" @handleShowList="handleCloseLogs" />
<!-- 导入对话框 -->
<el-dialog :title="upload.title" v-model="upload.open" width="650px" class="my_dialog" align-center
:destroy-on-close="true" :close-on-click-modal="false">
@ -243,6 +245,7 @@ import { busSupplierPage, deleteBusSupplier } from "@/api/supplier"
import supplierForm from "./supplierForm.vue";
import supplierDetail from "./supplierDetail.vue";
import supplierLogs from "./supplierLogs.vue";
const bgStore = useBackgroundStore()
const { proxy } = getCurrentInstance()
@ -252,6 +255,9 @@ const showForm = ref(false)
const supplierFormRef = ref(null)
const showDetail = ref(false)
const supplierDetailRef = ref(null)
const showLogs = ref(false)
const supplierLogsRef = ref(null)
//
const province = ref([])
const city = ref([])
@ -406,6 +412,13 @@ const handleUpdate = (row) => {
supplierFormRef.value.initForm('编辑供应商', row)
})
}
//
const handleLogs = (row) => {
showLogs.value = true
nextTick(() => {
// supplierLogsRef.value.initForm('', row)
})
}
//
const handleOpenDetail = (_supplierId) => {
showDetail.value = true
@ -413,13 +426,19 @@ const handleOpenDetail = (_supplierId) => {
supplierDetailRef.value.getSupplierInfo(_supplierId)
})
}
//
const handleShowList = () => {
showForm.value = false
getSupplierPageList()
}
//
const handleCloseDetail = () => {
showDetail.value = false
}
//
const handleCloseLogs = () => {
showLogs.value = false
}
//
onMounted(() => {
bgStore.setBgImage(otherbg)

View File

@ -0,0 +1,140 @@
<template>
<el-card class="myDetailCard">
<template #header>
<div class="card-header">
<span>供应商日志</span>
<el-icon style="float: right;cursor: pointer;" @click="handleClose">
<Close />
</el-icon>
</div>
</template>
<el-row :gutter="10" class="my_row">
<el-col :span="12">
<el-form :inline="true" class="searchInputForm">
<el-form-item label="">
<el-input v-model="queryParams.keyword" placeholder="请输入操作人" :prefix-icon="Search"
style="width: 280px;" />
</el-form-item>
<el-form-item label="">
<el-button type="primary" class="primaryBtn" @click="handleQuery">查询</el-button>
<el-button type="primary" class="primaryBtn" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
</el-col>
<el-col :span="12" style="text-align: right;">
<el-button-group>
<el-button v-for="(item, index) in ToolOptions" :key="index"
:type="activeIndex === index ? 'primary' : 'default'" :icon="item"
@click="activeIndex = index" />
</el-button-group>
</el-col>
</el-row>
<el-table v-if="activeIndex == 0" v-loading="loading" :data="activities" height="calc(100vh - 267px)">
<el-table-column label="序号" align="center" width="80">
<template #default="scope">
{{ scope.$index + 1 }}
</template>
</el-table-column>
<el-table-column label="供应商名称" align="left" prop="supplierName" width="230" :show-overflow-tooltip="true" />
<el-table-column label="操作类型" align="left" prop="type" width="100" :show-overflow-tooltip="true" />
<el-table-column label="操作人" align="center" prop="user" width="160" :show-overflow-tooltip="true" />
<el-table-column label="操作时间" align="center" prop="timestamp" width="150"
:show-overflow-tooltip="true" />
<el-table-column label="变更前" align="center" prop="content" min-width="210"
:show-overflow-tooltip="true" />
<el-table-column label="变更后" align="center" prop="content2" min-width="210"
:show-overflow-tooltip="true" />
</el-table>
<div v-if="activeIndex == 1">
<el-timeline style="padding-left: 0;">
<el-timeline-item v-for="(activity, index) in activities" :key="index"
:timestamp="activity.user + '于' + activity.timestamp + activity.type">
<div> 变更前{{ activity.content }}</div>
<div> 变更后{{ activity.content2 }}</div>
</el-timeline-item>
</el-timeline>
</div>
</el-card>
</template>
<script setup>
import { onMounted, defineEmits, ref } from 'vue'
import { Close, Grid, Calendar } from '@element-plus/icons-vue'
import { getBusSupplier } from "@/api/supplier"
const emit = defineEmits(['handleShowList']);
const ToolOptions = ref([Grid, Calendar])
const activeIndex = ref(0)
const supplierLogList = ref([])
const loading = ref(false)
const queryParams = ref({
keyword: undefined
})
const activities = [{
content: '其他: ; 年营收金额: ; 供应商所在城市: 山西/长治市/东湖区; 税点: ; 合作采购金额: 0.0; 联系人职务: ; 发票类型: ; 不良记录信息: ; 邮箱: ; ',
content2: '其他: ; 年营收金额: 待定; 供应商所在城市: 山西/长治市; 税点: 待定; 合作采购金额: 0; 联系人职务: 待定; 发票类型: 暂定; 不良记录信息: ; 邮箱: ; ',
timestamp: '2018-04-15',
user: '优客传媒管理员',
type: '修改'
},
{
content: '其他: ; 年营收金额: ; 供应商所在城市: 山西/长治市/东湖区; 税点: ; 合作采购金额: 0.0; 联系人职务: ; 发票类型: ; 不良记录信息: ; 邮箱: ; ',
content2: '其他: ; 年营收金额: 待定; 供应商所在城市: 山西/长治市; 税点: 待定; 合作采购金额: 0; 联系人职务: 待定; 发票类型: 暂定; 不良记录信息: ; 邮箱: ; ',
timestamp: '2018-04-13',
user: '优客传媒管理员',
type: '修改'
},
{
content: '其他: ; 年营收金额: ; 供应商所在城市: 山西/长治市/东湖区; 税点: ; 合作采购金额: 0.0; 联系人职务: ; 发票类型: ; 不良记录信息: ; 邮箱: ; ',
content2: '其他: ; 年营收金额: 待定; 供应商所在城市: 山西/长治市; 税点: 待定; 合作采购金额: 0; 联系人职务: 待定; 发票类型: 暂定; 不良记录信息: ; 邮箱: ; ',
timestamp: '2018-04-11',
user: '优客传媒管理员',
type: '新增'
},
]
/** 搜索按钮操作 */
const handleQuery = () => {
getSupplierPageList()
}
/** 重置按钮操作 */
const resetQuery = () => {
queryParams.value = {
keyword: undefined
}
handleQuery()
}
//
const handleClose = () => {
emit('handleShowList')
}
</script>
<style lang='scss'>
.el-button,
.el-button.is-round {
padding: 10px 11px;
}
.el-button-group>.el-button {
float: left;
position: relative;
height: 38px;
border: 1px solid #DFDFDF;
background: #ffffff;
font-family: Microsoft YaHei;
font-weight: 400;
font-size: 18px;
text-align: center;
color: #000000;
}
.el-button-group>.el-button--primary {
background: #1f1f1f;
font-family: Microsoft YaHei;
font-weight: 600;
color: #FFFFFF;
border: 1px solid #1f1f1f;
}
</style>