1

lzhe

2024-06-05 dcf9c9e0410fe1186239e3f8d6f7bdc789c08010

 src/views/console/workstation/index.vue

@@ -11,7 +11,7 @@
                              :current-node-key="treeCheckKey" :highlight-current="true"
                              :expand-on-click-node="false" :check-on-click-node="true"
                              :default-expanded-keys="[1]" :render-content="renderContent"
                              :filter-node-method="groupFilterNode" @node-click="groupClick1"></el-tree>
                              @node-click="groupClick1"></el-tree>
                        </el-main>
                     </el-container>
                  </el-aside>
@@ -19,7 +19,7 @@
                     <el-header>
                        <div class="left-panel">
                           <el-button @click="table_add" type="primary" icon="el-icon-plus"></el-button>
                           <el-button type="danger" plain icon="el-icon-delete"></el-button>
                           <el-button type="danger" plain icon="el-icon-delete" @click="batchDel"></el-button>
                           <!-- <el-button type="primary" plain>导入</el-button>
                           <el-button type="primary" plain>批量操作</el-button> -->
                        </div>
@@ -35,73 +35,205 @@
                                 <el-option v-for="item in status" :key="item.value" :label="item.label"
                                    :value="item.value" />
                              </el-select>
                              <el-input v-model="keyWord" style="width: 240px" placeholder="请输入工位名称/编号" clearable></el-input>
                              <el-input v-model="keyWord" style="width: 240px" placeholder="请输入工位名称/编号"
                                 clearable></el-input>
                              <el-button @click="search" type="primary" icon="el-icon-search"></el-button>
                           </div>
                        </div>
                     </el-header>
                     <el-main class="nopadding">
                     <div style="display: flex">
                        <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"
                              sortable='custom'></el-table-column>
                           <el-table-column label="工位名称" prop="name" width="120"
                              sortable='custom'></el-table-column>
                           <el-table-column label="工位类型" prop="type" width="120"
                              sortable='custom'></el-table-column>
                           <el-table-column label="工位日历" prop="calendarName" width="120"
                              sortable='custom'></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="table_del(scope.row, scope.$index, '0')">
                                       <template #reference>
                                          <el-button text type="primary" size="small">删除</el-button>
                                       </template>
                                    </el-popconfirm>
                                    <el-popconfirm title="确定停用吗？"
                        <div style="display: flex">
                           <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="type" width="120"></el-table-column>
                              <el-table-column label="工位日历" prop="calendarName" width="120"></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="table_del(scope.row, scope.$index, '0')">
                                          <template #reference>
                                             <el-button text type="primary" size="small">删除</el-button>
                                          </template>
                                       </el-popconfirm>
                                       <!-- <el-popconfirm title="确定停用吗？"
                                       @confirm="table_del(scope.row, scope.$index,'1')">
                                       <template #reference>
                                          <el-button text type="primary" size="small">停用</el-button>
                                       </template>
                                    </el-popconfirm>
                                 </el-button-group>
                              </template>
                           </el-table-column>
                        </scTable>
                        <div style="margin-left: 14px" v-if="Object.keys(previewData).length > 0">
                           <div class="header">
                              <p class="preview-title">工位信息</p>
                              <div class="preview-content">
                                 <div class="img">
                                    <img :src="machinePng" alt="">
                                    </el-popconfirm> -->
                                    </el-button-group>
                                 </template>
                              </el-table-column>
                           </scTable>
                           <div style="margin-left: 14px" v-if="Object.keys(previewData).length > 0">
                              <div class="header">
                                 <p class="preview-title">工位信息</p>
                                 <div class="preview-content">
                                    <div class="img">
                                       <img v-if="!previewData.avatar" :src="machinePng" alt="">
                                       <scUpload v-else disabled v-model="previewData.avatar" title="工位图片">
                                       </scUpload>
                                    </div>
                                    <ul>
                                       <li>工位编号 {{ previewData.code }}</li>
                                       <li>工位组 {{ previewData.groupName }}</li>
                                       <li>工位名称 {{ previewData.name }}</li>
                                       <li>工位类型 {{ types.find(v => v.value == previewData.type)?.label }}
                                       </li>
                                       <li>工位日历 {{ previewData.calendarName }}</li>
                                       <li>状态 {{ previewData.status ? '启用' : '禁用' }}</li>
                                    </ul>
                                 </div>
                                 <ul>
                                    <li>工位编号 {{previewData.code}}</li>
                                    <li>工位组 {{previewData.groupName}}</li>
                                    <li>工位名称 {{previewData.name}}</li>
                                    <li>工位类型 {{previewData.type}}</li>
                                    <li>工位日历 {{previewData.calendarName}}</li>
                                    <li>状态 {{previewData.status}}</li>
                                 </ul>
                                 <el-tabs tab-position="top" class="custom-tabs" v-model="normal">
                                    <el-tab-pane label="机器信息" name="1">
                                       <el-container>
                                          <el-header>基础数据</el-header>
                                          <el-main>
                                             <el-row>
                                                <el-col :span="4">
                                                   机器编号
                                                </el-col>
                                                <el-col :span="8">
                                                   {{ basic.machineCode }}
                                                </el-col>
                                                <el-col :span="4">
                                                   机器名称
                                                </el-col>
                                                <el-col :span="8">
                                                   {{ basic.machineName }}
                                                </el-col>
                                                <el-col :span="4">
                                                   机器品牌
                                                </el-col>
                                                <el-col :span="8">
                                                   {{ basic.machineBrand }}
                                                </el-col>
                                                <el-col :span="4">
                                                   驱动名称
                                                </el-col>
                                                <el-col :span="8">
                                                   {{ basic.typeName }}
                                                </el-col>
                                             </el-row>
                                          </el-main>
                                       </el-container>
                                       <el-container>
                                          <el-header>
                                             <span>采集信息</span>
                                             <el-button @click="editFlag = !editFlag"
                                                style="margin-left: auto;" text type="primary"
                                                size="small">配置工位采集</el-button>
                                             <el-button v-show="editFlag" @click="saveInfo" text
                                                type="primary" size="small">保存</el-button>
                                             <el-button text type="primary"
                                                size="small">修改DMP配置</el-button>
                                          </el-header>
                                          <el-main>
                                             <el-table :data="list" height="200px">
                                                <el-table-column label="采集变量名称" prop="name" />
                                                <el-table-column label="工位变量名称" prop="dataItem">
                                                   <template #default="scope">
                                                      <el-input :disabled="!editFlag"
                                                         v-model="scope.row.dataItem"></el-input>
                                                   </template>
                                                </el-table-column>
                                                <el-table-column label="数据标签" prop="description">
                                                   <template #default="scope">
                                                      <el-select :disabled="!editFlag"
                                                         v-model="scope.row.description">
                                                         <el-option
                                                            v-for="item in workstation_param_type"
                                                            :key="item.dictKey"
                                                            :label="item.dictValue"
                                                            :value="item.dictKey - 0" />
                                                      </el-select>
                                                      <!-- {{ dmp_data_type.find(v => v.dictKey == scope.row.wcsDataType)?.dictValue }} -->
                                                   </template>
                                                </el-table-column>
                                                <el-table-column label="数据类别" prop="wcsDataType">
                                                   <template #default="scope">
                                                      <el-select disabled
                                                         v-model="scope.row.wcsDataType">
                                                         <el-option v-for="item in dmp_data_type"
                                                            :key="item.dictKey"
                                                            :label="item.dictValue"
                                                            :value="item.dictKey - 0" />
                                                      </el-select>
                                                      <!-- {{ dmp_data_type.find(v => v.dictKey == scope.row.wcsDataType)?.dictValue }} -->
                                                   </template>
                                                </el-table-column>
                                                <el-table-column label="大屏" prop="bigScreen">
                                                   <template #default="scope">
                                                      <el-checkbox :disabled="!editFlag"
                                                         v-model="scope.row.bigScreen" />
                                                   </template>
                                                </el-table-column>
                                                <el-table-column label="实时数据" prop="realTimeData">
                                                   <template #default="scope">
                                                      <el-checkbox :disabled="!editFlag"
                                                         v-model="scope.row.realTimeData" />
                                                   </template>
                                                </el-table-column>
                                                <el-table-column label="过程参数" prop="processParameter">
                                                   <template #default="scope">
                                                      <el-checkbox :disabled="!editFlag"
                                                         v-model="scope.row.processParameter" />
                                                   </template>
                                                </el-table-column>
                                             </el-table>
                                          </el-main>
                                       </el-container>
                                    </el-tab-pane>
                                    <el-tab-pane label="扩展信息" name="2">
                                       <el-row>
                                          <el-col :span="4">
                                             工种
                                          </el-col>
                                          <el-col :span="8">
                                             {{ info.deviceType }}
                                          </el-col>
                                          <el-col :span="4">
                                             加工属性
                                          </el-col>
                                          <el-col :span="8">
                                             {{ info.properties }}
                                          </el-col>
                                          <el-col :span="4">
                                             程序传输方式
                                          </el-col>
                                          <el-col :span="8">
                                             {{ info.transmissionMode }}
                                          </el-col>
                                          <el-col :span="4">
                                             FTP目录
                                          </el-col>
                                          <el-col :span="8">
                                             {{ info.ftpCatalogue }}
                                          </el-col>
                                          <el-col :span="4">
                                             工作台
                                          </el-col>
                                          <el-col :span="8">
                                             <ul class="workbench">
                                                <li v-for="item in workbenchVOList" :key="item.sort">
                                                   {{ `【${item.sort}】` }}{{ item.name }}
                                                </li>
                                             </ul>
                                          </el-col>
                                       </el-row>
                                    </el-tab-pane>
                                 </el-tabs>
                              </div>
                              <el-tabs tab-position="top" class="custom-tabs" v-model="normal">
                                 <el-tab-pane label="机器信息" name="1">
                                    机器信息
                                 </el-tab-pane>
                                 <el-tab-pane label="扩展信息" name="2">
                                    扩展信息
                                 </el-tab-pane>
                              </el-tabs>
                           </div>
                        </div>
                     </div>
								

                     </el-main>
                  </el-container>
               </el-container>
@@ -116,7 +248,7 @@
                              :current-node-key="treeCheckKey" :highlight-current="true"
                              :expand-on-click-node="false" :check-on-click-node="true"
                              :default-expanded-keys="[1]" :render-content="renderContent"
                              :filter-node-method="groupFilterNode" @node-click="groupClick"></el-tree>
                              @node-click="groupClick"></el-tree>
                        </el-main>
                     </el-container>
                  </el-aside>
@@ -237,7 +369,7 @@

         </el-tabs>
      </el-card>
      <Dialog ref="dialog" :option="{types,status,group}"></Dialog>
      <Dialog ref="dialog" @success="success" :option="{ types, status, group }"></Dialog>
   </el-main>
</template>

@@ -263,29 +395,25 @@
         params: {},
         keyWord: '',
         type: '',
         statu: '1',
         statu: 1,
         types: [
            {
               label: '所有',
               value: ''
            },
            {
               label: '机器',
               value: '0'
               value: 0
            },
            {
               label: '人工',
               value: '1'
               value: 1
            },
         ],
         status: [
            {
               label: '启用',
               value: '1'
               value: 1
            },
            {
               label: '停用',
               value: '0'
               value: 0
            }
         ],
         previewData: {},
@@ -305,7 +433,25 @@
         treeCheckKey: [],
         beltline_type: [],
         group_tag: [],
         addGroupShow: false
         dmp_data_type: [],
         workstation_param_type: [],
         addGroupShow: false,
         selection: [],
         list: [],
         basic: {
            machineCode: '-',
            machineName: '-',
            machineBrand: '-',
            typeName: '-',
         },
         info: {
            deviceType: '-',
            properties: '-',
            transmissionMode: '-',
            ftpCatalogue: '-',
         },
         workbenchVOList: [],
         editFlag: false
      }
   },
   watch: {
@@ -359,7 +505,16 @@
         this.$API.system.dic.getDic.get({ code: 'group_tag' }).then(res => {
            this.group_tag = res.data
         })
         this.$API.system.dic.getDic.get({ code: 'dmp_data_type' }).then(res => {
            this.dmp_data_type = res.data
         })
         this.$API.system.dic.getDic.get({ code: 'workstation_param_type' }).then(res => {
            this.workstation_param_type = res.data
         })

      },
      success() {
         this.search()
      },
      async queryList(flag) {
         this.showGrouploading = true
@@ -441,18 +596,38 @@
         this.addGroupShow = true
         this.$refs.dialogForm.resetFields()
      },
      groupFilterNode() {

      },
      groupClick(node) {
         this.treeCheckedNode = node
      },
      search () {
      search() {
         this.groupClick1(this.treeCheckedNode)
      },
      rowClick (data) {
      rowClick(data) {
         this.previewData = data
         console.log(data)
         console.log(data, '>>>>>>>>>>>')
         if (!data.id) {
            Object.keys(this.basic).forEach(key => {
               this.basic[key] = '-'
            })
            Object.keys(this.info).forEach(key => {
               this.info[key] = '-'
            })
            this.list = []
            this.workbenchVOList = []
            return
         }
         this.$HTTP.get(`/api/blade-cps/workstation/listDmpVariablesByWorkstationId?workstationId=${data.id}`).then(res => {
            this.list = res?.data?.dmpVariablesVOList
            Object.keys(this.basic).forEach(key => {
               this.basic[key] = res?.data?.[key] || '-'
            })
         })
         this.$HTTP.get(`/api/blade-cps/workstation-workbench/listWorkbench?workstationId=${data.id}`).then(res => {
            Object.keys(this.info).forEach(key => {
               this.info[key] = res?.data?.[key] || '-'
            })
            this.workbenchVOList = res?.data?.workstationList || []
         })
      },
      groupClick1(data) {
         console.log('-------', data)
@@ -465,29 +640,41 @@
         this.$refs.table.reload(params)

      },
      dataChange (res,data) {
			
      dataChange(res, data) {

         if (data.length > 0) {
            console.log(data[0], '>>>>>>>>')
            this.$refs.table.setCurrentRow(data[0])
            this.previewData = data[0]
         }else  {
            this.rowClick(data[0])
         } else {
            this.$refs.table.setCurrentRow()
            this.previewData = {}
            this.rowClick({})
         }
      },
      table_add() {
         this.$refs.dialog.open()
      },
      table_edit(row) {
         this.$refs.dialog.open('edit',row)
         this.$refs.dialog.open('edit', row)
      },
      table_del(row, index,type) {
         this.$API.workstation.deleteWork.delete({
            type,
            workstationIds:row.id
         }).then(() => {
      table_del(row, index, type) {
         this.$HTTP.delete(`/api/blade-cps/workstation?type=0&workstationIds=${row.id}`).then(res => {
            this.search()
         })
      },
      selectionChange(selection) {
         this.selection = selection
      },
      batchDel() {
         this.$HTTP.delete(`/api/blade-cps/workstation?type=0&workstationIds=${this.selection.map(item => item.id).join(',')}`).then(res => {
            this.search()
         })
      },
      saveInfo() {
         this.$HTTP.post('/api/blade-cps/workstation-wcs/save', this.workbenchVOList).then(res => {
            this.editFlag = false
         })
      },
   }
@@ -499,22 +686,27 @@
   list-style: none;
   font-size: 14px;
}

.preview-title {
   padding: 12px;
   margin-bottom: 14px;
   font-size: 16px;
}

.preview-content {
   font-size: 14px;
   display: flex;
   align-items: center;

   .img {
      width: 30%;
   }

   ul {
      list-style: none;
      display: flex;
      flex-wrap: wrap;

      li {
         width: 50%;
         flex: 1 0 auto;
@@ -522,4 +714,8 @@
      }
   }
}

.workbench {
   list-style: none;
}
</style>