irc_web/src/views/system/notice/components/from.vue

180 lines
7.4 KiB
Vue

<template>
<base-model :config="model_cfg">
<template slot="dialog-body">
<el-form ref="NoticeForm" :model="form" :rules="rules" label-width="180px" size="small">
<el-form-item :label="$t('system:notice:label:NoticeLevel')" prop="NoticeLevelEnum">
<el-select v-model="form.NoticeLevelEnum" clearable size="small">
<el-option v-for="item of dict.type.NoteLevel" :key="item.value" :label="item.label"
:value="item.raw.Code * 1" />
</el-select>
</el-form-item>
<el-form-item :label="$t('system:notice:label:NoticeType')" prop="NoticeTypeEnum">
<el-select v-model="form.NoticeTypeEnum" clearable size="small">
<el-option v-for="item of dict.type.NoteType" :key="item.value" :label="item.label"
:value="item.raw.Code * 1" />
</el-select>
</el-form-item>
<el-form-item :label="$t('system:notice:label:ApplicableProject')" prop="ApplicableProjectEnum">
<el-select v-model="form.ApplicableProjectEnum" clearable size="small">
<el-option v-for="item of dict.type.NoticeApplicableTrial" :key="item.value" :label="item.label"
:value="item.raw.Code * 1" />
</el-select>
</el-form-item>
<el-form-item :label="$t('system:notice:label:NoticeUserTypeIdList')" prop="NoticeUserTypeIdList">
<el-select v-model="form.NoticeUserTypeIdList" multiple clearable size="small">
<el-option v-for="item of roleList" :key="item.Id" :label="item.UserTypeShortName" :value="item.Id" />
</el-select>
</el-form-item>
<el-form-item :label="$t('system:notice:label:NoticeMode')" prop="NoticeModeEnum">
<el-select v-model="form.NoticeModeEnum" clearable size="small">
<el-option v-for="item of dict.type.NoticeMode" :key="item.value" :label="item.label"
:value="item.raw.Code * 1" />
</el-select>
</el-form-item>
<el-form-item :label="$t('system:notice:label:StartDate')" prop="StartDate">
<el-date-picker v-model="form.StartDate" type="datetime" />
</el-form-item>
<el-form-item :label="$t('system:notice:label:EndDate')" prop="EndDate">
<el-date-picker v-model="form.EndDate" type="datetime" :default-time="'23:59:59'" />
</el-form-item>
<el-form-item v-if="!form.Id" :label="$t('system:notice:label:IsPush')" prop="IsPush">
<el-switch v-model="form.IsPush" :active-value="true" :inactive-value="false" />
</el-form-item>
<el-form-item :label="$t('system:notice:label:NoticeContent')" prop="NoticeContent">
<el-input v-model="form.NoticeContent" type="textarea" :autosize="{ minRows: 2, maxRows: 4 }" />
</el-form-item>
<el-form-item :label="$t('system:notice:label:file')">
<el-upload class="upload-demo" action :before-upload="beforeUpload" :http-request="handleUploadFile"
:on-preview="handlePreview" :on-remove="handleRemoveFile" :show-file-list="true" :limit="1"
:file-list="fileList">
<el-button size="small" type="primary"
:disabled="fileList.length > 0">{{ $t('common:button:upload') }}</el-button>
</el-upload>
</el-form-item>
</el-form>
</template>
<template slot="dialog-footer">
<el-button :disabled="btnLoading" size="small" type="primary" @click="handleCancle">{{ $t('common:button:cancel')
}}</el-button>
<el-button size="small" type="primary" :loading="btnLoading" @click="handleSave">{{ $t('common:button:save')
}}</el-button>
</template>
</base-model>
</template>
<script>
import { addOrUpdateSystemNotice, uploadSystemNoticeDoc } from '@/api/system/notice'
import BaseModel from '@/components/BaseModel'
const formDataDefault = () => {
return {
Id: null,
NoticeLevelEnum: null,
NoticeTypeEnum: null,
NoticeContent: null,
ApplicableProjectEnum: null,
NoticeModeEnum: null,
NoticeStateEnum: 0,
StartDate: null,
EndDate: null,
FileName: null,
Path: null,
IsPush: false,
NoticeUserTypeIdList: []
}
}
export default {
components: { BaseModel },
props: {
roleList: {
type: Array,
default() {
return []
}
}
},
dicts: ['NoticeApplicableTrial', 'NoteLevel', 'NoteType', 'NoticeState', 'NoticeMode'],
data() {
return {
btnLoading: false,
form: formDataDefault(),
rules: {
NoticeLevelEnum: [{ required: true, message: 'Please specify', trigger: 'blur' }],
NoticeTypeEnum: [{ required: true, message: 'Please specify', trigger: 'blur' }],
NoticeContent: [{ required: true, message: 'Please specify', trigger: 'blur' }],
ApplicableProjectEnum: [{ required: true, message: 'Please specify', trigger: 'blur' }],
NoticeModeEnum: [{ required: true, message: 'Please specify', trigger: 'blur' }],
// NoticeStateEnum: [{ required: true, message: 'Please specify', trigger: 'blur' }],
NoticeUserTypeIdList: [{ required: true, message: 'Please specify', trigger: 'blur' }]
},
fileList: [],
model_cfg: { visible: false, showClose: true, width: '600px', title: '', appendToBody: true }
}
},
mounted() {
},
methods: {
handleRemoveFile() {
this.form.FileName = null
this.form.Path = null
this.fileList = []
},
beforeUpload() {
if (this.fileList.length > 0) {
this.$alert(this.$t('system:notice:msg:message1'))
return
}
},
handlePreview(row, r2) {
if (row.fullPath) {
window.open(row.fullPath, '_blank')
}
},
async handleUploadFile(param) {
this.loading = true
var file = await this.fileToBlob(param.file)
const res = await this.OSSclient.put(`/System/NoticeAttachment/${param.file.name}`, file)
this.fileList.push({ name: param.file.name, path: this.$getObjectName(res.url), fullPath: this.$getObjectName(res.url), url: this.$getObjectName(res.url) })
this.form.Path = this.$getObjectName(res.url)
this.form.FileName = param.file.name
this.loading = false
},
openDialog(title, data) {
this.model_cfg.visible = true
this.model_cfg.title = title
this.fileList = []
if (Object.keys(data).length) {
this.form = { ...data }
if (this.form.FileName) {
this.fileList[0] = { name: this.form.FileName, path: this.form.FilePath, fullPath: this.form.FullFilePath }
}
this.$set(this.form, 'NoticeUserTypeIdList', this.form.NoticeUserTypeList.map(v => v.Id))
} else {
this.form = formDataDefault()
}
},
handleSave() {
this.$refs.NoticeForm.validate(valid => {
if (!this.form.Id && this.form.IsPush) {
this.form.NoticeStateEnum = 1
}
if (valid) {
this.form.StartDate = this.form.StartDate ? this.parseTime(this.form.StartDate) : null
this.form.EndDate = this.parseTime(this.form.EndDate) ? this.parseTime(this.form.EndDate) : null
this.btnLoading = true
addOrUpdateSystemNotice(this.form).then(res => {
this.btnLoading = false
this.$message.success('Saved successfully!')
this.model_cfg.visible = false
this.$emit('getList')
}).catch(() => {
this.btnLoading = false
})
}
})
},
handleCancle() {
this.model_cfg.visible = false
}
}
}
</script>