From dcf9c9e0410fe1186239e3f8d6f7bdc789c08010 Mon Sep 17 00:00:00 2001 From: lzhe <lzhe@example.com> Date: 星期三, 05 六月 2024 18:00:39 +0800 Subject: [PATCH] 1 --- src/views/console/tooling/fixture.vue | 452 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 449 insertions(+), 3 deletions(-) diff --git a/src/views/console/tooling/fixture.vue b/src/views/console/tooling/fixture.vue index 01c790d..3217e4a 100644 --- a/src/views/console/tooling/fixture.vue +++ b/src/views/console/tooling/fixture.vue @@ -1,13 +1,459 @@ +<!-- + * @Date: 2024-05-12 20:02:31 + * @LastEditors: Sneed + * @LastEditTime: 2024-05-16 22:07:06 + * @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/console/tooling/fixture.vue +--> <template> - <div> + <el-container> + <el-aside width="200px"> + <el-container> + <el-main> + <el-tree default-expand-all ref="group" node-key="id" :data="treeData" :props="{ + label: 'name', + disabled: 'isGroup' + }" @node-click="nodeClick"> + <template #default="{ node, data }"> + <div :class="data.isGroup ? 'active' : ''" class="custom-tree-node"> + <span>{{ node.label || data.code }}</span> + <el-icon class="icon" @click.stop="renameArea(data)" v-if="data.id > 200" + style="margin-left: auto;margin-right: 4px;"> + <ElIconEditPen /> + </el-icon> + <el-popconfirm title="纭畾鍒犻櫎鍚楋紵" @confirm="delArea(data)"> + <template #reference> + <el-icon class="icon" v-if="data.id > 200"> + <ElIconDelete /> + </el-icon> + </template> + </el-popconfirm> - </div> + </div> + </template> + </el-tree> + </el-main> + <el-footer> + <el-button type="primary" @click="addTrayGroup">娣诲姞澶瑰叿缁�</el-button> + </el-footer> + </el-container> + </el-aside> + <!-- <el-main> --> + <el-container v-if="selectNode.id"> + <el-header> + <el-button @click="table_add" type="primary" icon="el-icon-plus"></el-button> + <import-table style="margin:0 8px" exportUrl="/api/blade-cps/fixture/export/template" + uploadUrl="/api/blade-cps/fixture/import-fixture"></import-table> + <el-popconfirm title="纭畾鍒犻櫎鍚楋紵" @confirm="del(selection, '0')"> + <template #reference> + <el-button type="danger" :disabled="selection.length === 0" plain icon="el-icon-delete" + @click="batchDel"></el-button> + </template> + </el-popconfirm> + + <el-input v-model="params.keyword" style="width: 240px;margin-left: auto;" placeholder="璇疯緭鍏ユ绱㈠唴瀹�" + clearable></el-input> + <el-button @click="search" type="primary" icon="el-icon-search"></el-button> + + </el-header> + <el-main> + <el-row :gutter="20"> + <el-col :span="10"> + <scTable highlight-current-row @dataChange="dataChange" @row-click="rowClick" ref="table" + :params="params" :apiObj="apiObj" @selection-change="selectionChange" stripe> + <el-table-column type="selection" width="50"></el-table-column> + <el-table-column label="澶瑰叿缂栧彿" prop="code" width="120"></el-table-column> + <el-table-column label="澶瑰叿鍚嶇О" prop="name" width="120"></el-table-column> + <el-table-column label="澶瑰叿鐘舵��" prop="fixtureStatus" width="120"> + <template #default="scope"> + <span> + {{ scope.row.fixtureStatus === 1 ? '婵�娲�' : '鍐荤粨' }} + </span> + </template> + </el-table-column> + <el-table-column label="鎿嶄綔" fixed="right" align="right" width="160"> + <template #default="scope"> + <el-button-group> + <el-button text type="primary" size="small" + @click="table_edit(scope.row, scope.$index)">缂栬緫</el-button> + <el-popconfirm title="纭畾鍒犻櫎鍚楋紵" @confirm="del([scope.row], '0')"> + <template #reference> + <el-button text type="primary" size="small">鍒犻櫎</el-button> + </template> + </el-popconfirm> + </el-button-group> + </template> + </el-table-column> + </scTable> + </el-col> + <el-col :span="14" v-loading="showLoading"> + <h2>鎵樼洏淇℃伅</h2> + <div class="tuopan-info"> + <el-row> + <el-col :span="12"> + 澶瑰叿缂栧彿: {{ info.code }} + </el-col> + <el-col :span="12"> + 澶瑰叿鍚嶇О: {{ info.name || '-' }} + </el-col> + <el-col :span="12"> + 澶瑰叿鐘舵��: {{ info.fixtureStatus === 1 ? '婵�娲�' : '鍐荤粨' }} + </el-col> + <el-col :span="12"> + 澶瑰叿缁�: {{ info.fixtureGroupName || '-' }} + </el-col> + <el-col :span="12"> + 澶瑰叿鎻忚堪: {{ info.description || '-' }} + </el-col> + </el-row> + </div> + + <h2 style="margin:14px 0;">鍏宠仈鎵樼洏</h2> + <!-- <div> + <el-button type="primary" size="small" @click="addTray">鏂板缓鎵樼洏闈�</el-button> + </div> --> + <el-table :data="infoList" style="width: 100%" stripe> + <el-table-column label="鎵樼洏缂栧彿" prop="trayCode"></el-table-column> + <el-table-column label="鎵樼洏鍚嶇О" prop="trayName"></el-table-column> + <el-table-column label="鎿嶄綔" fixed="right" align="right" width="160"> + <template #default="scope"> + <el-button-group> + <el-popconfirm title="纭畾鍒犻櫎鍚楋紵" @confirm="table_del1(scope.row, '0')"> + <template #reference> + <el-button text type="primary" size="small">鍒犻櫎</el-button> + </template> + </el-popconfirm> + </el-button-group> + </template> + </el-table-column> + </el-table> + </el-col> + </el-row> + </el-main> + </el-container> + <el-dialog v-model="visibleGroup" title="鎵樼洏缁�" width="500"> + <el-form :model="formGroup" :rules="rulesGroup" ref="dialogForm" label-width="120px" + label-position="center"> + <el-form-item v-if="!formGroup.id" label="涓婄骇鐩綍"> + <el-input disabled v-model="selectNode.name" /> + </el-form-item> + <el-form-item label="澶瑰叿缁勫悕绉�"> + <el-input v-model="formGroup.name" /> + </el-form-item> + </el-form> + <template #footer> + <div class="dialog-footer"> + <el-button type="primary" @click="saveGroup"> + 纭畾 + </el-button> + </div> + </template> + </el-dialog> + <el-drawer v-model="dialog" title="鎵樼洏淇℃伅" class="demo-drawer"> + <el-container> + <el-main> + <el-form :model="trayForm" :rules="rulesTray" ref="trayForm" label-width="120px"> + <el-form-item label="澶瑰叿缁�" prop="fixtureGroupId"> + <el-tree-select v-model="trayForm.fixtureGroupId" @node-click="groupIdClick" node-key="id" + :data="treeData" filterable style="width: 240px" :props="{ + label: 'name', + }" /> + </el-form-item> + <el-form-item v-if="trayForm.code" label="澶瑰叿缂栧彿" prop="code"> + <el-input style="width: 240px" v-model="trayForm.code" /> + </el-form-item> + <el-form-item label="澶瑰叿鍚嶇О" prop="name"> + <el-input style="width: 240px" v-model="trayForm.name" /> + </el-form-item> + <el-form-item label="澶瑰叿鐘舵��" prop="fixtureStatus"> + <el-select style="width: 240px" v-model="trayForm.fixtureStatus" placeholder=""> + <el-option label="婵�娲�" :value="1" /> + <el-option label="鍐荤粨" :value="0" /> + </el-select> + </el-form-item> + <el-form-item label="澶瑰叿鎻忚堪" prop="description"> + <el-input style="width: 240px" type="textarea" v-model="trayForm.description" /> + </el-form-item> + <el-form-item label="鍥剧墖" prop="avatar"> + <scUpload v-model="trayForm.avatar" title=""></scUpload> + </el-form-item> + <el-form-item label="鍏宠仈鎵樼洏闈�"> + <el-select style="width: 120px" v-model="trayForm.trayId" placeholder=""> + <el-option v-for="item in trayId" :key="item.id" :label="item.code" :value="item.id" /> + </el-select> + <el-select style="width: 120px" v-model="trayForm.surfaceId" placeholder=""> + <el-option v-for="item in surfaceId" :key="item.id" :label="item.name" + :value="item.id" /> + </el-select> + </el-form-item> + <el-form-item label="鍏宠仈鎵樻枃妗�" prop="surfaceId"> + + </el-form-item> + </el-form> + </el-main> + <el-footer style="text-align: right"> + <el-button type="primary" @click="confirm"> + 纭畾 + </el-button> + </el-footer> + </el-container> + </el-drawer> + </el-container> </template> <script> +import importTable from '@/layout/components/importTable.vue' export default { + components: { + importTable + }, + data() { + return { + treeData: [], + visibleGroup: false, + formGroup: {}, + rulesGroup: { + name: [ + { required: true, message: '蹇呭~' } + ], + }, + params: { + keyword: '', + }, + info: {}, + infoList: [], + selectNode: {}, + apiObj: { + get: async (data) => { + let params = { + ...data, + groupId: this.selectNode.id, + ...this.params + } + return await this.$HTTP.get(`/api/blade-cps/fixture/page`, {}, { params }).then(res => { + return res + }) + } + }, + showLoading: false, + dialog: false, + trayForm: {}, + rulesTray: { + fixtureGroupId: [ + { required: true, message: '蹇呭~' } + ], + fixtureStatus: [ + { required: true, message: '蹇呭~' } + ], + name: [ + { required: true, message: '蹇呭~' } + ], + }, + trayId: [], + surfaceId: [], + selection: [] + } + }, + watch: { + 'selectNode.id': { + handler(val) { + this.info = {} + this.infoList = [] + if (val) { + this.queryInfo() + } + } + }, + 'trayForm.trayId': { + handler(val) { + if (val) { + this.$HTTP.get(`/api/blade-cps/tray-surface/list/${val}`).then(res => { + this.surfaceId = res.data + if (!this.surfaceId.find(v => v.id === this.trayForm.surfaceId)) { + this.trayForm.surfaceId = '' + } + }) + } else { + this.trayForm.surfaceId = '' + this.surfaceId = [] + } + } + } + }, + created() { + this.init() + this.$HTTP.post(`/api/blade-cps/tray/list`).then(res => { + this.trayId = res.data + }) + }, + methods: { + selectionChange(selection) { + this.selection = selection + }, + addTrayGroup() { + console.log(this.selectNode) + this.formGroup = {} + this.visibleGroup = true + }, + renameArea(data) { + this.formGroup = { + ...data + } + this.visibleGroup = true + }, + delArea(data) { + this.$HTTP.delete(`/api/blade-cps/tray/remove-tree?id=${data.id}`).then(res => { + this.init() + }) + }, + saveGroup() { + if (!this.formGroup.id) { + this.$HTTP.post(`/api/blade-cps/group`, { + groupCategory: 1, + groupType: "group_fixture", + parentId: this.selectNode.id, + ...this.formGroup + }).then(res => { + this.visibleGroup = false + this.init() + }) + } else { + this.$HTTP.put(`/api/blade-cps/group`, { + groupCategory: 1, + groupType: "group_fixture", + parentId: this.selectNode.id, + ...this.formGroup + }).then(res => { + this.visibleGroup = false + this.init() + }) + } + + }, + search() { + this.$refs.table.reload(this.params) + }, + table_add() { + this.trayForm = { + fixtureGroupId: this.selectNode.id, + fixtureStatus: 1, + } + this.dialog = true + }, + table_edit(row) { + this.trayForm = { + ...row + } + this.dialog = true + }, + groupIdClick(node) { + this.trayForm.fixtureGroupId = node.id + }, + confirm() { + if (this.trayForm.id) { + return this.$HTTP.put(`/api/blade-cps/fixture/update`, { + ...this.trayForm + }).then(res => { + this.dialog = false + this.queryInfo() + }) + } + this.$HTTP.post(`/api/blade-cps/fixture/${this.trayForm.fixtureGroupId}/insert`, { + ...this.trayForm + }).then(res => { + this.dialog = false + this.queryInfo() + }) + }, + del(ids) { + this.$HTTP.delete(`/api/blade-cps/fixture/remove`, ids.map(v => v.id)).then(res => { + this.queryInfo() + }) + }, + init() { + this.$HTTP.post(`/api/blade-cps/tray/tooling-tree`, { + groupCategory: 1, + groupType: "group_fixture" + }).then(res => { + this.treeData = res.data + this.selectNode = res.data[0] + }) + }, + queryInfo() { + if (!this.selectNode.id) return + this.$refs?.table?.reload() + // this.$HTTP.get(`/api/blade-cps/tray/${this.selectNode.id}`).then(res => { + // this.info = res.data + // }) + // this.$HTTP.get(`/api/blade-cps/tray-surface/list/${this.selectNode.id}`).then(res => { + // this.info = res.data + // }) + }, + dataChange(res, data) { + data?.[0] && this.rowClick(data?.[0]) + }, + rowClick(row) { + console.log(row.id) + this.queryChildInfo(row.id) + }, + async queryChildInfo(id) { + if (!id) return + this.showLoading = true + await this.$HTTP.get(`/api/blade-cps/fixture/get/${id}`).then(res => { + this.info = res.data + this.infoList = [ + { + othersId: res.data.id, + id: res.data.trayFixtureId, + trayFixtureId: res.data.trayFixtureId, + trayCode: res.data.trayCode, + trayName: res.data.trayName, + } + ] + }) + // await this.$HTTP.get(`/api/blade-cps/tray-surface/list/${id}`).then(res => { + // this.infoList = res.data + // }) + this.showLoading = false + }, + nodeClick(node) { + this.selectNode = node + }, + table_del1(row) { + this.$HTTP.delete(`/api/blade-cps/tray-fixture`, [{ id: row.id, othersId: row.othersId }]).then(res => { + this.$message.success('鎿嶄綔鎴愬姛') + this.queryChildInfo(this.info.id) + }) + }, + } } </script> -<style lang="scss" scoped></style> \ No newline at end of file +<style lang="scss" scoped> +.custom-tree-node.active { + color: #ccc; +} + +.custom-tree-node { + width: 100%; + display: flex; + + .icon { + visibility: hidden; + } +} + +.custom-tree-node:hover { + .icon { + visibility: visible; + } +} + +.empty { + justify-content: center; +} + +.tuopan-info { + display: flex; +} +</style> \ No newline at end of file -- Gitblit v1.9.3