flower-web-admin/src/views/system/client/components/edit.vue
sdaduanbilei-d1581 8bb2f8e221 fix
2025-12-29 14:59:52 +08:00

126 lines
3.7 KiB
Vue

<template>
<div>
<Button type="tertiary" theme="borderless" @click="show = true">{{ type === 'edit'? '编辑' : type === 'addSub' ? '新增子项':'新增'}}</Button>
<Modal
v-model:visible="show"
width="640px"
@ok="handleOk"
:maskClosable="false"
@cancel="handleCancel"
>
<Form
:labelPosition="'top'"
:initValues="form"
:getFormApi="bindFormApi"
ref="formRef"
>
<Form.Input
field="name"
label="名称"
:rules="[{ required: true, message: '请填写名称' }]"
placeholder="请输入名称"
/>
</Form>
</Modal>
</div>
</template>
<script>
import { Modal, Button, Form, Toast, Notification } from '@kousum/semi-ui-vue'
export default {
components: {
Modal,
Button,
Form,
'Form.Input': Form.Input
},
props: {
type: {
type: String,
default: 'new'
},
info:{
type: Object,
default:null
}
},
data() {
return {
show: false,
form: {
id:'',
name: '',
sort: 1,
},
formApi: null
}
},
watch: {
info: {
handler(val) {
if (val) {
this.form = { ...val }
this.$nextTick(() => {
if (this.formApi) {
if (this.type === 'addSub'){
this.formApi.setValues({ parentId: val.id })
} else if (this.type === 'edit'){
this.formApi.setValues(val)
}
}
})
}
},
immediate: true
}
},
methods: {
bindFormApi(api) {
this.formApi = api
},
handleCancel() {
// Optional
},
handleOk() {
return new Promise((resolve, reject) => {
this.formApi.validate().then(values => {
const formData = { ...this.form, ...values }
if (this.form.id !== "" && this.type !== 'new'){
this.$api.sys.clientUpdate(formData).then(res => {
if (res.code === 200) {
Toast.success(res.msg)
this.$emit('ok')
resolve()
} else {
Notification.error({ content: res.msg })
reject()
}
}).catch(() => reject())
} else {
this.$api.sys.clientSave(formData).then(res => {
if (res.code === 200) {
Toast.success(res.msg)
this.$emit('ok')
resolve()
} else {
Notification.error({ content: res.msg })
reject()
}
}).catch(() => reject())
}
}).catch(errors => {
reject()
})
})
},
submit(done) {
// legacy
}
}
}
</script>
<style lang="scss" scoped></style>