| ¶Ô±ÈÐÂÎļþ |
| | |
| | | <template> |
| | | <el-dialog :title="titleMap[mode]" v-model="visible" :width="800" destroy-on-close @closed="$emit('closed')"> |
| | | <el-form :model="form" :rules="rules" :disabled="mode == 'show'" ref="dialogForm" label-width="120px" |
| | | label-position="center"> |
| | | <el-row> |
| | | <el-col :span="13"> |
| | | <el-form-item label="年份" prop="year"> |
| | | <el-select style="width: 240px;" v-model="form.year"> |
| | | <el-option v-for="(item, index) in option.years" :key="index" :label="item" :value="item"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="13"> |
| | | <el-form-item label="æ¥æ" prop="date"> |
| | | <el-date-picker value-format="YYYY-MM-DD" style="width: 240px;" v-model="form.date" type="daterange" |
| | | range-separator="è³" start-placeholder="å¼å§" end-placeholder="ç»æ" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="13"> |
| | | <el-form-item label="夿³¨" prop="remark"> |
| | | <el-input style="width: 240px;" v-model="form.remark" type="textarea"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <el-button @click="visible = false">å æ¶</el-button> |
| | | <el-button v-if="mode != 'show'" type="primary" :loading="isSaveing" @click="submit()">ä¿ å</el-button> |
| | | </template> |
| | | </el-dialog> |
| | | </template> |
| | | |
| | | <script> |
| | | import deepmerge from 'deepmerge' |
| | | import http from "@/utils/request" |
| | | export default { |
| | | emits: ['success', 'closed'], |
| | | props: { |
| | | option: { |
| | | type: Object |
| | | } |
| | | }, |
| | | data() { |
| | | return { |
| | | mode: "add", |
| | | titleMap: { |
| | | add: 'æ°å»ºä¼æ¯æ¥', |
| | | edit: 'ç¼è¾ä¼æ¯æ¥', |
| | | // show: 'æ¥ç' |
| | | }, |
| | | visible: false, |
| | | isSaveing: false, |
| | | //è¡¨åæ°æ® |
| | | form: { |
| | | id: '', |
| | | remark: "", |
| | | year: '', |
| | | date: '' |
| | | }, |
| | | //éªè¯è§å |
| | | rules: { |
| | | year: [ |
| | | { required: true, message: 'è¯·éæ©' } |
| | | ], |
| | | date: [ |
| | | { required: true, message: 'è¯·éæ©' } |
| | | ], |
| | | |
| | | }, |
| | | } |
| | | }, |
| | | created() { |
| | | }, |
| | | methods: { |
| | | //æ¾ç¤º |
| | | open(mode = 'add', params) { |
| | | this.mode = mode; |
| | | this.visible = true; |
| | | this.isSaveing = false; |
| | | if (params) { |
| | | let {remark,year,startOffDay,endOffDay,id} = params |
| | | this.form.remark = remark |
| | | this.form.year = year |
| | | this.form.date = [startOffDay,endOffDay] |
| | | this.form.id = id |
| | | |
| | | } else { |
| | | this.form.remark = '' |
| | | this.form.year = '' |
| | | this.form.date = [] |
| | | this.form.id = '' |
| | | } |
| | | return this |
| | | }, |
| | | //表åæäº¤æ¹æ³ |
| | | submit() { |
| | | this.$refs.dialogForm.validate(async (valid) => { |
| | | if (valid) { |
| | | this.isSaveing = true; |
| | | let {remark,year,id} = this.form |
| | | let [startOffDay = '',endOffDay = ''] = this.form.date |
| | | let data = { |
| | | endOffDay, |
| | | remark, |
| | | startOffDay, |
| | | year, |
| | | id |
| | | } |
| | | console.log('------',this.form.id) |
| | | let key = this.form.id ? 'update' : 'insert' |
| | | var res = await this.$API.time[key].post(data); |
| | | this.isSaveing = false; |
| | | if (res.code == 200) { |
| | | this.$emit('success', this.form, this.mode) |
| | | this.visible = false; |
| | | this.$message.success("æä½æå") |
| | | } else { |
| | | this.$alert(res.message, "æç¤º", { type: 'error' }) |
| | | } |
| | | } else { |
| | | this.isSaveing = false; |
| | | return false; |
| | | } |
| | | }) |
| | | }, |
| | | //è¡¨åæ³¨å
¥æ°æ® |
| | | setData(data) { |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style></style> |