From 58ae0bd3c638577ec29685cb97b2556fb2f5a9f2 Mon Sep 17 00:00:00 2001
From: Fixiaobai <fixiaobai@163.com>
Date: 星期日, 24 九月 2023 10:50:12 +0800
Subject: [PATCH] modified: src/components/view/processInspection.vue
---
src/components/view/record-content.vue | 703 +++++++++++++++++++++++++++++++++++++++++++--------------
1 files changed, 524 insertions(+), 179 deletions(-)
diff --git a/src/components/view/record-content.vue b/src/components/view/record-content.vue
index 88d9fb3..5e5946f 100644
--- a/src/components/view/record-content.vue
+++ b/src/components/view/record-content.vue
@@ -1,3 +1,476 @@
+<template>
+ <div class="record_content">
+ <div class="title">
+ <el-row>
+ <el-col :span="12" style="line-height: 32px;">鐢熶骇璁板綍缁存姢</el-col>
+ <el-col :span="12" style="text-align: right;">
+ <el-button type="primary" icon="el-icon-plus" style="background: #004EA2;" @click="addend">鏂板</el-button>
+ <el-button icon="el-icon-delete" @click="dels">鍒犻櫎</el-button>
+ </el-col>
+ </el-row>
+ </div>
+ <div class="choose">
+ <span>绫诲瀷锛�</span>
+ <el-select v-model="search.type" size="small" @change="TYpe" placeholder="璇烽�夋嫨"
+ style="width: 224px;margin-right: 30px;">
+ <el-option v-for="(a, ai) in bigType" :key="ai" :value="a"></el-option>
+ </el-select>
+ </div>
+ <div class="thing">
+ <div class="left">
+ <el-input v-model="search.technology" suffix-icon="el-icon-search" placeholder="璇疯緭鍏ユ悳绱㈠唴瀹�" size="small" clearable
+ @input="query"></el-input>
+ <el-tree :data="list" ref="tree" :props="{children: 'children',label: 'name'}" node-key="name"
+ default-expand-all @node-click="handleNodeClick" highlight-current :key="upIndex" style="padding-top: 8px;">
+ <div class="custom-tree-node" slot-scope="{ node, data }">
+ <span><i :class="`node_i ${data.code != '[2]'?'el-icon-folder-opened':'el-icon-tickets'}`"></i>
+ {{ data.code }}{{ data.name }}</span>
+ </div>
+ </el-tree>
+ </div>
+ <div class="right">
+ <el-table :data="tableData" border style="width: 100%;overflow-y: auto;min-height: 100%" max-height="100%"
+ @selection-change="handleSelectionChange" default-expand-all>
+ <el-table-column type="selection" width="50">
+ </el-table-column>
+ <el-table-column type="index" label="搴忓彿" width="70">
+ </el-table-column>
+ <el-table-column prop="name" label="璁板綍鍐呭">
+ </el-table-column>
+ <el-table-column prop="unit" label="鍗曚綅">
+ </el-table-column>
+ <el-table-column prop="note" label="澶囨敞">
+ </el-table-column>
+ <el-table-column label="鎿嶄綔" width="130">
+ <template slot-scope="scope">
+ <span class="table_do" @click="upContent(scope.row)">缂栬緫 </span>
+ <span class="table_do" @click="deleteRow(scope.$index, scope.row)">鍒犻櫎</span>
+ </template>
+ </el-table-column>
+ </el-table>
+ </div>
+ </div>
+ <el-dialog title="缂栬緫璁板綍鍐呭" :visible.sync="upDia" width="500px">
+ <div class="body">
+ <el-row style="line-height: 46px;">
+ <el-col :span="4" style="font-size: 14px;text-align: right;">绫诲瀷:</el-col>
+ <el-col :span="16" :offset="1">
+ <template>
+ <el-select v-model="edit.type" disabled placeholder="璇烽�夋嫨" style="width: 310px;">
+ <el-option v-for="(a, ai) in bigType" :key="ai" :value="a"></el-option>
+ </el-select>
+ </template>
+ </el-col>
+ </el-row>
+ <el-row style="line-height: 46px;">
+ <el-col :span="4" style="font-size: 14px;text-align: right;">宸ュ簭:</el-col>
+ <el-col :span="16" :offset="1">
+ <template>
+ <el-select v-model="edit.techFather" placeholder="璇烽�夋嫨" disabled @change="workevent" style="width: 310px;">
+ <el-option v-for="item in process" :key="item.name" :label="item.name" :value="item.name">
+ </el-option>
+ </el-select>
+ </template>
+ </el-col>
+ </el-row>
+ <el-row style="line-height: 46px;">
+ <el-col :span="4" style="font-size: 14px;text-align: right;">宸ヨ壓:</el-col>
+ <el-col :span="16" :offset="1">
+ <template>
+ <el-select v-model="edit.techName" disabled placeholder="璇烽�夋嫨" style="width: 310px;">
+ <el-option v-for="item in craftapi" :key="item.id" :label="item.name" :value="item.id">
+ </el-option>
+ </el-select>
+ </template>
+ </el-col>
+ </el-row>
+ <el-row style="line-height: 46px;">
+ <el-col :span="4" style="font-size: 14px;text-align: right;">璁板綍鍐呭:</el-col>
+ <el-col :span="16" :offset="1">
+ <el-input v-model="upData.name" size="small" clearable></el-input>
+ </el-col>
+ </el-row>
+ <el-row style="line-height: 46px;">
+ <el-col :span="4" style="font-size: 14px;text-align: right;">鍗曚綅:</el-col>
+ <el-col :span="16" :offset="1">
+ <el-input v-model="upData.unit" size="small" clearable></el-input>
+ </el-col>
+ </el-row>
+ <el-row style="line-height: 46px;">
+ <el-col :span="4" style="font-size: 14px;text-align: right;">澶囨敞:</el-col>
+ <el-col :span="16" :offset="1">
+ <el-input v-model="upData.note" size="small" clearable></el-input>
+ </el-col>
+ </el-row>
+ </div>
+ <span slot="footer" class="dialog-footer">
+ <el-button type="primary" @click="submitUpData">纭� 瀹�</el-button>
+ <el-button @click="upDia = false">鍙� 娑�</el-button>
+ </span>
+ </el-dialog>
+ <!-- 鏂板寮圭獥 -->
+ <el-dialog title="鐢熶骇璁板綍鏂板" :visible.sync="dialogVisible" :rules="Rules" ref="ruleForm" width="35%">
+ <div>
+ <el-form ref="form" :model="form" label-width="80px">
+ <el-form-item label="绫诲瀷" prop="type">
+ <template>
+ <el-select v-model="form.type" @change="edittype" placeholder="璇烽�夋嫨" style="width: 100%;">
+ <el-option v-for="(a, ai) in bigType" :key="ai" :value="a"></el-option>
+ </el-select>
+ </template>
+ </el-form-item>
+ <el-form-item label="宸ュ簭" prop="work">
+ <template>
+ <el-select v-model="form.work" @change="workevent" placeholder="璇烽�夋嫨" style="width: 100%;">
+ <el-option v-for="item in process" :key="item.name" :label="item.name" :value="item.name">
+ </el-option>
+ </el-select>
+ </template>
+ </el-form-item>
+ <el-form-item label="宸ヨ壓鍚嶇О" prop="name">
+ <template>
+ <el-select v-model="form.craft" placeholder="璇烽�夋嫨" style="width: 100%;">
+ <el-option v-for="item in craftapi" :key="item.id" :label="item.name" :value="item.id">
+ </el-option>
+ </el-select>
+ </template>
+ </el-form-item>
+ <el-form-item label="璁板綍" prop="record">
+ <el-input v-model="form.record"></el-input>
+ </el-form-item>
+ <el-form-item label="澶囨敞">
+ <el-input v-model="form.remarks"></el-input>
+ </el-form-item>
+ <el-form-item label="鍗曚綅" prop="unit">
+ <el-input v-model="form.unit"></el-input>
+ </el-form-item>
+ </el-form>
+ </div>
+ <span slot="footer" class="dialog-footer">
+ <el-button type="primary" @click="add(form)">纭� 瀹�</el-button>
+ <el-button @click="dialogVisible = false">鍙� 娑�</el-button>
+ </span>
+ </el-dialog>
+ </div>
+</template>
+
+<script>
+ export default {
+ data() {
+ var checktype = (rule, value, callback) => {
+ if (!value) {
+ return callback(new Error('绫诲瀷涓嶈兘涓虹┖'));
+ } else {
+ return callback
+ }
+ };
+ return {
+ search: {
+ type: 0,
+ technology: null
+ },
+ options: [],
+ value: {},
+ craftapi: [],
+ form: {
+ type: '',
+ work: '',
+ craft: '',
+ name: '',
+ record: '',
+ remarks: '',
+ unit: '',
+ },
+ Rules: {
+ type: {
+ validator: checktype,
+ required: true,
+ message: '绫诲瀷涓嶈兘涓虹┖',
+ trigger: 'change'
+ },
+ work: {
+ required: true,
+ message: '宸ュ簭涓嶈兘涓虹┖',
+ trigger: 'change'
+ },
+ name: {
+ required: true,
+ message: '宸ヨ壓涓嶈兘涓虹┖',
+ trigger: 'change'
+ },
+ record: {
+ required: true,
+ message: '璁板綍涓嶈兘涓虹┖',
+ trigger: 'blur'
+ },
+ unit: {
+ required: true,
+ message: '鍗曚綅涓嶈兘涓虹┖',
+ trigger: 'blur'
+ },
+ },
+ modifyVisible: false,
+ dialogVisible: false,
+ process: {},
+ list: [],
+ tableData: [],
+ upIndex: 0,
+ selects: [],
+ delete: [],
+ typeselect: 0,
+ upDia: false,
+ checkTreeNode: {
+ id: '',
+ },
+ upData: {
+ name: '',
+ unit: '',
+ note: '',
+ },
+ edit: {
+ name: '',
+ note: '',
+ techFather: '',
+ techName: '',
+ type: '',
+ unit: '',
+ },
+ bigType: []
+ }
+ },
+ mounted() {
+ this.chooseType()
+ },
+ methods: {
+ chooseType() {
+ this.$axios.get(this.$api.url.chooseType).then(res => {
+ this.bigType = res.data
+ this.typeselect = res.data[0]
+ this.search.type = res.data[0]
+ this.selectAllleft()
+ this.selectjilu()
+ })
+ },
+ delQueById() {
+ this.$axios.get(this.$api.url.delQueById, )
+ },
+ childrenClick() {},
+ TYpe(val) {
+ this.typeselect = val
+ this.selectAllleft()
+ },
+ edittype(val) {
+ this.typeselect = val
+ this.chooseTechFath()
+ },
+ //鏂板
+ workevent(val) {
+ let idx = this.process.findIndex(el => el.name === val)
+ this.craftapi = this.process[idx].children
+ },
+ chooseTechFath() {
+ this.$axios.get(this.$api.url.chooseTechFath, {
+ params: {
+ type: this.typeselect
+ }
+ }).then(res => {
+ this.process = res.data;
+ }, {
+ headers: {
+ "Content-Type": "application/json"
+ }
+ }).then(res => {
+
+ })
+ },
+ addRecord() {
+ this.$axios.post(this.$api.url.addRecord, {
+ name: this.form.record,
+ note: this.form.remarks,
+ techTemId: this.form.craft,
+ unit: this.form.unit,
+ }, {
+ headers: {
+ "Content-Type": "application/json"
+ }
+ }).then(res => {
+ this.$message.success('娣诲姞鎴愬姛')
+ this.selectjilu()
+ })
+ },
+ add(formName) {
+ this.dialogVisible = false
+ this.addRecord()
+ this.form = {};
+ },
+ query() {
+ this.selectAllleft()
+ },
+ //涓讳綋宸�
+ selectAllleft() {
+ this.$axios.get(this.$api.url.selectAllleft, {
+ params: {
+ type: this.typeselect,
+ message: this.search.technology
+ }
+ }).then(res => {
+ this.list = res.data;
+ this.selectDataList()
+ this.$nextTick(() => {
+ this.$refs.tree.setCurrentKey(this.list[0].children[0].name) // 榛樿閫変腑鑺傜偣绗竴涓�
+ })
+ let one = this.list.filter(item => {
+ return item.children.length > 0
+ })[0]
+ let name = one.children[0].id
+ this.checkTreeNode.id = name
+ this.selectjiluStart(name)
+ this.selectDataList();
+ });
+ },
+ //榛樿
+ selectjiluStart(name) {
+ this.$axios.get(this.$api.url.selectjilu, {
+ params: {
+ id: name
+ }
+ }).then(res => {
+ this.tableData = res.data;
+ })
+ },
+ //selectjilu checkTreeNode
+ selectjilu() {
+ this.$axios.get(this.$api.url.selectjilu, {
+ params: {
+ id: this.checkTreeNode.id
+ }
+ }).then(res => {
+ this.tableData = res.data;
+ })
+ },
+ modify() {
+ this.modifyVisible = true
+ },
+ addend() {
+ this.dialogVisible = true
+ this.chooseTechFath()
+ },
+ filterNode(value, data) {
+ if (!value) return true;
+ return data.name.indexOf(value) !== -1;
+ },
+ remove(node, data) {
+ this.$confirm("鏄惁鍒犻櫎", "璀﹀憡", {
+ type: "warning"
+ }).then(res => {
+ const parent = node.parent;
+ const children = parent.data.children || parent.data;
+ const index = children.findIndex(d => d.id === data.id);
+ children.splice(index, 1);
+ }).catch(e => {})
+ },
+ selectDataList() {
+ this.list.forEach(a => {
+ a.code = '[1]'
+ if (a.children != undefined) {
+ a.children.forEach(b => {
+ b.code = '[2]'
+ if (b.children != undefined) {
+ b.children.forEach(c => {
+ c.code = '[3]'
+ })
+ }
+ })
+ }
+ })
+ this.upIndex++
+ },
+ handleNodeClick(data) {
+ if(data.code != '[2]') return
+ this.checkTreeNode = data
+ this.selectjilu()
+ },
+ nodeOpen(data, node, el) {
+ $($(el.$el).find('.node_i')[0]).attr('class', 'node_i el-icon-folder-opened')
+ },
+ nodeClose(data, node, el) {
+ $($(el.$el).find('.node_i')[0]).attr('class', 'node_i el-icon-folder')
+ },
+ handleSelectionChange(val) {
+ this.selects = val;
+ },
+ dels() {
+ this.selects.forEach(a => {
+ for (var b = 0; b < this.tableData.length; b++) {
+ if (this.tableData[b].id == a.id) {
+ this.tableData.splice(b, 1)
+ b--
+ }
+ }
+ })
+ let cc = this.selects.map(el => {
+ return el.id
+ })
+ this.delete = cc.join(',')
+ this.delAllRecord()
+ this.$message.success('鍒犻櫎瀹屾垚')
+ },
+ //鎵归噺鍒犻櫎
+ delAllRecord() {
+ this.$axios.post(this.$api.url.delAllRecord, {
+ ids: this.delete
+ })
+ },
+
+ //鍒犻櫎
+ delQueByIdapi() {
+ this.$axios.post(this.$api.url.delQueByIdapi, {
+ id: this.upData.id
+ })
+ },
+ deleteRow(index, rows) {
+ this.tableData.splice(index, 1)
+ this.upData.id = rows.id
+ this.delQueByIdapi()
+ },
+ //缂栬緫
+ upContent(ob) {
+ this.upData = ob
+ this.selecRecord()
+ this.upDia = true
+ },
+ selecRecord() {
+ this.$axios.get(this.$api.url.selecRecord, {
+ params: {
+ id: this.upData.id
+ }
+ }).then(res => {
+ this.edit = res.data[0]
+ })
+ },
+ writeRecordById() {
+ this.$axios.post(this.$api.url.writeRecordById + '?id=' + this.upData.id, {
+ name: this.upData.name,
+ note: this.upData.note,
+ techTemId: this.edit.id,
+ unit: this.upData.unit
+ }, {
+ headers: {
+ "Content-Type": "application/json"
+ }
+ }).then(res => {
+ this.selectjilu()
+ })
+ },
+ submitUpData() {
+ this.writeRecordById()
+ this.$message.success('淇敼鎴愬姛')
+ this.upDia = false
+ }
+ }
+ }
+</script>
+
<style scoped>
.title .el-button {
height: 32px;
@@ -35,11 +508,51 @@
}
.thing {
- width: calc(100% - 44px);
- height: calc(100% - 42px - 82px - 66px);
+ width: 100%;
+ height: calc(100% - 120px);
background-color: #fff;
- overflow: auto;
- padding: 33px 22px;
+ display: flex;
+ }
+
+ .thing .left {
+ width: 295px;
+ height: calc(100% - 20px);
+ border-right: 3px solid rgb(245, 247, 251);
+ padding: 16px;
+ overflow-y: auto;
+ }
+
+ .thing .left .custom-tree-node span {
+ font-size: 14px;
+ }
+
+ .thing .left .custom-tree-node {
+ flex: 1;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ font-size: 14px;
+ padding-right: 8px;
+ }
+
+ .node_i {
+ color: orange;
+ }
+
+ .el-icon-delete {
+ display: none;
+ color: #004EA2;
+ }
+
+ .custom-tree-node:hover .el-icon-delete {
+ display: inline;
+ }
+
+ .thing .right {
+ width: calc(100% - 305px);
+ height: calc(100% - 25px);
+ overflow: hidden;
+ padding: 10px;
}
.table_do {
@@ -56,181 +569,13 @@
color: #004EA2;
}
- .record_content .thing * {
- font-size: 14px;
+ .record_content .thing .left .el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
+ background: rgba(58, 124, 253, 0.2);
+ color: #004EA2;
}
- .record_content .has-gutter .el-table__cell {
- background-color: #F0F1F5 !important;
- color: #333;
+ .record_content .el-tree-node__content {
+ height: 30px;
+ border-radius: 2px;
}
-
- .record_content .has-gutter .el-table__cell .cell {
- font-size: 16px;
- font-weight: 500;
- }
-
- .record_content .cell {
- color: #333;
- padding-left: 17px !important;
- }
-
- .record_content .el-table__body-wrapper {
- height: 100%;
- }
-
- .raw_ins .el-table__body {
- height: 100%;
- }
-</style>
-
-<template>
- <div class="record_content">
- <div class="title">
- <el-row>
- <el-col :span="12" style="line-height: 32px;">璁板綍鍐呭缁存姢</el-col>
- <el-col :span="12" style="text-align: right;">
- <el-button type="primary" icon="el-icon-plus" style="background: #004EA2;">鏂板</el-button>
- <el-button icon="el-icon-edit-outline">淇敼</el-button>
- <el-button icon="el-icon-delete">鍒犻櫎</el-button>
- </el-col>
- </el-row>
- </div>
- <div class="choose">
- <span>绫诲瀷锛�</span>
- <el-select v-model="search.type" size="small" placeholder="璇烽�夋嫨" style="width: 224px;margin-right: 30px;">
- <el-option label="姗¤兌杩炴帴鍣�" :value="0"></el-option>
- <el-option label="閲戝睘杩炴帴鍣�" :value="1"></el-option>
- <el-option label="婀挎彃鎷旂數杩炴帴鍣�" :value="2"></el-option>
- <el-option label="鍒嗘敮缁勪欢" :value="3"></el-option>
- </el-select>
- <span>宸ュ簭锛�</span>
- <el-select v-model="search.name" size="small" placeholder="璇烽�夋嫨" style="width: 224px;margin-right: 30px;">
- <el-option v-for="(a, ai) in process" key="ai" :label="a.name" :value="a.id"></el-option>
- </el-select>
- <el-button size="mini" @click="clean()"><span>閲� 缃�</span></el-button>
- <el-button size="mini" type="primary" style="background: #004EA2;"><span>鏌�
- 璇�</span></el-button>
- </div>
- <div class="thing">
- <el-table :data="tableData" border style="width: 100%;overflow-y: auto;min-height: calc(100% - 50px)"
- max-height="calc(100% - 50px)" @selection-change="handleSelectionChange" default-expand-all
- :tree-props="{children: 'children', hasChildren: 'hasChildren'}" row-key="id">
- <el-table-column type="selection" width="50">
- </el-table-column>
- <el-table-column type="index" label="搴忓彿" width="70">
- </el-table-column>
- <el-table-column prop="name" label="宸ュ簭">
- <template slot-scope="scope">
- <span>
- <font>{{scope.row.ids}}</font>{{scope.row.name}}
- </span>
- </template>
- </el-table-column>
- <el-table-column prop="address" label="澶囨敞">
- </el-table-column>
- <el-table-column label="鎿嶄綔" width="130">
- <template slot-scope="scope">
- <span class="table_do">缂栬緫 </span>
- <span class="table_do" @click="deleteRow(scope.$index, tableData)">鍒犻櫎</span>
- </template>
- </el-table-column>
- </el-table>
- </div>
- </div>
-</template>
-
-<script>
- export default {
- data() {
- return {
- search: {
- type: 0,
- name: null
- },
- process: [],
- tableData: [{
- id: 1,
- date: '2016-05-02',
- name: '鐜嬪皬铏�',
- address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�'
- }, {
- id: 2,
- date: '2016-05-04',
- name: '鐜嬪皬铏�',
- address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1517 寮�'
- }, {
- id: 3,
- date: '2016-05-01',
- name: '鐜嬪皬铏�',
- address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1519 寮�',
- children: [{
- id: 31,
- date: '2016-05-01',
- name: '鐜嬪皬铏�',
- address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1519 寮�',
- children: [{
- id: 33,
- date: '2016-05-01',
- name: '鐜嬪皬铏�',
- address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1519 寮�'
- }, {
- id: 34,
- date: '2016-05-01',
- name: '鐜嬪皬铏�',
- address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1519 寮�'
- }]
- }, {
- id: 32,
- date: '2016-05-01',
- name: '鐜嬪皬铏�',
- address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1519 寮�'
- }]
- }, {
- id: 4,
- date: '2016-05-03',
- name: '鐜嬪皬铏�',
- address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1516 寮�'
- }],
- selects: []
- }
- },
- mounted() {
- this.selectDataList()
- },
- methods: {
- clean() {
- this.search = {
- type: null,
- name: null
- }
- },
- selectDataList(){
- this.tableData.forEach(a=>{
- a.ids = '01'
- if(a.children!=undefined){
- a.children.forEach(b=>{
- b.ids = '02'
- if(b.children!=undefined){
- b.children.forEach(c=>{
- c.ids = '03'
- })
- }
- })
- }
- })
- },
- handleSelectionChange(val) {
- this.selects = val;
- },
- del(ob) {
- console.log(ob)
- },
- deleteRow(index, rows) {
- console.log(index);
- console.log(rows);
- rows.splice(index, 1);
- }
- }
- }
-</script>
\ No newline at end of file
+</style>
\ No newline at end of file
--
Gitblit v1.9.3