| | |
| | | <el-row :gutter="5"> |
| | | <el-col :span="5"> |
| | | <div class="fa-card-a" style="margin-right: 5px;height: calc(100vh - 123px)"> |
| | | <product-model-tree @on-selected="onProductSelected" showXdy="true" ref="ProductModelTree"/> |
| | | <product-model-tree @on-selected="onProductSelected" @on-default="onDefault" showXdy="true" |
| | | ref="ProductModelTree"/> |
| | | </div> |
| | | </el-col> |
| | | <el-col :span="19"> |
| | | <div class="mod-basicInfo-xhProductModel fa-card-a" style="margin-left: 5px;"> |
| | | <zt-table-wraper ref="tableObj" defaultNotQuery="true" query-url="/basicInfo/XhProductModel/page" |
| | | <zt-table-wraper ref="tableObj" defaultNotQuery="true" query-url="/basicInfo/XhProductModel/page" |
| | | delete-url="/basicInfo/XhProductModel/ " |
| | | :paging='false' |
| | | v-slot="{ table }"> |
| | | v-slot="{ table }" @refreshMethod="refreshData('tree')"> |
| | | <el-form :inline="true" :model="dataForm" @keyup.enter.native="table.query()"> |
| | | <el-form-item> |
| | | <el-input v-model="dataForm.name" placeholder="请输入名称" clearable></el-input> |
| | |
| | | <el-form-item> |
| | | <zt-button v-if="productType && productType!=='10'" type="query" @click="table.query()"/> |
| | | <zt-button v-if="productType && productType!=='10'" type="add" @click="add()"/> |
| | | <zt-button v-if="productType==='1'" size="small" type="primary" @click="exportProduct()">下载导入模板 |
| | | </zt-button> |
| | | <zt-button v-if="productType==='3'" type="primary" @click="addCell()">新增虚单元</zt-button> |
| | | <zt-button v-if="productType && productType!=='10'" type="delete" @click="table.deleteHandle()"/> |
| | | </el-form-item> |
| | |
| | | <el-table v-loading="table.dataLoading" :data="table.dataList" height="100px" v-adaptive="{bottomOffset:30}" |
| | | row-key="id" |
| | | @selection-change="table.selectionChangeHandle" |
| | | > |
| | | :header-cell-style="{'text-align':'center'}"> |
| | | <el-table-column type="selection" width="40" align="center"/> |
| | | <el-table-column prop="name" label="名称"/> |
| | | <el-table-column v-if="productType==='3'|| productType==='4'" prop="equipType" label="设备类型"/> |
| | | <zt-table-column-dict prop="productType" label="节点类型" dict="product"/> |
| | | <el-table-column prop="operatImg" label="运行图片" align="center"> |
| | | <template v-slot="{ row }"> |
| | | <el-image v-if="row.operatImg" :src="url+row.operatImg" style="height: 50px;width: 50px"></el-image> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="sort" label="排序" width="100px"/> |
| | | <zt-table-column-handle :table="table" width="150px"/> |
| | | <el-table-column prop="sort" label="排序" width="100px" align="center"/> |
| | | <zt-table-column-handle :table="table" width="180px" > |
| | | <template v-slot="{ row }"> |
| | | <zt-table-button v-if="productType==='1'" size="small" type="primary" |
| | | @click="importData(row)">导入 |
| | | </zt-table-button> |
| | | <zt-table-button v-if="productType==='1'" size="small" type="primary" |
| | | @click="exportData(row)">导出 |
| | | </zt-table-button> |
| | | </template> |
| | | </zt-table-column-handle> |
| | | </el-table> |
| | | <!-- 弹窗, 新增 / 修改 --> |
| | | <add-or-update @refreshDataList="refreshData" ref="AddOrUpdate"/> |
| | | <select-ty-model @refreshDataList="refreshData" ref="SelectTyModel"/> |
| | | <add-or-update @refreshDataList="refreshData('product')" ref="AddOrUpdate"/> |
| | | <select-ty-model @refreshDataList="refreshData('tree')" ref="SelectTyModel"/> |
| | | <product-import @refreshDataList="refreshData('import')" ref="ProductImport"/> |
| | | </zt-table-wraper> |
| | | </div> |
| | | </el-col> |
| | |
| | | import ProductModelTree from "./ProductModelTree"; |
| | | import Cookies from "js-cookie"; |
| | | import TyProductModel from "./TyProductModel-AddOrUpdate"; |
| | | import ProductImport from "./ProductImport"; |
| | | import qs from 'qs' |
| | | |
| | | export default { |
| | | data() { |
| | | return { |
| | | url: `${window.SITE_CONFIG['apiURL']}/sysPictureBase/getSvgImage?token=${Cookies.get('token')}&id=`, |
| | | productType: '', |
| | | shipId: '', |
| | | namePath:'', |
| | | dataForm: { |
| | | name: '', |
| | | type:'', |
| | | type: '', |
| | | pid: '', |
| | | srcId:'', |
| | | } |
| | | srcId: '', |
| | | }, |
| | | productType:'' |
| | | } |
| | | }, |
| | | components: { |
| | | ProductImport, |
| | | TyProductModel, |
| | | ProductModelTree, |
| | | AddOrUpdate, |
| | | SelectTyModel |
| | | }, |
| | | mounted() { |
| | | this.$refs.ProductModelTree.getProductList() |
| | | }, |
| | | methods: { |
| | | add() { |
| | | this.dataForm.type=this.productType |
| | | if (this.dataForm.type !== '3') { |
| | | console.log(1111) |
| | | console.log(this.dataForm.type,'add() {') |
| | | this.dataForm.type = this.dataForm.type - 1 |
| | | } else if (this.dataForm.type === '3') { |
| | | console.log(2222) |
| | | console.log(this.dataForm.type,'add() {') |
| | | this.dataForm.type = this.dataForm.type - 2 |
| | | }else if (this.dataForm.type === '0'){ |
| | | console.log(this.dataForm.type,'add() {') |
| | | this.$alert("当前节点不可新增子节点,请重新设置") |
| | | return |
| | | this.dataForm.type = this.productType |
| | | |
| | | if (this.dataForm.type !== '1') { |
| | | /*this.$refs.SelectTyModel.$refs.dialog.init(null, { |
| | | type: this.dataForm.type, |
| | | id: this.dataForm.pid, |
| | | shipId: this.shipId, |
| | | namePath: this.namePath |
| | | })*/ |
| | | this.$refs.AddOrUpdate.$refs.dialog.init(null, {id: null, productType: parseInt(this.dataForm.type)+1 , pid: this.dataForm.pid,shipId: this.shipId,namePath: this.namePath}) |
| | | } else { |
| | | this.$refs.AddOrUpdate.$refs.dialog.init(null, {id: null, type: 'zt', pid: this.dataForm.pid,shipId: this.shipId}) |
| | | } |
| | | this.$refs.SelectTyModel.$refs.dialog.init(null,{type:this.dataForm.type,id:this.dataForm.pid}) |
| | | }, |
| | | addCell(){ |
| | | this.$refs.AddOrUpdate.$refs.dialog.init(null,{type:10,pid:this.dataForm.pid}) |
| | | addCell() { |
| | | this.$refs.AddOrUpdate.$refs.dialog.init(null, { |
| | | type: 10, pid: this.dataForm.pid, shipId: this.shipId |
| | | }) |
| | | }, |
| | | cellStyle({column}) { |
| | | if (column.label === '名称') { |
| | | return 'text-align: left !important;' |
| | | } |
| | | }, |
| | | refreshData(){ |
| | | this.$refs.tableObj.query() |
| | | this.$refs.ProductModelTree.getProductList() |
| | | refreshData(param) { |
| | | if (param === 'import') { |
| | | this.$refs.tableObj.query() |
| | | this.$refs.ProductModelTree.getProductList() |
| | | } else if (param === 'tree') { |
| | | this.$refs.ProductModelTree.getProductList() |
| | | } else { |
| | | this.$refs.tableObj.query() |
| | | } |
| | | }, |
| | | onProductSelected(data) { |
| | | console.log(data) |
| | | this.shipId = data.shipId |
| | | this.dataForm.pid = data.id |
| | | this.dataForm.type = data.productType |
| | | this.productType = data.productType |
| | | if(data.productType!=='10'){ |
| | | this.namePath = data.namePath |
| | | console.log(data.namePath,'data.namePath') |
| | | if (data.productType !== '10') { |
| | | this.$refs.tableObj.query() |
| | | }else{ |
| | | this.$alert("虚单元不可查看") |
| | | } |
| | | } |
| | | }, |
| | | importData(row) { |
| | | this.$refs.ProductImport.$refs.dialog.init(row) |
| | | }, |
| | | async exportData(row) { |
| | | console.log(row) |
| | | let params = qs.stringify({ |
| | | 'token': Cookies.get('token'), |
| | | shipId:row.id, |
| | | fileName:row.name |
| | | }) |
| | | let apiURL = `/basicInfo/XhProductModel/exportData` |
| | | window.location.href = `${window.SITE_CONFIG['apiURL']}${apiURL}?${params}` |
| | | }, |
| | | exportProduct() { |
| | | window.location.href = './产品结构树导入模板.xlsx' |
| | | }, |
| | | onDefault(defaultId) { |
| | | this.dataForm.pid = defaultId |
| | | this.dataForm.type = '1' |
| | | this.productType = '1' |
| | | this.$refs.tableObj.query() |
| | | }, |
| | | } |
| | | } |
| | | </script> |