|
@@ -64,6 +64,15 @@
|
|
|
<el-button
|
|
|
type="text"
|
|
|
size="small"
|
|
|
+ icon="el-icon-document"
|
|
|
+ style="color: #409eff;"
|
|
|
+ @click="handleViewApprovalRecords(row)"
|
|
|
+ >
|
|
|
+ 审批记录
|
|
|
+ </el-button>
|
|
|
+ <el-button
|
|
|
+ type="text"
|
|
|
+ size="small"
|
|
|
icon="el-icon-view"
|
|
|
@click="handleView(row)"
|
|
|
>
|
|
@@ -142,11 +151,84 @@
|
|
|
</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
+ <el-dialog
|
|
|
+ title="审批记录"
|
|
|
+ :visible.sync="approvalRecordsDialog.visible"
|
|
|
+ width="1000px"
|
|
|
+ append-to-body
|
|
|
+ @close="resetApprovalRecordsDialog"
|
|
|
+ >
|
|
|
+ <div class="approval-records-header">
|
|
|
+ <h4>{{ approvalRecordsDialog.activityTitle }}</h4>
|
|
|
+ <p>活动编码:{{ approvalRecordsDialog.activityCode }}</p>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-table
|
|
|
+ v-loading="approvalRecordsDialog.loading"
|
|
|
+ :data="approvalRecordsDialog.data"
|
|
|
+ border
|
|
|
+ stripe
|
|
|
+ style="width: 100%"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ prop="approverName"
|
|
|
+ label="审批人"
|
|
|
+ width="100"
|
|
|
+ align="center"
|
|
|
+ />
|
|
|
+ <el-table-column
|
|
|
+ prop="approvalStatus"
|
|
|
+ label="审批结果"
|
|
|
+ width="100"
|
|
|
+ align="center"
|
|
|
+ >
|
|
|
+ <template slot-scope="{ row }">
|
|
|
+ <el-tag
|
|
|
+ :type="getApprovalStatusType(row.approvalStatus)"
|
|
|
+ size="small"
|
|
|
+ >
|
|
|
+ {{ getApprovalStatusText(row.approvalStatus) }}
|
|
|
+ </el-tag>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="approvalRemark"
|
|
|
+ label="审批意见"
|
|
|
+ min-width="200"
|
|
|
+ show-overflow-tooltip
|
|
|
+ />
|
|
|
+ <el-table-column
|
|
|
+ prop="approvalTime"
|
|
|
+ label="审批时间"
|
|
|
+ width="160"
|
|
|
+ align="center"
|
|
|
+ />
|
|
|
+ <el-table-column
|
|
|
+ prop="createTime"
|
|
|
+ label="记录创建时间"
|
|
|
+ width="160"
|
|
|
+ align="center"
|
|
|
+ />
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <div class="approval-records-pagination">
|
|
|
+ <el-pagination
|
|
|
+ :current-page="approvalRecordsDialog.page.current"
|
|
|
+ :page-sizes="[10, 20, 50, 100]"
|
|
|
+ :page-size="approvalRecordsDialog.page.size"
|
|
|
+ :total="approvalRecordsDialog.page.total"
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ @size-change="handleApprovalRecordsSizeChange"
|
|
|
+ @current-change="handleApprovalRecordsCurrentChange"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+
|
|
|
+ </el-dialog>
|
|
|
</basic-container>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { getList, getDetail, update, approve } from '@/api/order/marketing-activity'
|
|
|
+import { getList, getDetail, update, approve, getApprovalRecords } from '@/api/order/marketing-activity'
|
|
|
import { mapGetters } from 'vuex'
|
|
|
|
|
|
/**
|
|
@@ -189,6 +271,23 @@ export default {
|
|
|
data() {
|
|
|
return {
|
|
|
/**
|
|
|
+ * 审批记录对话框配置
|
|
|
+ * @type {Object}
|
|
|
+ */
|
|
|
+ approvalRecordsDialog: {
|
|
|
+ visible: false,
|
|
|
+ loading: false,
|
|
|
+ activityId: '',
|
|
|
+ activityCode: '',
|
|
|
+ activityTitle: '',
|
|
|
+ data: [],
|
|
|
+ page: {
|
|
|
+ current: 1,
|
|
|
+ size: 10,
|
|
|
+ total: 0
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /**
|
|
|
* 表格数据
|
|
|
* @type {MarketingActivityRecord[]}
|
|
|
*/
|
|
@@ -445,6 +544,92 @@ export default {
|
|
|
},
|
|
|
|
|
|
methods: {
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 查看审批记录
|
|
|
+ * @param {MarketingActivityRecord} row - 营销活动记录
|
|
|
+ */
|
|
|
+ async handleViewApprovalRecords(row) {
|
|
|
+ this.approvalRecordsDialog.visible = true
|
|
|
+ this.approvalRecordsDialog.activityId = row.id
|
|
|
+ this.approvalRecordsDialog.activityCode = row.activityCode
|
|
|
+ this.approvalRecordsDialog.activityTitle = row.title
|
|
|
+ this.approvalRecordsDialog.page.current = 1
|
|
|
+ this.approvalRecordsDialog.page.size = 10
|
|
|
+
|
|
|
+ await this.loadApprovalRecords()
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 加载审批记录数据
|
|
|
+ */
|
|
|
+ async loadApprovalRecords() {
|
|
|
+ try {
|
|
|
+ this.approvalRecordsDialog.loading = true
|
|
|
+
|
|
|
+ const response = await getApprovalRecords(
|
|
|
+ this.approvalRecordsDialog.page.current,
|
|
|
+ this.approvalRecordsDialog.page.size,
|
|
|
+ this.approvalRecordsDialog.activityId
|
|
|
+ )
|
|
|
+
|
|
|
+ if (response.data.success) {
|
|
|
+ const { records, total, current, size } = response.data.data
|
|
|
+ this.approvalRecordsDialog.data = records || []
|
|
|
+ this.approvalRecordsDialog.page.total = total || 0
|
|
|
+ this.approvalRecordsDialog.page.current = current || 1
|
|
|
+ this.approvalRecordsDialog.page.size = size || 10
|
|
|
+ } else {
|
|
|
+ this.$message.error(response.data.msg || '获取审批记录失败')
|
|
|
+ this.approvalRecordsDialog.data = []
|
|
|
+ this.approvalRecordsDialog.page.total = 0
|
|
|
+ }
|
|
|
+ } catch (error) {
|
|
|
+ console.error('获取审批记录失败:', error)
|
|
|
+ this.$message.error('获取审批记录失败,请稍后重试')
|
|
|
+ this.approvalRecordsDialog.data = []
|
|
|
+ this.approvalRecordsDialog.page.total = 0
|
|
|
+ } finally {
|
|
|
+ this.approvalRecordsDialog.loading = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 审批记录分页大小变化
|
|
|
+ * @param {number} size - 新的分页大小
|
|
|
+ */
|
|
|
+ async handleApprovalRecordsSizeChange(size) {
|
|
|
+ this.approvalRecordsDialog.page.size = size
|
|
|
+ this.approvalRecordsDialog.page.current = 1
|
|
|
+ await this.loadApprovalRecords()
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 审批记录当前页变化
|
|
|
+ * @param {number} current - 新的当前页
|
|
|
+ */
|
|
|
+ async handleApprovalRecordsCurrentChange(current) {
|
|
|
+ this.approvalRecordsDialog.page.current = current
|
|
|
+ await this.loadApprovalRecords()
|
|
|
+ },
|
|
|
+
|
|
|
+ /**
|
|
|
+ * 重置审批记录对话框
|
|
|
+ */
|
|
|
+ resetApprovalRecordsDialog() {
|
|
|
+ this.approvalRecordsDialog.visible = false
|
|
|
+ this.approvalRecordsDialog.loading = false
|
|
|
+ this.approvalRecordsDialog.activityId = ''
|
|
|
+ this.approvalRecordsDialog.activityCode = ''
|
|
|
+ this.approvalRecordsDialog.activityTitle = ''
|
|
|
+ this.approvalRecordsDialog.data = []
|
|
|
+ this.approvalRecordsDialog.page = {
|
|
|
+ current: 1,
|
|
|
+ size: 10,
|
|
|
+ total: 0
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
/**
|
|
|
* 获取审批状态文本
|
|
|
* @param {number} status - 审批状态
|
|
@@ -758,6 +943,30 @@ export default {
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
+.approval-records-header {
|
|
|
+ margin-bottom: 20px;
|
|
|
+ padding-bottom: 10px;
|
|
|
+ border-bottom: 1px solid #ebeef5;
|
|
|
+}
|
|
|
+
|
|
|
+.approval-records-header h4 {
|
|
|
+ margin: 0 0 8px 0;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 600;
|
|
|
+ color: #303133;
|
|
|
+}
|
|
|
+
|
|
|
+.approval-records-header p {
|
|
|
+ margin: 0;
|
|
|
+ font-size: 14px;
|
|
|
+ color: #606266;
|
|
|
+}
|
|
|
+
|
|
|
+.approval-records-pagination {
|
|
|
+ margin-top: 20px;
|
|
|
+ text-align: right;
|
|
|
+}
|
|
|
+
|
|
|
.dialog-footer {
|
|
|
text-align: right;
|
|
|
}
|