|  |  |  | 
|---|
|  |  |  | <div class="main_content"> | 
|---|
|  |  |  | <el-form :model="form" label-position="top" ref="form" :rules="rules"> | 
|---|
|  |  |  | <div class="list"> | 
|---|
|  |  |  | <el-form-item label="物料编码" prop="contractId"> | 
|---|
|  |  |  | <el-input v-model="form.renterName" placeholder="不输入系统会自动编码" v-trim /> | 
|---|
|  |  |  | <el-form-item label="物料编码" prop="code"> | 
|---|
|  |  |  | <el-input v-model="form.code" placeholder="不输入系统会自动编码" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="物料名称" prop="renterName"> | 
|---|
|  |  |  | <el-input v-model="form.renterName" placeholder="请输入" v-trim /> | 
|---|
|  |  |  | <el-form-item label="物料名称" prop="name"> | 
|---|
|  |  |  | <el-input v-model="form.name" placeholder="请输入" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="物料分类" prop="ywContractRoomList"> | 
|---|
|  |  |  | <el-select v-model="form.ywContractRoomList" placeholder="请选择"> | 
|---|
|  |  |  | <el-option | 
|---|
|  |  |  | v-for="(item, index) in houseList" | 
|---|
|  |  |  | :key="index" | 
|---|
|  |  |  | :value="item.id" | 
|---|
|  |  |  | :label="item.projectName + item.buildingName + item.floorName + item.roomName" /> | 
|---|
|  |  |  | </el-select> | 
|---|
|  |  |  | <el-form-item label="物料分类" prop="cateArr"> | 
|---|
|  |  |  | <el-cascader | 
|---|
|  |  |  | v-model="form.cateArr" | 
|---|
|  |  |  | :options="cateList" | 
|---|
|  |  |  | @change="getCateVal" | 
|---|
|  |  |  | :props="{ label: 'name', value: 'id', children: 'childCategoryList' }" | 
|---|
|  |  |  | placeholder="请选择" /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="条码" prop="costType"> | 
|---|
|  |  |  | <el-input v-model="form.renterName" placeholder="请输入" v-trim /> | 
|---|
|  |  |  | <el-form-item label="条码" prop="qrcode"> | 
|---|
|  |  |  | <el-input v-model="form.qrcode" placeholder="请输入" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="品牌" prop="date"> | 
|---|
|  |  |  | <el-input v-model="form.renterName" placeholder="请输入" v-trim /> | 
|---|
|  |  |  | <el-form-item label="品牌" prop="brand"> | 
|---|
|  |  |  | <el-input v-model="form.brand" placeholder="请输入" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="规格型号" prop="totleFee"> | 
|---|
|  |  |  | <el-input v-model="form.renterName" placeholder="请输入" v-trim /> | 
|---|
|  |  |  | <el-form-item label="规格型号" prop="attr"> | 
|---|
|  |  |  | <el-input v-model="form.attr" placeholder="请输入" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="安全库存(下限)" prop="planPayDate"> | 
|---|
|  |  |  | <el-input v-model="form.renterName" placeholder="请输入" v-trim /> | 
|---|
|  |  |  | <el-form-item label="安全库存(下限)" prop="minStock"> | 
|---|
|  |  |  | <el-input v-model="form.minStock" placeholder="请输入" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="安全库存(上限)" prop="companyId"> | 
|---|
|  |  |  | <el-input v-model="form.renterName" placeholder="请输入" v-trim /> | 
|---|
|  |  |  | <el-form-item label="安全库存(上限)" prop="maxStock"> | 
|---|
|  |  |  | <el-input v-model="form.maxStock" placeholder="请输入" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="单位" prop="companyId"> | 
|---|
|  |  |  | <el-input v-model="form.renterName" placeholder="请输入" v-trim /> | 
|---|
|  |  |  | <el-form-item label="单位" prop="unitName"> | 
|---|
|  |  |  | <el-input v-model="form.unitName" placeholder="请输入" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="所属项目" prop="companyId"> | 
|---|
|  |  |  | <el-select v-model="form.ywContractRoomList" placeholder="请选择"> | 
|---|
|  |  |  | <el-option | 
|---|
|  |  |  | v-for="(item, index) in houseList" | 
|---|
|  |  |  | :key="index" | 
|---|
|  |  |  | :value="item.id" | 
|---|
|  |  |  | :label="item.projectName + item.buildingName + item.floorName + item.roomName" /> | 
|---|
|  |  |  | </el-select> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="所属房源" prop="companyId"> | 
|---|
|  |  |  | <el-select v-model="form.ywContractRoomList" placeholder="请选择"> | 
|---|
|  |  |  | <el-option | 
|---|
|  |  |  | v-for="(item, index) in houseList" | 
|---|
|  |  |  | :key="index" | 
|---|
|  |  |  | :value="item.id" | 
|---|
|  |  |  | :label="item.projectName + item.buildingName + item.floorName + item.roomName" /> | 
|---|
|  |  |  | </el-select> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="物料照片" prop="companyId"> | 
|---|
|  |  |  | <el-form-item label="物料照片" prop="multifile"> | 
|---|
|  |  |  | <el-upload | 
|---|
|  |  |  | class="upload-demo" | 
|---|
|  |  |  | :show-file-list="false" | 
|---|
|  |  |  | :data="uploadData" | 
|---|
|  |  |  | :action="uploadImgUrl" | 
|---|
|  |  |  | :file-list="fileList" | 
|---|
|  |  |  | :data="uploadData" | 
|---|
|  |  |  | list-type="picture-card" | 
|---|
|  |  |  | :on-success="uploadAvatarSuccess" | 
|---|
|  |  |  | :before-upload="beforeUpload" | 
|---|
|  |  |  | :on-error="uploadError"> | 
|---|
|  |  |  | <el-button icon="el-icon-plus" plain>上传</el-button> | 
|---|
|  |  |  | :on-remove="dele"> | 
|---|
|  |  |  | <i class="el-icon-plus"></i> | 
|---|
|  |  |  | </el-upload> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item style="width: 100%;" label="备注" prop="remark"> | 
|---|
|  |  |  | 
|---|
|  |  |  | <script> | 
|---|
|  |  |  | import GlobalWindow from '@/components/common/GlobalWindow' | 
|---|
|  |  |  | import BaseOpera from '@/components/base/BaseOpera' | 
|---|
|  |  |  | import { fetchList } from '@/api/business/category.js' | 
|---|
|  |  |  | export default { | 
|---|
|  |  |  | name: 'newMaterial', | 
|---|
|  |  |  | components: { | 
|---|
|  |  |  | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | extends: BaseOpera, | 
|---|
|  |  |  | data () { | 
|---|
|  |  |  | var validateCateArr = (rule, value, callback) => { | 
|---|
|  |  |  | if (value.length === 0) { | 
|---|
|  |  |  | callback(new Error('请选择物料分类')); | 
|---|
|  |  |  | } else { | 
|---|
|  |  |  | callback(); | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }; | 
|---|
|  |  |  | return { | 
|---|
|  |  |  | form: { | 
|---|
|  |  |  | contractId: '', | 
|---|
|  |  |  | renterName: '', | 
|---|
|  |  |  | renterId: '', | 
|---|
|  |  |  | costType: '', | 
|---|
|  |  |  | type: '', | 
|---|
|  |  |  | companyId: '', | 
|---|
|  |  |  | id: null, | 
|---|
|  |  |  | code: '', | 
|---|
|  |  |  | name: '', | 
|---|
|  |  |  | parentCateId: '', | 
|---|
|  |  |  | cateId: '', | 
|---|
|  |  |  | cateArr: [], | 
|---|
|  |  |  | multifile: {}, | 
|---|
|  |  |  | remark: '', | 
|---|
|  |  |  | startDate: '', | 
|---|
|  |  |  | endDate: '', | 
|---|
|  |  |  | totleFee: '', | 
|---|
|  |  |  | planPayDate: '', | 
|---|
|  |  |  | multifileList: [], | 
|---|
|  |  |  | ywContractRoomList: [], | 
|---|
|  |  |  | date: [], | 
|---|
|  |  |  | RoomName: '' | 
|---|
|  |  |  | unitName: '', | 
|---|
|  |  |  | maxStock: '', | 
|---|
|  |  |  | minStock: '', | 
|---|
|  |  |  | attr: '', | 
|---|
|  |  |  | brand: '', | 
|---|
|  |  |  | qrcode: '' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | rules: [], | 
|---|
|  |  |  | loadingInstance: null, | 
|---|
|  |  |  | rules: { | 
|---|
|  |  |  | name: [ | 
|---|
|  |  |  | { required: true, message: '请输入物料名称', trigger: 'blur' } | 
|---|
|  |  |  | ], | 
|---|
|  |  |  | cateArr: [ | 
|---|
|  |  |  | { required: true, validator: validateCateArr, trigger: 'blur' } | 
|---|
|  |  |  | ], | 
|---|
|  |  |  | qrcode: [ | 
|---|
|  |  |  | { required: true, message: '请输入条码', trigger: 'blur' } | 
|---|
|  |  |  | ] | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | cateList: [], | 
|---|
|  |  |  | uploadImgUrl: process.env.VUE_APP_API_PREFIX + '/visitsAdmin/cloudService/public/uploadBatch', | 
|---|
|  |  |  | fileList: [], | 
|---|
|  |  |  | uploadData: { | 
|---|
|  |  |  | folder: 'YW_CONTRACT_BILL' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | folder: 'YW_MATERIAL' | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | created () { | 
|---|
|  |  |  | this.config({ | 
|---|
|  |  |  | api: '/ywMaterial' | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | methods: { | 
|---|
|  |  |  | open (title, target) { | 
|---|
|  |  |  | this.title = title | 
|---|
|  |  |  | this.fileList = [] | 
|---|
|  |  |  | this.visible = true | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | dele (imgaddr) { | 
|---|
|  |  |  | this.form.multifileList.forEach((item, index) => { | 
|---|
|  |  |  | if (imgaddr === item.imgaddr) { | 
|---|
|  |  |  | this.form.multifileList.splice(index, 1) | 
|---|
|  |  |  | this.getCategry() | 
|---|
|  |  |  | // 新建 | 
|---|
|  |  |  | 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] | 
|---|
|  |  |  | } | 
|---|
|  |  |  | if (this.form.multifile) { | 
|---|
|  |  |  | this.fileList = [ | 
|---|
|  |  |  | { url: this.form.multifile.fileurlFull, ...this.form.multifile } | 
|---|
|  |  |  | ] | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | beforeUpload (file) { | 
|---|
|  |  |  | this.loadingInstance = Loading.service({ | 
|---|
|  |  |  | lock: true, | 
|---|
|  |  |  | text: 'Loading', | 
|---|
|  |  |  | spinner: 'el-icon-loading', | 
|---|
|  |  |  | background: 'rgba(0, 0, 0, 0.7)' | 
|---|
|  |  |  | getCateVal(e) { | 
|---|
|  |  |  | this.form.parentCateId = e[0] | 
|---|
|  |  |  | this.form.cateId = e[1] | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | getCategry() { | 
|---|
|  |  |  | fetchList({ | 
|---|
|  |  |  | capacity: 1000, | 
|---|
|  |  |  | model: { | 
|---|
|  |  |  | type: 7 | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | page: 1 | 
|---|
|  |  |  | }).then(res => { | 
|---|
|  |  |  | this.cateList = res.records | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | uploadError () { | 
|---|
|  |  |  | this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭 | 
|---|
|  |  |  | if (this.loadingInstance) { | 
|---|
|  |  |  | this.loadingInstance.close() | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | dele (e) { | 
|---|
|  |  |  | this.fileList = [] | 
|---|
|  |  |  | this.form.multifile = {} | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | uploadAvatarSuccess (file) { | 
|---|
|  |  |  | this.$nextTick(() => { | 
|---|
|  |  |  | if (this.loadingInstance) { | 
|---|
|  |  |  | this.loadingInstance.close() | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | const item = file.data[0] | 
|---|
|  |  |  | this.form.multifileList.push({ ...item, fileurl: item.imgaddr, name: item.originname, userName: this.userInfo.realname, createTime: this.getDay() }) | 
|---|
|  |  |  | this.fileList.push({ ...item, fileurl: item.imgaddr, name: item.originname }) | 
|---|
|  |  |  | this.form.multifile = { ...item, fileurl: item.imgaddr, name: item.originname } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|