|
@@ -27,24 +27,26 @@
|
|
|
</template>
|
|
</template>
|
|
|
<script lang="ts" setup>
|
|
<script lang="ts" setup>
|
|
|
import { computed, ref, reactive, watch } from 'vue'
|
|
import { computed, ref, reactive, watch } from 'vue'
|
|
|
-import type { FormInstanceFunctions, FormProps } from 'tdesign-vue-next'
|
|
|
|
|
|
|
+import type { FormInstanceFunctions } from 'tdesign-vue-next'
|
|
|
import ImageUpload from '@/components/ImageUpload.vue'
|
|
import ImageUpload from '@/components/ImageUpload.vue'
|
|
|
import { createCarousal, updateCarousalItem } from '@/api/carousal'
|
|
import { createCarousal, updateCarousalItem } from '@/api/carousal'
|
|
|
-// Todo: 改为ts方式
|
|
|
|
|
-const props = defineProps<{
|
|
|
|
|
- isEdit?: Boolean | null
|
|
|
|
|
- headerTitle?: String | null
|
|
|
|
|
- carousal: {} | number
|
|
|
|
|
-}>()
|
|
|
|
|
|
|
+import type {CreateCarousalsRequest, UpdateCarousalsRequest} from "@/model/carousals";
|
|
|
|
|
+const props = withDefaults(defineProps<{
|
|
|
|
|
+ isEdit?: boolean | null
|
|
|
|
|
+ headerTitle?: string | null
|
|
|
|
|
+ carousal: CreateCarousalsRequest
|
|
|
|
|
+}>(),{
|
|
|
|
|
+ headerTitle:''
|
|
|
|
|
+})
|
|
|
const emit = defineEmits<{
|
|
const emit = defineEmits<{
|
|
|
- success: [string]
|
|
|
|
|
|
|
+ success: [void]
|
|
|
}>()
|
|
}>()
|
|
|
const formRef = ref<FormInstanceFunctions | null>(null)
|
|
const formRef = ref<FormInstanceFunctions | null>(null)
|
|
|
const headerText = computed(() => `${props.isEdit ? '编辑' : '创建'}${props.headerTitle || ''}`)
|
|
const headerText = computed(() => `${props.isEdit ? '编辑' : '创建'}${props.headerTitle || ''}`)
|
|
|
const confirmBtnText = computed(() => (props.isEdit ? '保存' : '确定'))
|
|
const confirmBtnText = computed(() => (props.isEdit ? '保存' : '确定'))
|
|
|
const formType = computed(() => `${props.isEdit ? 'update' : 'add'}`)
|
|
const formType = computed(() => `${props.isEdit ? 'update' : 'add'}`)
|
|
|
|
|
|
|
|
-const carousalData = ref<FormProps['data']>({
|
|
|
|
|
|
|
+const carousalData = ref<UpdateCarousalsRequest>({
|
|
|
imageUrl: '',
|
|
imageUrl: '',
|
|
|
targetType: 'article',
|
|
targetType: 'article',
|
|
|
targetId: '',
|
|
targetId: '',
|
|
@@ -90,18 +92,17 @@ const typeOption = reactive([
|
|
|
])
|
|
])
|
|
|
const handleFormTypeData = () => {
|
|
const handleFormTypeData = () => {
|
|
|
if (carousalData.value.targetType === 'article') {
|
|
if (carousalData.value.targetType === 'article') {
|
|
|
- delete carousalData.value.targetUrl
|
|
|
|
|
|
|
+ carousalData.value.targetUrl = null
|
|
|
} else if (carousalData.value.targetType === 'url') {
|
|
} else if (carousalData.value.targetType === 'url') {
|
|
|
- delete carousalData.value.targetId
|
|
|
|
|
|
|
+ carousalData.value.targetId = null
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
watch(
|
|
watch(
|
|
|
() => props.carousal,
|
|
() => props.carousal,
|
|
|
- (newClassify) => {
|
|
|
|
|
|
|
+ (newClassify: CreateCarousalsRequest) => {
|
|
|
carousalData.value = Object.assign({}, newClassify)
|
|
carousalData.value = Object.assign({}, newClassify)
|
|
|
const carousalObj = Object.assign({},newClassify)
|
|
const carousalObj = Object.assign({},newClassify)
|
|
|
- // imgUrl.value.url = carousalObj.imageUrl || ''
|
|
|
|
|
imgUrl.value = { url: carousalObj.imageUrl || '' }
|
|
imgUrl.value = { url: carousalObj.imageUrl || '' }
|
|
|
},
|
|
},
|
|
|
{
|
|
{
|
|
@@ -113,42 +114,24 @@ const fetchSaveCarousalData = async () => {
|
|
|
/* TODO: 保存分类数据 */
|
|
/* TODO: 保存分类数据 */
|
|
|
if (formRef.value) {
|
|
if (formRef.value) {
|
|
|
const valid = await formRef.value.validate()
|
|
const valid = await formRef.value.validate()
|
|
|
- // console.log(valid,'valid')
|
|
|
|
|
if (valid && typeof valid === 'boolean') {
|
|
if (valid && typeof valid === 'boolean') {
|
|
|
/* TODO: 校验通过保存分类数据 */
|
|
/* TODO: 校验通过保存分类数据 */
|
|
|
handleFormTypeData()
|
|
handleFormTypeData()
|
|
|
- // console.log(formType.value,'formType')
|
|
|
|
|
- let res
|
|
|
|
|
-
|
|
|
|
|
- switch (formType.value){
|
|
|
|
|
- case 'create':
|
|
|
|
|
- res = await createCarousal(carousalData.value)
|
|
|
|
|
- emit('success')
|
|
|
|
|
- break;
|
|
|
|
|
- case 'update':
|
|
|
|
|
- const fieldsToKeep = ["imageUrl", "targetType", "targetUrl", "targetId"];
|
|
|
|
|
- const requestObj = {};
|
|
|
|
|
-
|
|
|
|
|
- for (const field of fieldsToKeep) {
|
|
|
|
|
- if (carousalData.value[field]!== null && carousalData.value[field]!== undefined) {
|
|
|
|
|
- requestObj[field] = carousalData.value[field];
|
|
|
|
|
- }
|
|
|
|
|
- }
|
|
|
|
|
- handleFormTypeData()
|
|
|
|
|
- res = await updateCarousalItem(carousalData.value.id,requestObj)
|
|
|
|
|
- emit('success')
|
|
|
|
|
- break;
|
|
|
|
|
- default:
|
|
|
|
|
- res = await createCarousal(carousalData.value)
|
|
|
|
|
- emit('success')
|
|
|
|
|
- break;
|
|
|
|
|
- }
|
|
|
|
|
- // const createCarousalApi = createCarousal(carousalData.value)
|
|
|
|
|
- // console.log(createCarousalApi,'createCarousalApi')
|
|
|
|
|
|
|
+ formType.value === 'add' ? await createCarousalData() : await updateCarousalData()
|
|
|
return
|
|
return
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
}
|
|
}
|
|
|
|
|
+const createCarousalData = async () => {
|
|
|
|
|
+ await createCarousal(carousalData.value)
|
|
|
|
|
+ emit('success')
|
|
|
|
|
+}
|
|
|
|
|
+const updateCarousalData = async () => {
|
|
|
|
|
+ handleFormTypeData()
|
|
|
|
|
+ const requestObj: CreateCarousalsRequest = {imageUrl: carousalData.value.imageUrl,targetType:carousalData.value.targetType,targetUrl:carousalData.value.targetUrl,targetId:carousalData.value.targetId}
|
|
|
|
|
+ await updateCarousalItem(carousalData.value.id, requestObj)
|
|
|
|
|
+ emit('success')
|
|
|
|
|
+}
|
|
|
const handleCloseDialog = () => {
|
|
const handleCloseDialog = () => {
|
|
|
// 数据&&规则校验结果重置
|
|
// 数据&&规则校验结果重置
|
|
|
if (formRef.value) {
|
|
if (formRef.value) {
|