| | |
| | | > |
| | | <div class="elForm"> |
| | | <el-form-item label="组织编码" style=" display: flex;"> |
| | | <el-input v-model="form.OrgCode" placeholder="请输入" style="width: calc(100%-30px)" /> |
| | | <el-input v-model="form.OrgCode" placeholder="请输入" style="width: 200px" /> |
| | | </el-form-item> |
| | | <el-form-item label="组织名称" style=" display: flex;"> |
| | | <el-input v-model="form.OrgName" placeholder="请输入" style="width: calc(100%-30px)" /> |
| | | <el-input v-model="form.OrgName" placeholder="请输入" style="width: 200px" /> |
| | | </el-form-item> |
| | | <el-form-item label="组织类型" style=" display: flex;"> |
| | | <el-select v-model="form.OrgType" style="width: calc(100%-30px)" placeholder="请选择"> |
| | | <el-select v-model="form.OrgType" :popper-append-to-body="false" style="width: 200px" placeholder="请选择"> |
| | | <el-option |
| | | v-for="item in OrgTypeArr" |
| | | :key="item.value" |
| | | :label="item.label" |
| | | :value="item.value" |
| | | :key="item.code" |
| | | :label="item.name" |
| | | :value="item.code" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="创建人员" style=" display: flex;"> |
| | | <el-input v-model="form.UserName" style="width: calc(100%-30px)" placeholder="请输入" /> |
| | | <el-input v-model="form.UserName" style="width: 200px" placeholder="请输入" /> |
| | | </el-form-item> |
| | | </div> |
| | | <div style="display: flex;align-items: start;margin-top: 5px;z-index: 2"> |
| | |
| | | <el-divider /> |
| | | <div style="margin-left: 10px;display: flex"> |
| | | <el-button type="primary" icon="el-icon-circle-plus-outline" @click="add('add')">新增</el-button> |
| | | <el-button type="primary" icon="el-icon-upload2" @click="upload">导入</el-button> |
| | | </div> |
| | | <el-divider /> |
| | | <div class="elTableDiv"> |
| | | <el-table |
| | | :data="tableData" |
| | | :height="tableHeight+'px'" |
| | | border |
| | | stripe |
| | | :style="{width: 100+'%',height:tableHeight+'px',}" |
| | | highlight-current-row |
| | | :header-cell-style="this.$headerCellStyle" |
| | |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div class="operationClass"> |
| | | <el-button type="text" @click="edit('edit',row)">修改</el-button> |
| | | <el-button type="text" @click="del(row.id)">删除</el-button> |
| | | <el-button type="text" @click="edit('edit',row)">编辑</el-button> |
| | | <el-button type="text" @click="del(row)">删除</el-button> |
| | | </div> |
| | | </template> |
| | | </el-table-column> |
| | |
| | | </div> |
| | | |
| | | <el-dialog |
| | | :title="operation==='add'?'添加':'修改'" |
| | | :title="operation==='add'?'新增':'编辑'" |
| | | :visible.sync="dialogVisible" |
| | | width="50%" |
| | | width="800" |
| | | top="15vh" |
| | | @closed="handleClose" |
| | | @close="handleClose" |
| | | > |
| | | <el-form ref="dialogForm" :rules="dialogFormRules" :model="dialogForm" label-width="80px"> |
| | | <el-form-item label="组织类型" prop="OrgType"> |
| | | <el-radio-group |
| | | v-model="dialogForm.OrgType" |
| | | style="display: flex;align-items: end;height: 29px;" |
| | | @change="changeRadio" |
| | | > |
| | | <el-radio |
| | | v-for="item in OrgTypeArr" |
| | | :key="item.value" |
| | | :value="item.value" |
| | | :label="item.label" |
| | | /> |
| | | </el-radio-group> |
| | | </el-form-item> |
| | | <el-form ref="dialogForm" inline :rules="dialogFormRules" :model="dialogForm" label-width="80px"> |
| | | <el-form-item label="组织编码" prop="OrgCode"> |
| | | <el-input v-model="dialogForm.OrgCode" :disabled="operation!=='add'" style="width: 220px" /> |
| | | <el-input v-model="dialogForm.OrgCode" :disabled="operation!=='add'" style="width: 200px" /> |
| | | </el-form-item> |
| | | <el-form-item label="组织名称" prop="OrgName"> |
| | | <el-input v-model="dialogForm.OrgName" style="width: 220px" /> |
| | | <el-input v-model="dialogForm.OrgName" style="width: 200px" /> |
| | | </el-form-item> |
| | | <el-form-item v-if="dialogFormOrgTypeSelected!=='F'" prop="SupUnit" label="上级单位"> |
| | | <el-form-item prop="SupUnit" label="上级单位"> |
| | | <el-select |
| | | v-model="dialogForm.SupUnit" |
| | | style="width: 220px" |
| | | style="width: 200px" |
| | | placeholder="请选择" |
| | | :popper-append-to-body="false" |
| | | > |
| | | <el-option |
| | | v-for="item in SupUnitArr" |
| | | :label="item.org_name" |
| | | :value="item.id" |
| | | :key="item.code" |
| | | :label="item.name" |
| | | :value="item.code" |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | |
| | | prop: 'lm_date', // 排序字段 |
| | | order: 'desc', // 排序字段 |
| | | page: 1, // 第几页 |
| | | rows: 10 // 每页多少条 |
| | | rows: 20 // 每页多少条 |
| | | }, |
| | | OrgTypeArr: [ |
| | | { label: '工厂', value: 'F' }, |
| | |
| | | OrgName: '', |
| | | SupUnit: ''// 上级单位 |
| | | }, |
| | | SupUnitArr: [], |
| | | dialogFormOrgTypeSelected: '', |
| | | operation: '', |
| | | dialogFormRules: { |
| | | OrgType: [ |
| | |
| | | search() { |
| | | this.getOrganizationSearch() |
| | | }, |
| | | upload() { |
| | | |
| | | }, |
| | | // 重置 |
| | | reset() { |
| | | this.form.OrgCode = '' |
| | |
| | | this.form.OrgType = '' |
| | | this.form.UserName = '' |
| | | this.getOrganizationSearch() |
| | | }, |
| | | // 单选框改变时 |
| | | async changeRadio(val) { |
| | | if (val.length > 1) { |
| | | this.OrgTypeArr.forEach(item => { |
| | | if (item.label === val) { |
| | | this.dialogFormOrgTypeSelected = item.value |
| | | } |
| | | }) |
| | | this.dialogForm.SupUnit = '' |
| | | } else { |
| | | this.dialogFormOrgTypeSelected = val |
| | | } |
| | | if (this.dialogFormOrgTypeSelected !== 'F') { |
| | | const { data: res } = await PrentOrganization({ orgcode: this.dialogFormOrgTypeSelected }) |
| | | this.SupUnitArr = res |
| | | } |
| | | }, |
| | | |
| | | // 新增按钮 |
| | |
| | | edit(operation, row) { |
| | | this.operation = operation |
| | | this.dialogVisible = true |
| | | if (row.description === 'F') { |
| | | this.dialogForm.OrgType = '工厂' |
| | | } else if (row.description === 'D') { |
| | | this.dialogForm.OrgType = '部门' |
| | | } else if (row.description === 'W') { |
| | | this.dialogForm.OrgType = '车间' |
| | | } else if (row.description === 'K') { |
| | | this.dialogForm.OrgType = '科室' |
| | | } else if (row.description === 'L') { |
| | | this.dialogForm.OrgType = '生产线' |
| | | } |
| | | |
| | | this.$nextTick(() => { |
| | | this.changeRadio(this.dialogForm.OrgType) |
| | | this.dialogForm.OrgCode = row.org_code |
| | | this.dialogForm.OrgName = row.org_name |
| | | this.dialogForm.SupUnit = row.parent_id |
| | | }) |
| | | }, |
| | | // 删除按钮 |
| | | async del(id) { |
| | | async del(row) { |
| | | this.$confirm('是否确认删除?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }).then(() => { |
| | | DeleteOrganization({ orgid: id }).then(res => { |
| | | DeleteOrganization({ orgid: row.code }).then(res => { |
| | | if (res.code === '200') { |
| | | this.$message.success('删除成功!') |
| | | this.getOrganizationSearch() |
| | |
| | | this.$refs.dialogForm.validate(valid => { |
| | | if (valid) { |
| | | const data = { |
| | | OrganType: this.dialogFormOrgTypeSelected, |
| | | OrganCode: this.dialogForm.OrgCode, |
| | | OrganName: this.dialogForm.OrgName, |
| | | SupUnit: this.dialogFormOrgTypeSelected === 'F' ? '0' : this.dialogForm.SupUnit, |
| | | OperType: this.operation === 'add' ? 'Add' : 'Update', |
| | | Operator: getCookie('admin') |
| | | } |
| | |
| | | // 获取页面高度 |
| | | getHeight() { |
| | | this.$nextTick(() => { |
| | | this.mainHeight = window.innerHeight - 200 |
| | | this.mainHeight = window.innerHeight - 250 |
| | | this.tableHeight = this.mainHeight - 100 |
| | | }) |
| | | } |
| | |
| | | height: 30px; |
| | | display: flex; |
| | | align-items: center; |
| | | border: 1px solid $main_color; |
| | | //border: 1px solid $main_color; |
| | | border: none; |
| | | padding: 0 20px; |
| | | } |
| | | |
| | | ::v-deep .el-button--primary:hover { |
| | | border: none; |
| | | } |
| | | ::v-deep .el-button--info { |
| | | height: 30px; |
| | | display: flex; |
| | |
| | | ::v-deep .el-input__inner { |
| | | height: 30px; |
| | | line-height: 30px; |
| | | } |
| | | ::v-deep .el-input__inner:focus { |
| | | border-color: $main_color; |
| | | } |
| | | |
| | | ::v-deep .el-table .caret-wrapper { |
| | |
| | | margin: 10px auto; |
| | | } |
| | | |
| | | ::v-deep .el-form-item { |
| | | .body ::v-deep .el-form-item { |
| | | margin-bottom: 0; |
| | | } |
| | | |
| | | ::v-deep .el-input__inner:focus { |
| | | border-color: $main_color; |
| | | } |
| | | |
| | | ::v-deep .el-select .el-input__inner:focus{ |
| | | border-color: $main_color; |
| | | } |
| | | |
| | | ::v-deep .el-select-dropdown__item.selected{ |
| | | color: $main_color; |
| | | } |
| | | ::v-deep .el-checkbox__inner:hover{ |
| | | border-color: $main_color; |
| | | } |
| | | ::v-deep .el-textarea__inner:focus{ |
| | | border-color: $main_color; |
| | | } |
| | | ::v-deep .el-select .el-input .el-select__caret { |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | } |
| | | </style> |