| | |
|---|
| | | <el-aside width="200px" v-loading="showGrouploading"> |
|---|
| | | <el-container> |
|---|
| | | <el-main class="nopadding"> |
|---|
| | | <el-tree ref="group" class="menu" node-key="id" :data="group" |
|---|
| | | :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> |
|---|
| | | <el-tree :expand-on-click-node="false" ref="group" class="menu" node-key="id" |
|---|
| | | :data="group" :current-node-key="treeCheckKey" :highlight-current="true" |
|---|
| | | :check-on-click-node="true" :default-expanded-keys="[1]" |
|---|
| | | :render-content="renderContent" @node-click="groupClick1"></el-tree> |
|---|
| | | </el-main> |
|---|
| | | </el-container> |
|---|
| | | </el-aside> |
|---|
| | | <el-container> |
|---|
| | | <el-header> |
|---|
| | | <div class="left-panel"> |
|---|
| | | <el-button type="primary" icon="el-icon-plus"></el-button> |
|---|
| | | <el-button type="danger" plain icon="el-icon-delete"></el-button> |
|---|
| | | <el-button type="primary" plain>导入</el-button> |
|---|
| | | <el-button type="primary" plain>批量操作</el-button> |
|---|
| | | <el-button @click="table_add" type="primary" icon="el-icon-plus"></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> |
|---|
| | | <div class="right-panel"> |
|---|
| | | <div class="right-panel-search"> |
|---|
| | | <el-select v-model="value" placeholder="Select" style="width: 240px"> |
|---|
| | | <el-option v-for="item in options" :key="item.value" :label="item.label" |
|---|
| | | <span>类型</span> |
|---|
| | | <el-select v-model="type" style="width: 240px" clearable> |
|---|
| | | <el-option v-for="item in types" :key="item.value" :label="item.label" |
|---|
| | | :value="item.value" /> |
|---|
| | | </el-select> |
|---|
| | | <el-select v-model="value" placeholder="Select" style="width: 240px"> |
|---|
| | | <el-option v-for="item in options" :key="item.value" :label="item.label" |
|---|
| | | <span>状态</span> |
|---|
| | | <el-select v-model="statu" style="width: 240px" clearable> |
|---|
| | | <el-option v-for="item in status" :key="item.value" :label="item.label" |
|---|
| | | :value="item.value" /> |
|---|
| | | </el-select> |
|---|
| | | <el-input style="width: 240px" placeholder="请输入工位名称/编号" clearable></el-input> |
|---|
| | | <el-button type="primary" icon="el-icon-search"></el-button> |
|---|
| | | <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"> |
|---|
| | | <scTable 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="id" width="120" |
|---|
| | | sortable='custom'></el-table-column> |
|---|
| | | <el-table-column label="工位名称" prop="id" width="120" |
|---|
| | | sortable='custom'></el-table-column> |
|---|
| | | <el-table-column label="工位类型" prop="id" width="120" |
|---|
| | | sortable='custom'></el-table-column> |
|---|
| | | <el-table-column label="工位日历" prop="id" 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_show(scope.row, scope.$index)">查看</el-button> |
|---|
| | | <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)"> |
|---|
| | | <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> |
|---|
| | | <el-button text type="primary" size="small">停用</el-button> |
|---|
| | | </template> |
|---|
| | | </el-popconfirm> |
|---|
| | | </el-button-group> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | </scTable> |
|---|
| | | </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> |
|---|
| | | <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" |
|---|
| | | width="120" /> |
|---|
| | | <el-table-column label="工位变量名称" prop="dataItem" |
|---|
| | | width="120"> |
|---|
| | | <template #default="scope"> |
|---|
| | | <el-input :disabled="!editFlag" |
|---|
| | | v-model="scope.row.dataItem"></el-input> |
|---|
| | | </template> |
|---|
| | | </el-table-column> |
|---|
| | | <el-table-column label="数据标签" prop="description" |
|---|
| | | width="150"> |
|---|
| | | <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" |
|---|
| | | width="150"> |
|---|
| | | <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> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | </el-main> |
|---|
| | | </el-container> |
|---|
| | | </el-container> |
|---|
| | |
|---|
| | | :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> |
|---|
| | |
|---|
| | | |
|---|
| | | </el-tabs> |
|---|
| | | </el-card> |
|---|
| | | <Dialog ref="dialog" @success="success" :option="{ types, status, group }"></Dialog> |
|---|
| | | </el-main> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import pmsPng from '@/assets/pms.png' |
|---|
| | | import Dialog from './Dialog.vue' |
|---|
| | | import machinePng from '@/assets/machine.png' |
|---|
| | | export default { |
|---|
| | | name: 'system', |
|---|
| | | components: { |
|---|
| | | Dialog |
|---|
| | | }, |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | machinePng, |
|---|
| | | showGrouploading: false, |
|---|
| | | options: [], |
|---|
| | | activeName: '1', |
|---|
| | | normal: '1', |
|---|
| | | group: [], |
|---|
| | | groupFilterText: '', |
|---|
| | | apiObj: '', |
|---|
| | | params: {}, |
|---|
| | | keyWord: '', |
|---|
| | | type: '', |
|---|
| | | statu: 1, |
|---|
| | | types: [ |
|---|
| | | { |
|---|
| | | label: '机器', |
|---|
| | | value: 0 |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: '人工', |
|---|
| | | value: 1 |
|---|
| | | }, |
|---|
| | | ], |
|---|
| | | status: [ |
|---|
| | | { |
|---|
| | | label: '启用', |
|---|
| | | value: 1 |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | label: '停用', |
|---|
| | | value: 0 |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | previewData: {}, |
|---|
| | | // -------- |
|---|
| | | form: { |
|---|
| | | groupTag: '', |
|---|
| | |
|---|
| | | 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: { |
|---|
| | |
|---|
| | | 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 |
|---|
| | |
|---|
| | | this.addGroupShow = true |
|---|
| | | this.$refs.dialogForm.resetFields() |
|---|
| | | }, |
|---|
| | | groupFilterNode() { |
|---|
| | | |
|---|
| | | }, |
|---|
| | | groupClick(node) { |
|---|
| | | this.treeCheckedNode = node |
|---|
| | | }, |
|---|
| | | search() { |
|---|
| | | this.groupClick1(this.treeCheckedNode) |
|---|
| | | }, |
|---|
| | | rowClick(data) { |
|---|
| | | this.previewData = 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) |
|---|
| | | var params = { |
|---|
| | | groupId: data.id, |
|---|
| | | keyWord: '', |
|---|
| | | status: 1, |
|---|
| | | type: '' |
|---|
| | | keyWord: this.keyWord, |
|---|
| | | status: this.statu, |
|---|
| | | type: this.type, |
|---|
| | | } |
|---|
| | | this.$refs.table.reload(params) |
|---|
| | | |
|---|
| | | }, |
|---|
| | | dataChange(res, data) { |
|---|
| | | |
|---|
| | | if (data.length > 0) { |
|---|
| | | console.log(data[0], '>>>>>>>>') |
|---|
| | | this.$refs.table.setCurrentRow(data[0]) |
|---|
| | | this.previewData = data[0] |
|---|
| | | this.rowClick(data[0]) |
|---|
| | | } else { |
|---|
| | | this.$refs.table.setCurrentRow() |
|---|
| | | this.previewData = {} |
|---|
| | | this.rowClick({}) |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | table_add() { |
|---|
| | | var newRow = { |
|---|
| | | key: "", |
|---|
| | | value: "", |
|---|
| | | title: "", |
|---|
| | | isSet: true |
|---|
| | | } |
|---|
| | | this.setting.push(newRow) |
|---|
| | | this.$refs.dialog.open() |
|---|
| | | }, |
|---|
| | | table_edit(row) { |
|---|
| | | if (row.isSet) { |
|---|
| | | row.isSet = false |
|---|
| | | } else { |
|---|
| | | row.isSet = true |
|---|
| | | } |
|---|
| | | this.$refs.dialog.open('edit', row) |
|---|
| | | }, |
|---|
| | | table_del(row, index) { |
|---|
| | | this.setting.splice(index, 1) |
|---|
| | | 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 |
|---|
| | | }) |
|---|
| | | }, |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped> |
|---|
| | | <style lang="scss" scoped> |
|---|
| | | .show-info { |
|---|
| | | 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; |
|---|
| | | margin-bottom: 10px; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .workbench { |
|---|
| | | list-style: none; |
|---|
| | | } |
|---|
| | | </style> |
|---|
