<template>
|
<div class="sync-process-container">
|
<a-spin :spinning="loading">
|
<a-table
|
:columns="columns"
|
:data-source="syncProcessList"
|
rowKey="id"
|
:pagination="false"
|
class="process-table"
|
:scroll="{ y: 400 }"
|
>
|
|
<span slot="action" slot-scope="text, record">
|
<a-popconfirm title="确定领取吗?" @confirm="() => handleInspection(record.id)">
|
<a>领取</a>
|
</a-popconfirm>
|
</span>
|
</a-table>
|
</a-spin>
|
|
<!-- 表单区域 -->
|
<syncProcessSpecificationInfo-modal ref="modalForm" @ok="modalFormOk"></syncProcessSpecificationInfo-modal>
|
</div>
|
</template>
|
|
<script>
|
import '@/assets/less/TableExpand.less'
|
import SyncProcessSpecificationInfoModal from '../dnc/base/modules/SyncProcessSpecificationInfo/SyncProcessSpecificationInfoModal.vue'
|
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
import { getAction } from '@api/manage'
|
|
export default {
|
name: "SyncProcessSpecificationInfoList",
|
mixins: [JeecgListMixin],
|
components: {
|
SyncProcessSpecificationInfoModal
|
},
|
data() {
|
return {
|
syncProcessList: [],
|
url: {
|
list: '/dnc/home/syncProcessSpecificationInfo',
|
isSameNode: '/assign/flow/isSameNode',
|
receiveInspectionOrder:"/dnc/home/receiveTree"
|
},
|
// 表格列配置
|
columns: [
|
{
|
title: '产品代号',
|
align: "center",
|
dataIndex: 'productCode',
|
scopedSlots: { customRender: 'productCode' },
|
width: '10%'
|
},
|
{
|
title: '部件名称',
|
align: "center",
|
dataIndex: 'partName',
|
},
|
{
|
title: '部件编号',
|
align: "center",
|
dataIndex: 'partNumber',
|
},
|
{
|
title: '部件版本',
|
align: "center",
|
dataIndex: 'partVersion',
|
},
|
{
|
title: '工艺规程编号',
|
align: "center",
|
dataIndex: 'planNumber',
|
},
|
{
|
title: '工艺规程版本',
|
align: "center",
|
dataIndex: 'planVersion',
|
},
|
{
|
title: '发布时间',
|
align: "center",
|
dataIndex: 'createTime'
|
},
|
{
|
title: '操作',
|
align: "center",
|
scopedSlots: { customRender: 'action' },
|
}
|
]
|
};
|
},
|
computed: {
|
importExcelUrl: function(){
|
return `${window._CONFIG['domianURL']}/${this.url.importExcelUrl}`;
|
}
|
},
|
methods: {
|
handleReceive(item) {
|
console.log('领取任务', item);
|
// 实际业务中调用领取接口
|
this.$message.success('任务领取成功');
|
// 更新本地数据状态
|
this.syncProcessList = this.syncProcessList.map(i =>
|
i.id === item.id ? {...i, isReceive: true} : i
|
);
|
},
|
loadData() {
|
this.syncProcessList = [];
|
if (!this.url.list) {
|
this.$message.error('请设置url.list属性!');
|
return;
|
}
|
this.loading = true;
|
getAction(this.url.list).then((res) => {
|
if (res.success) {
|
// 使用真实接口数据
|
this.syncProcessList = res.result.records || res.result;
|
} else {
|
this.$message.warning(res.message);
|
}
|
}).finally(() => {
|
this.loading = false;
|
});
|
},
|
/**
|
* 领取
|
* @param id
|
*/
|
handleInspection(id) {
|
var that = this
|
this.loading = true
|
getAction(that.url.receiveInspectionOrder, { id })
|
.then((res) => {
|
if (res.success) {
|
that.$notification.success({
|
message: '消息',
|
description: res.message
|
})
|
that.loadData()
|
} else {
|
that.$notification.warning({
|
message: '消息',
|
description: res.message
|
})
|
this.loading = false
|
}
|
})
|
},
|
},
|
mounted() {
|
this.loadData();
|
}
|
}
|
</script>
|
|
<style scoped>
|
@import '~@assets/less/common.less';
|
|
.sync-process-container {
|
padding: 16px;
|
background-color: #fff;
|
border-radius: 8px;
|
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.09);
|
height: 500px;
|
display: flex;
|
flex-direction: column;
|
}
|
|
.table-header {
|
display: flex;
|
justify-content: space-between;
|
align-items: center;
|
margin-bottom: 16px;
|
flex-shrink: 0;
|
}
|
|
.table-title {
|
font-size: 16px;
|
font-weight: 600;
|
color: #1d2129;
|
}
|
|
.more-button {
|
background-color: #1890ff;
|
border-color: #1890ff;
|
font-weight: 500;
|
}
|
|
.more-button:hover {
|
background-color: #40a9ff;
|
border-color: #40a9ff;
|
}
|
|
/* 表格样式 */
|
.process-table {
|
flex: 1;
|
overflow: hidden;
|
}
|
|
/* 产品代号链接样式 */
|
.process-table >>> .ant-table-tbody a {
|
color: #1890ff;
|
transition: color 0.3s;
|
font-weight: 500;
|
}
|
|
.process-table >>> .ant-table-tbody a:hover {
|
color: #40a9ff;
|
text-decoration: underline;
|
}
|
|
/* 操作按钮样式 */
|
.process-table >>> .ant-btn-link {
|
padding: 0 4px;
|
}
|
|
/* 表格行悬停效果 */
|
.process-table >>> .ant-table-row:hover td {
|
background-color: #f0f8ff !important;
|
cursor: pointer;
|
}
|
|
/* 表格滚动区域样式 */
|
.process-table >>> .ant-table-body {
|
overflow-y: auto !important;
|
}
|
</style>
|
