<template>
<div v-loading="loading" class="content">
<div class="title">
<div class="text">
{{ $t('产品模型') }}
</div>
<div class="date">
<DatePicker ref="datePicker" @changeDate="changeDate"></DatePicker>
</div>
</div>
<MyCard class="data_list">
<MoreSearch
:defaultTip="$t('名称搜索')"
:defaultExpandForm="true"
@expandMore="expandMore"
@enterSearch="enterSearch"
>
<template #btnList>
<el-row type="flex">
<el-col :span="24">
<el-button v-preventReClick type="primary" @click="add">
{{ $t('Add') }}
</el-button>
</el-col>
</el-row>
</template>
</MoreSearch>
<SearchForm
v-show="showForm"
ref="formModel"
type="Virtual_Model_List_Config"
@changeSearch="getSearchForm"
></SearchForm>
<UserTable
ref="userTable"
class="table_data"
type="Virtual_Model_List_Config"
:tableData="tableData"
:needIndex="true"
:needAction="true"
:needExpand="true"
:tableWidth="tableWidth"
:fixeds="fixeds"
:needShowImg="['sync_status']"
:imgAddress="imgAddress"
:dictionTypes="['Virtual_Model_List_Config']"
:dynamicSlotName="['name_cn', 'action']"
>
<template #expand="props">
<TreeTableLoad
ref="treeTableLoad"
class="table_expand"
instanceType="model"
:instanceId="props.row.id"
:hasAction="true"
:Wstyles="true"
citype="Virtual_Bom_Instance_Info_Head"
:propsRow="props.row"
:tableExpand="true"
></TreeTableLoad>
</template>
<template #name_cn="props">
<el-button class="btn_link_select" link @click="viewLog(props.row)">
{{ props.row.name_cn }}
</el-button>
</template>
<template #action="props">
<el-button link @click="edit(props.row)">
{{ $t('Edit') }}
</el-button>
<el-button link @click="syncData(props.row)">
{{ $t('sync') }}
</el-button>
<el-button link @click="deleteData(props.row)">
{{ $t('delete') }}
</el-button>
</template>
</UserTable>
<Pagination ref="Pagination" :total="total" @onChange="tableChange" />
</MyCard>
<el-dialog v-model="showDialog" class="dialog" :title="$t('delete')" width="30%">
<div>
<el-input
v-model.trim="textareas"
type="textarea"
maxlength="500"
:rows="2"
:autosize="{ minRows: 2, maxRows: 4 }"
:placeholder="applyLang('请输入', 'Please enter')"
show-word-limit
></el-input>
</div>
<template #footer>
<div class="dialog_footer">
<el-button v-preventReClick type="primary" @click="submit">
{{ $t('确定') }}
</el-button>
<el-button v-preventReClick @click="closeDialog">
{{ $t('Cancels') }}
</el-button>
</div>
</template>
</el-dialog>
<el-dialog v-model="addTypeDialog" :title="$t('新增类型')" width="20%">
<div class="add_dialog">
<el-button @click="addModel('ILaunch')">
{{ $t('iLaunch模型') }}
</el-button>
<el-button @click="addModel('PDM')">
{{ $t('PDM模型') }}
</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import MyCard from '../components/MyCard.vue';
import UserTable from '../supplyData/userTable.vue';
import Pagination from '../components/Pagination.vue';
import DatePicker from '@/components/DatePicker';
import TreeTableLoad from '../components/treeTableLoad.vue';
import SearchForm from '../components/SearchForm.vue';
import MoreSearch from '../components/moreSearch.vue';
import dayjs from 'dayjs';
import { getModelListAPI, syncModelInfoAPI, deleteModelAPI } from '@/apis/ptp';
import pinia from '@/store/pinia';
import { useProductMgmtStore } from '@/store/modules/productMgmt';
export default {
components: {
MyCard,
UserTable,
Pagination,
DatePicker,
TreeTableLoad,
SearchForm,
MoreSearch,
},
setup() {
const productStore = useProductMgmtStore(pinia);
return {
productStore,
};
},
data() {
return {
loading: false,
searchForm: {},
page: {
pageNo: 1,
pageSize: 10,
},
total: 0,
textareas: '',
currentData: {},
searchDate: [],
tableData: [],
tableWidth: {
action: { zh: 160, en: 235 },
},
fixeds: [
{
field: 'action',
fixed: 'right',
},
],
imgAddress: {
'sync_status': {
completed: new URL('../images/Status/completed.png', import.meta.url).href,
error: new URL('../images/Status/error.png', import.meta.url).href,
waiting: new URL('../images/Status/waiting.png', import.meta.url).href,
executing: new URL('../images/Status/executing.png', import.meta.url).href,
},
},
showDialog: false,
addTypeDialog: false,
showForm: true,
};
},
computed: {
},
activated() {
this.updateResetPage ? this.resetPage() : this.getTableData();
},
created() {
window.FURION && window.FURION.reportCustomTime('rtti', '1E444AE648FC4C9E9B581B6A35093A05', 1);
this.productStore.setBomCode('');
},
methods: {
expandMore(val) {
this.showForm = val;
},
// enterSearch(val, flag) {
// if (!flag) {
// this.$refs.formModel.resetForm();
// this.searchForm = {};
// this.resetPage();
// return;
// }
// const advancedSearch = this.$refs?.formModel?.formData || {};
// const finalSearch = {
// ...advancedSearch,
// name_cn: val ? val.trim() : undefined,
// };
// this.handleSearchForm(finalSearch);
// },
enterSearch(val, flag) {
this.searchForm['name_cn'] = val;
if (!flag) {
this.$refs.formModel.resetForm();
return;
}
let search = this.$refs?.formModel?.formData || {};
console.log("search1", search);
this.handleSearchForm(search);
},
handleSearchForm(search) {
console.log("search2", search);
this.productStore.setBomCode(search?.bom_code);
console.log("this.searchForm", this.searchForm);
Object.assign(this.searchForm, search);
console.log("this.searchForm2", this.searchForm);
console.log("search3", search);
this.resetPage();
},
changeDate(val) {
this.searchDate = val;
this.resetPage();
},
getSearchForm(val) {
let search = val || {};
this.handleSearchForm(search);
},
resetPage() {
this.$refs.Pagination.resetPage();
this.page.pageNo = 1;
this.getTableData();
},
tableChange(pageNo, pageSize) {
this.page = {
pageNo,
pageSize,
};
this.getTableData();
},
getDateFormat() {
let startDate = dayjs(this.searchDate[0]).valueOf();
let endDate = dayjs(`${this.searchDate[1]} 23:59:59`).valueOf();
return {
isFuzzy: 'N',
value: {
$gte: startDate,
$lt: endDate,
},
};
},
getTableData() {
let params = {
search: {
type: 'RD_Model_Info',
'is_valid': 'Y',
...this.searchForm,
'created_by_date':
this.searchDate && this.searchDate.length > 0 ? this.getDateFormat() : '',
},
page: this.page,
};
console.log("params",this.params);
this.loading = true;
getModelListAPI(params)
.then(res => {
if (res.success && res?.data) {
this.tableData = res.data || [];
this.total = res.total || 0;
}
})
.catch(() => {
// catch留空
})
.finally(() => {
this.loading = false;
});
},
closeDialog() {
this.currentData = {};
this.textareas = '';
this.showDialog = false;
},
deleteData(row) {
this.currentData = row;
this.showDialog = true;
},
submit() {
let params = {
id: this.currentData.id,
reason: this.textareas,
};
this.closeDialog();
this.loading = true;
deleteModelAPI(params)
.then(res => {
if (res.success) {
this.getTableData();
this.$message.success(this.$t('actionSuccess'));
}
})
.catch(resData => {
this.$message.error(resData.message);
})
.finally(() => {
this.loading = false;
});
},
syncData(row) {
let params = {
'task_type': 'SyncModelTree',
'task_param': JSON.stringify({ 'model_id': row.id }),
'task_name': row.name_cn,
};
this.loading = true;
syncModelInfoAPI(params)
.then(res => {
if (res.success) {
this.getTableData();
this.$message.success(this.$t('同步成功,请到任务管理查看任务进度'));
}
})
.catch(resData => {
this.$message.error(resData.message);
})
.finally(() => {
this.loading = false;
});
},
add() {
this.addTypeDialog = true;
},
addModel(val) {
this.addTypeDialog = false;
const url = {
'ILaunch': '/productMgmt/model/ILaunchModel',
'PDM': '/productMgmt/model/add',
};
this.$router.push(url[val]);
},
edit(row) {
let url =
row.bom_source === 'PDM' ? '/productMgmt/model/edit' : '/productMgmt/model/ILaunchModel';
this.$router.push({
path: url,
query: {
type: 'RD_Model_Info',
id: row.id,
},
});
},
viewLog(row) {
this.$router.push({
path: '/productMgmt/model/log',
query: {
type: 'RD_Model_Info',
id: row.id,
},
});
},
},
};
</script>
<style lang="less" scoped>
.content {
display: flex;
flex-direction: column;
height: 100% !important;
overflow: auto;
padding-bottom: 30px;
}
.title {
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
padding: 0 20px;
height: 54px;
line-height: 54px;
.text {
font-size: 16px;
color: #252b3a;
font-weight: Bold;
}
}
.data_list {
flex: 1;
margin: 0 20px 20px;
}
.table_data {
margin-top: 20px;
}
.table_expand {
position: sticky;
left: 20px;
width: 1600px;
margin-left: 20px;
border-left: 2px solid #5e7ce0;
box-shadow: -20px 0 #f2f5fc;
}
.dialog {
.dialog_footer {
text-align: center;
}
}
.add_dialog {
text-align: center;
}
</style>
这里打印params为undefined,但是预期应该有输入的search?.bom_code