<el-form ref="form" :model="form" :rules="rules" label-width="100px">

<el-form-item label="归属部门" ref="deptId" prop="deptId">
              <treeselect v-model="form.deptId" @input="handleTreeSelectChange" :options="deptOptions"
                :disable-branch-nodes="true" :show-count="true" placeholder="请选择归属部门" />
            </el-form-item>


<el-form-item label="音频" ref="qVoice" prop="qVoice" style="margin-bottom: 10px;">
          <el-upload ref="upload" :show-file-list="false" class="upload-demo" :on-success="handleSuccess"
            :headers="headers" :accept="'audio/*'" :action="uploadUrl" :file-list="fileList" :before-remove="beforeRemove"
            :on-exceed="handleExceed" :limit="1">
            <el-button size="small" type="primary">点击上传</el-button>
            <div slot="tip" class="el-upload__tip" style="height: 20px;">
              只能上传音频文件,大小不能超过500M
            </div>
            <div v-if="fileList.length > 0" slot="tip" class="el-upload__tip bgList"><i class="el-icon-document"></i>
              <span>{{ fileList[0].name }}</span><i class="el-icon-upload-success el-icon-circle-check bgListSuccess"
                style="color: #13ce66;margin-left: 30px;"></i><i style="margin-left: 30px;"
                class="el-icon-close bgListclose" @click="delFileList"></i>
            </div>
          </el-upload>
        </el-form-item>
</el-form>
 rules: {
        qVoice: [
          { required: true, message: "音频不能为空", trigger: 'blur' },

        ],
        deptId: [
          { required: true, message: "归属部门不能为空", trigger: "blur" }
        ],
      
      }


//归属部门有值就清空

 handleTreeSelectChange (value) {
      if (value) {
        this.$refs.form.validateField('deptId')
      }
    },


//音频上传成功清空
  handleSuccess (response, file) {
      this.$refs.qVoice.clearValidate()
    },

Logo

前往低代码交流专区

更多推荐