85 lines
2.5 KiB
Vue
85 lines
2.5 KiB
Vue
<template>
|
|
<a-page-header style="padding: 10px; font-size: 20px" @back="handleBack">
|
|
<template #extra>
|
|
<a-button v-if="route.query.type !== 'SEARCH'" key="1" type="primary" @click="onSubmit">保存</a-button>
|
|
</template>
|
|
</a-page-header>
|
|
|
|
<a-card :bordered="false" title="公众号">
|
|
<DynamicForm
|
|
:allDisabled="route.query.type === 'SEARCH'"
|
|
:formItems="officialAccountFormItems"
|
|
:model="formData"
|
|
:rules="formRules"
|
|
ref="formRef1"
|
|
/>
|
|
</a-card>
|
|
|
|
<a-card :bordered="false" class="mt-4" style="height: 100%">
|
|
<a-tabs v-model:activeKey="activeKey">
|
|
<a-tab-pane key="1" tab="基本信息" forceRender>
|
|
<DynamicForm
|
|
:allDisabled="route.query.type === 'SEARCH'"
|
|
:formItems="basicInfoFormItems"
|
|
:model="formData"
|
|
:rules="formRules"
|
|
ref="formRef2"
|
|
/>
|
|
</a-tab-pane>
|
|
<a-tab-pane key="2" tab="扩展字段" forceRender v-if="extendData.length > 0">
|
|
<DynamicForm
|
|
:allDisabled="route.query.type === 'SEARCH'"
|
|
:formItems="extendData"
|
|
:model="extendFormData"
|
|
:rules="formRules"
|
|
v-if="extendData.length > 0"
|
|
/>
|
|
|
|
<a-empty v-else />
|
|
</a-tab-pane>
|
|
<a-tab-pane key="3" tab="操作信息" v-if="route.query.type !== 'ADD'">
|
|
<OperationalInformation :detailData="inform" :colSpan="6"></OperationalInformation>
|
|
</a-tab-pane>
|
|
</a-tabs>
|
|
</a-card>
|
|
</template>
|
|
|
|
<script setup name="publicAccountDetail">
|
|
import { required } from '@/utils/formRules'
|
|
import officialAccountApi from '@/api/base/wx/officialAccountApi'
|
|
import useFormHandler from '@/hook/useFormHandler'
|
|
import { basicInfoFormItems, officialAccountFormItems } from '@/views/basicData/client/formItems'
|
|
import { useRoute } from 'vue-router'
|
|
const route = useRoute()
|
|
|
|
const formRules = {
|
|
name: [required('请输入名称')],
|
|
type: [required('请输入类型')],
|
|
appid: [required('请输入AppID')],
|
|
secret: [required('请输入AppSecret')]
|
|
}
|
|
|
|
const formRef1 = ref(null)
|
|
const formRef2 = ref(null)
|
|
let detailData = ref({})
|
|
let activeKey = ref('1')
|
|
let extendData = ref([])
|
|
|
|
const { formData, formRefs, inform, extendFormData, onSubmit, handleBack, fetchData, getExtendField } =
|
|
useFormHandler([...officialAccountFormItems, ...basicInfoFormItems], {
|
|
submitForm: officialAccountApi.officialAccountSubmitForm,
|
|
getDetail: officialAccountApi.officialAccountDetail
|
|
})
|
|
|
|
onMounted(async () => {
|
|
formRefs.value = [formRef1.value, formRef2.value]
|
|
fetchData(route.query.type).then((res) => {
|
|
if (res) {
|
|
detailData.value = res
|
|
}
|
|
})
|
|
|
|
extendData.value = await getExtendField('MATERIAL')
|
|
})
|
|
</script>
|