| ¶Ô±ÈÐÂÎļþ |
| | |
| | | <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="24" style="padding:12px 0;"> |
| | | çå¶è¯¦æ
|
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="çå¶ç¼å·" prop="userName"> |
| | | <el-input style="width: 240px" v-model="form.userName" placeholder="å·¥ä½ç¼å·" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="çå¶åç§°" prop="userName"> |
| | | <el-input style="width: 240px" v-model="form.userName" placeholder="å·¥ä½åç§°" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="çå¶é¢è²" prop="userName"> |
| | | <el-input style="width: 240px" v-model="form.userName" placeholder="å·¥ä½åç§°" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="çå¶æ¶é´" prop="userName"> |
| | | <el-input style="width: 240px" v-model="form.userName" placeholder="å·¥ä½åç§°" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="24"> |
| | | çæ¬¡1 |
| | | </el-col> |
| | | <el-col :span="24"> |
| | | <el-form-item label="çæ¬¡åç§°" prop="userName"> |
| | | <el-input style="width: 240px" v-model="form.userName" placeholder="å·¥ä½åç§°" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="9"> |
| | | <el-form-item label="çæ¬¡æ¶é´" prop="userName"> |
| | | <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm" |
| | | placeholder="Arbitrary time" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="9"> |
| | | <el-form-item label="" prop="userName"> |
| | | <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm" |
| | | placeholder="Arbitrary time" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="9"> |
| | | <el-form-item label="伿¯æ¶æ®µ1" prop="userName"> |
| | | <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm" |
| | | placeholder="Arbitrary time" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="9"> |
| | | <el-form-item label="" prop="userName"> |
| | | <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm" |
| | | placeholder="Arbitrary time" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="9"> |
| | | <el-form-item label="伿¯æ¶æ®µ1" prop="userName"> |
| | | <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm" |
| | | placeholder="Arbitrary time" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="9"> |
| | | <el-form-item label="" prop="userName"> |
| | | <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm" |
| | | placeholder="Arbitrary time" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="9"> |
| | | <el-form-item label="伿¯æ¶æ®µ1" prop="userName"> |
| | | <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm" |
| | | placeholder="Arbitrary time" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="9"> |
| | | <el-form-item label="" prop="userName"> |
| | | <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm" |
| | | placeholder="Arbitrary time" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="9"> |
| | | <el-form-item label="伿¯æ¶æ®µ1" prop="userName"> |
| | | <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm" |
| | | placeholder="Arbitrary time" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="9"> |
| | | <el-form-item label="" prop="userName"> |
| | | <el-time-picker style="width: 100%;" v-model="form.userName" format="HH:mm" |
| | | placeholder="Arbitrary time" /> |
| | | </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 |
| | | } |
| | | }, |
| | | computed: { |
| | | options() { |
| | | let group = deepmerge([], this.option.group) |
| | | group[0].disabled = true |
| | | return { |
| | | ...this.option, |
| | | group, |
| | | calendarList: this.calendarList, |
| | | linkWays: this.linkWays, |
| | | work_type: this.work_type, |
| | | machining_type: this.machining_type |
| | | } |
| | | } |
| | | }, |
| | | data() { |
| | | return { |
| | | mode: "add", |
| | | titleMap: { |
| | | add: 'æ°å»ºçå¶', |
| | | edit: 'ç¼è¾çå¶', |
| | | // show: 'æ¥ç' |
| | | }, |
| | | params: {}, |
| | | visible: false, |
| | | isSaveing: false, |
| | | //è¡¨åæ°æ® |
| | | form: { |
| | | id: "", |
| | | userName: "", |
| | | avatar: "", |
| | | name: "", |
| | | dept: "", |
| | | group: [] |
| | | }, |
| | | //éªè¯è§å |
| | | rules: { |
| | | avatar: [ |
| | | { required: true, message: '请ä¸ä¼ 头å' } |
| | | ], |
| | | userName: [ |
| | | { required: true, message: '请è¾å
¥ç»å½è´¦å·' } |
| | | ], |
| | | name: [ |
| | | { required: true, message: '请è¾å
¥çå®å§å' } |
| | | ], |
| | | password: [ |
| | | { required: true, message: '请è¾å
¥ç»å½å¯ç ' }, |
| | | { |
| | | validator: (rule, value, callback) => { |
| | | if (this.form.password2 !== '') { |
| | | this.$refs.dialogForm.validateField('password2'); |
| | | } |
| | | callback(); |
| | | } |
| | | } |
| | | ], |
| | | password2: [ |
| | | { required: true, message: 'è¯·åæ¬¡è¾å
¥å¯ç ' }, |
| | | { |
| | | validator: (rule, value, callback) => { |
| | | if (value !== this.form.password) { |
| | | callback(new Error('两次è¾å
¥å¯ç ä¸ä¸è´!')); |
| | | } else { |
| | | callback(); |
| | | } |
| | | } |
| | | } |
| | | ], |
| | | dept: [ |
| | | { required: true, message: 'è¯·éæ©æå±é¨é¨' } |
| | | ], |
| | | group: [ |
| | | { required: true, message: 'è¯·éæ©æå±è§è²', trigger: 'change' } |
| | | ] |
| | | }, |
| | | //æéæ°æ®é项 |
| | | calendarList: [], |
| | | work_type: [], |
| | | machining_type: [], |
| | | linkWays: [ |
| | | { |
| | | label: 'å
³èæºå¨', |
| | | value: '0' |
| | | }, { |
| | | label: 'å建ååæºå¨', |
| | | value: '1' |
| | | } |
| | | ] |
| | | } |
| | | }, |
| | | created() { |
| | | this.$API.workstation.calendarList.get().then(res => { |
| | | this.calendarList = res.data |
| | | }) |
| | | this.$API.system.dic.getDic.get({ code: 'work_type' }).then(res => { |
| | | this.work_type = res.data |
| | | }) |
| | | this.$API.system.dic.getDic.get({ code: 'machining_type' }).then(res => { |
| | | this.machining_type = res.data |
| | | }) |
| | | }, |
| | | methods: { |
| | | //æ¾ç¤º |
| | | open(mode = 'add', params) { |
| | | this.mode = mode; |
| | | this.visible = true; |
| | | this.params = params |
| | | return this |
| | | }, |
| | | //表åæäº¤æ¹æ³ |
| | | submit() { |
| | | this.$refs.dialogForm.validate(async (valid) => { |
| | | if (valid) { |
| | | this.isSaveing = true; |
| | | var res = await this.$API.demo.post.post(this.form); |
| | | 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 { |
| | | return false; |
| | | } |
| | | }) |
| | | }, |
| | | //è¡¨åæ³¨å
¥æ°æ® |
| | | setData(data) { |
| | | this.form.id = data.id |
| | | this.form.userName = data.userName |
| | | this.form.avatar = data.avatar |
| | | this.form.name = data.name |
| | | this.form.group = data.group |
| | | this.form.dept = data.dept |
| | | |
| | | //å¯ä»¥åä¸é¢ä¸æ ·å个注å
¥ï¼ä¹å¯ä»¥åä¸é¢ä¸æ ·ç´æ¥åå¹¶è¿å» |
| | | //Object.assign(this.form, data) |
| | | } |
| | | } |
| | | } |
| | | </script> |
| | | |
| | | <style></style> |