¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <GlobalWindow |
| | | :title="title" |
| | | width="50%" |
| | | :visible.sync="visible" |
| | | :confirm-working="isWorking" |
| | | @confirm="confirm" |
| | | > |
| | | <el-form :model="form" ref="form" :rules="rules"> |
| | | <el-form-item label="ææè´¦å·" prop="userId"> |
| | | <el-select v-model="form.userId" filterable placeholder="è¯·éæ©"> |
| | | <el-option |
| | | v-for="item in account" |
| | | :key="item.id" |
| | | :label="item.username" |
| | | :value="item.id"> |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="ç³è¯·ææä¼ä¸" prop="companyIds"> |
| | | <el-select |
| | | v-model="form.companyIds" |
| | | multiple |
| | | filterable |
| | | allow-create |
| | | default-first-option |
| | | placeholder="è¯·éæ©"> |
| | | <el-option |
| | | v-for="item in company" |
| | | :key="item.id" |
| | | :label="item.name" |
| | | :value="item.id"> |
| | | </el-option> |
| | | </el-select> |
| | | <!-- <div style="display: flex; align-items: center;">--> |
| | | <!-- <el-input v-model="form.content" placeholder="请è¾å
¥å
容"></el-input>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="list">--> |
| | | <!-- <div class="list_label">å·²éä¼ä¸ï¼</div>--> |
| | | <!-- <div class="list_box">--> |
| | | <!-- <div class="list_box_row">--> |
| | | <!-- <span>XXXæé责任å
¬å¸</span>--> |
| | | <!-- <i class="el-icon-error"></i>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="list_box_row">--> |
| | | <!-- <span>XXXæé责任å
¬å¸</span>--> |
| | | <!-- <i class="el-icon-error"></i>--> |
| | | <!-- </div>--> |
| | | <!-- </div>--> |
| | | <!-- </div>--> |
| | | </el-form-item> |
| | | <el-form-item label="ç³è¯·è¯´æ" prop="content"> |
| | | <el-input |
| | | type="textarea" |
| | | placeholder="请è¾å
¥ç³è¯·è¯´æ" |
| | | v-model="form.content" |
| | | maxlength="30" |
| | | show-word-limit /> |
| | | </el-form-item> |
| | | <el-form-item label="ææä¹¦" prop="multifileList"> |
| | | <UploadFile @remove="deleFile" :uploadData="{ folder: 'apply', fileType:'.pdf' }" :fileList="fileList" @uploadSuccess="editFanganFile" /> |
| | | </el-form-item> |
| | | </el-form> |
| | | </GlobalWindow> |
| | | </template> |
| | | |
| | | <script> |
| | | import BaseOpera from '@/components/base/BaseOpera' |
| | | import GlobalWindow from '@/components/common/GlobalWindow' |
| | | import UploadFile from '@/components/common/UploadFile' |
| | | import { findUserList } from '@/api/system/user' |
| | | import { findAllCompanyList } from '@/api/business/company' |
| | | export default { |
| | | name: 'OperaCompanyUserApplyWindow', |
| | | extends: BaseOpera, |
| | | components: { GlobalWindow, UploadFile }, |
| | | data () { |
| | | return { |
| | | // è¡¨åæ°æ® |
| | | form: { |
| | | id: null, |
| | | userId: '', |
| | | content: '', |
| | | companyIds: [], |
| | | multifileList: null |
| | | }, |
| | | // éªè¯è§å |
| | | rules: { |
| | | multifileList: [ |
| | | { required: true, message: '请ä¸ä¼ ææä¹¦' } |
| | | ], |
| | | companyIds: [ |
| | | { required: true, message: 'è¯·éæ©ææä¼ä¸' } |
| | | ], |
| | | userId: [ |
| | | { required: true, message: 'è¯·éæ©ææè´¦å·' } |
| | | ] |
| | | }, |
| | | account: [], |
| | | fileList: [], |
| | | company: [] |
| | | } |
| | | }, |
| | | created () { |
| | | this.config({ |
| | | api: '/business/companyUserApply', |
| | | 'field.id': 'id' |
| | | }) |
| | | }, |
| | | methods: { |
| | | __confirmCreate () { |
| | | this.$refs.form.validate((valid) => { |
| | | if (!valid) { |
| | | return |
| | | } |
| | | let obj = JSON.parse(JSON.stringify(this.form)) |
| | | obj.multifileList = [obj.multifileList] |
| | | obj.companyIds = obj.companyIds.join(',') |
| | | obj.companyNames = [] |
| | | this.form.companyIds.forEach(item => { |
| | | this.company.forEach(row => { |
| | | if (item === row.id) { |
| | | obj.companyNames.push(row.name) |
| | | } |
| | | }) |
| | | }) |
| | | obj.companyNames = obj.companyNames.join(',') |
| | | this.isWorking = true |
| | | this.api.create(obj) |
| | | .then(() => { |
| | | this.visible = false |
| | | this.$tip.apiSuccess('æ°å»ºæå') |
| | | this.$emit('success') |
| | | }) |
| | | .catch(e => { |
| | | this.$tip.apiFailed(e) |
| | | }) |
| | | .finally(() => { |
| | | this.isWorking = false |
| | | }) |
| | | }) |
| | | }, |
| | | // ç¡®è®¤ä¿®æ¹ |
| | | __confirmEdit () { |
| | | this.$refs.form.validate((valid) => { |
| | | if (!valid) { |
| | | return |
| | | } |
| | | let obj = JSON.parse(JSON.stringify(this.form)) |
| | | obj.multifileList = [obj.multifileList] |
| | | obj.companyIds = obj.companyIds.join(',') |
| | | obj.companyNames = [] |
| | | this.form.companyIds.forEach(item => { |
| | | this.company.forEach(row => { |
| | | if (item === row.id) { |
| | | obj.companyNames.push(row.name) |
| | | } |
| | | }) |
| | | }) |
| | | obj.companyNames = obj.companyNames.join(',') |
| | | this.isWorking = true |
| | | this.api.updateById(obj) |
| | | .then(() => { |
| | | this.visible = false |
| | | this.$tip.apiSuccess('ä¿®æ¹æå') |
| | | this.$emit('success') |
| | | }) |
| | | .catch(e => { |
| | | this.$tip.apiFailed(e) |
| | | }) |
| | | .finally(() => { |
| | | this.isWorking = false |
| | | }) |
| | | }) |
| | | }, |
| | | open (title, target) { |
| | | this.title = title |
| | | this.visible = true |
| | | this.getAccount() |
| | | this.getFindAllCompanyList() |
| | | // æ°å»º |
| | | if (target == null) { |
| | | this.$nextTick(() => { |
| | | this.$refs.form.resetFields() |
| | | this.form[this.configData['field.id']] = null |
| | | }) |
| | | return |
| | | } |
| | | // ç¼è¾ |
| | | this.$nextTick(() => { |
| | | for (const key in this.form) { |
| | | this.form[key] = target[key] |
| | | } |
| | | }) |
| | | }, |
| | | deleFile () { |
| | | this.form.multifileList = null |
| | | }, |
| | | editFanganFile (data) { |
| | | this.form.multifileList = data |
| | | }, |
| | | getAccount() { |
| | | findUserList({}) |
| | | .then(res => { |
| | | console.log(res) |
| | | this.account = res |
| | | }) |
| | | }, |
| | | getFindAllCompanyList() { |
| | | findAllCompanyList({}) |
| | | .then(res => { |
| | | console.log(res) |
| | | this.company = res |
| | | }) |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | .list { |
| | | width: 100%; |
| | | padding: 10px 16px; |
| | | box-sizing: border-box; |
| | | background: #F4F7FC; |
| | | border-radius: 2px; |
| | | border: 1px solid #DFE2E8; |
| | | margin-top: 10px; |
| | | .list_label { |
| | | font-weight: 400; |
| | | font-size: 13px; |
| | | color: #333333; |
| | | } |
| | | .list_box { |
| | | width: 100%; |
| | | display: flex; |
| | | align-items: center; |
| | | flex-wrap: wrap; |
| | | .list_box_row { |
| | | padding: 0 10px; |
| | | box-sizing: border-box; |
| | | background: #FFFFFF; |
| | | border-radius: 2px; |
| | | display: flex; |
| | | align-items: center; |
| | | margin-right: 10px; |
| | | &:last-child { |
| | | margin: 0 !important; |
| | | } |
| | | span { |
| | | font-weight: 400; |
| | | font-size: 12px; |
| | | color: #3F4F69; |
| | | margin-right: 12px; |
| | | } |
| | | i { |
| | | color: #BFC3CB; |
| | | cursor: pointer; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | </style> |