feat: 咨询管理代码审查

components.d.ts

@@ -37,6 +37,7 @@ declare module 'vue' {
     TSpace: typeof import('tdesign-vue-next')['Space']
     TTable: typeof import('tdesign-vue-next')['Table']
     TTag: typeof import('tdesign-vue-next')['Tag']
+    TTextarea: typeof import('tdesign-vue-next')['Textarea']
     TUpload: typeof import('tdesign-vue-next')['Upload']
   }
 }

src/model/article.ts

@@ -23,7 +23,7 @@ export interface ArticleSearchFilter extends Partial<Paging>{
 }
 
 export interface CreateArticleRequest{
-  categoryId:string
+  categoryId: string
   title: string
-  content: number
+  content: string
 }

src/pages/article/components/ArticleDialog.vue

@@ -1,11 +1,10 @@
 <script lang="ts" setup>
 import type { Category } from '@/model/category'
-import type { Article } from '@/model/article'
+import type { Article, CreateArticleRequest } from '@/model/article'
 import { computed, ref, reactive, watch } from 'vue'
 import type {
   FormInstanceFunctions,
-  FormProps,
-  SelectInputProps,
+   FormRules,
   TdSelectProps
 } from 'tdesign-vue-next'
 import { MessagePlugin } from 'tdesign-vue-next'
@@ -14,19 +13,16 @@ import { searchCategories } from '@/api/category'
 const props = defineProps<{
   isEdit?: Boolean | null
   headerTitle?: String | null
-  article: Article | null
+  article?: Article | null
   categoryList: Category[] | []
 }>()
 const formRef = ref<FormInstanceFunctions | null>(null)
-const headerText = computed(() => `${props.isEdit ? '编辑' : '创建'}${props.headerTitle || ''}`)
-const confirmBtnText = computed(() => (props.isEdit ? '保存' : '确定'))
-const articleData = reactive<{
-  categoryName: string,
-  title: string
-}>({ categoryName: '', title: '' })
+const headerText = computed(() => `${props.article ? '编辑' : '创建'}${props.headerTitle || ''}`)
+const confirmBtnText = computed(() => (props.article ? '保存' : '确定'))
+const articleData = reactive<CreateArticleRequest>({ title: '', categoryId: '', content: ''})
 
-const rules: FormProps['rules'] = {
-  name: [
+const rules: FormRules<CreateArticleRequest> = {
+  title: [
     {
       required: true,
       message: '咨询标题不能为空',
@@ -56,7 +52,7 @@ const rules: FormProps['rules'] = {
       trigger: 'blur'
     }
   ],
-  code: [
+  categoryId: [
     {
       required: true,
       message: '咨询分类不能为空',
@@ -86,7 +82,9 @@ const rules: FormProps['rules'] = {
 watch(
   () => props.article,
   (newArticleData) => {
-    Object.assign(articleData, newArticleData)
+    articleData.categoryId = newArticleData?.category.id || ''
+    articleData.title = newArticleData?.title || ''
+    articleData.content = newArticleData?.content || ''
   },
   { deep: true }
 )
@@ -98,11 +96,10 @@ const saveArticleData = async () => {
   if (formRef.value) {
     const valid = await formRef.value.validate()
     if (valid && typeof valid === 'boolean') {
-      const { title, categoryId, content, id } = articleData
-      if (!props.isEdit) {
-        await createArticlesRequest({ title, categoryId, content })
+      if (props.article) {
+        await updateArticlesByIdRequest(props.article.id, articleData)
       } else {
-        await updateArticlesByIdRequest(id, { title, categoryId, content })
+        await createArticlesRequest(articleData)
       }
       MessagePlugin.success(`${props.isEdit ? '编辑' : '创建'}咨询成功`)
       emit('success')
@@ -119,10 +116,9 @@ const handleCloseDialog = () => {
 }
 
 const categoryOptions = ref<TdSelectProps['options']>([])
-const categoryName = ref('')
 
-const fetchCategories = async () => {
-  const { data } = await searchCategories({ name: categoryName.value })
+const fetchCategories = async (search: string) => {
+  const { data } = await searchCategories({ name: search })
   categoryOptions.value = data.map((category) => {
     return {
       label: category.name,
@@ -131,7 +127,8 @@ const fetchCategories = async () => {
   })
 }
 
-fetchCategories()
+fetchCategories('')
+
 
 </script>
 <template>
@@ -150,15 +147,16 @@ fetchCategories()
         </TFormItem>
         <TFormItem label="咨询分类：" name="categoryId">
           <TSelect
-            v-model="categoryName"
+            v-model="articleData.categoryId"
             :options="categoryOptions"
             placeholder="请选择咨询分类"
-            clearable
             filterable
             @search="fetchCategories"
           />
         </TFormItem>
-        <TFormItem label="内容：" name="content"> </TFormItem>
+        <TFormItem label="内容：" name="content">
+        <TTextarea v-model="articleData.content"></TTextarea>
+        </TFormItem>
       </TForm>
     </t-space>
   </t-dialog>

src/pages/article/index.vue

@@ -52,7 +52,7 @@ const columns: BaseTableColumns = [
 ]
 const articleDialogVisble = ref(false)
 const isEdit = ref(false)
-const currentTableData = ref<Article | {}>({})
+const currentTableData = ref<Article | null>(null)
 const categoryList = ref<Category[]>([])
 onMounted(fetchData)
 watch(articleDialogVisble, (newValue) => {
@@ -79,7 +79,7 @@ const handleArticleDialogSuccess = () => {
 }
 const handleArticleDialogClosed = () => {
   isEdit.value = false
-  currentTableData.value = {}
+  currentTableData.value = null
 }
 const toggleArticleStatus = async (article: Article) => {
   if (article.status === 'published') {
@@ -147,7 +147,6 @@ const deleteCategoryClick = async (article: Article) => {
     </TTable>
     <ArticleDialog
       headerTitle="咨询"
-      :isEdit="isEdit"
       :article="currentTableData"
       :categoryList="categoryList"
       v-model:visible="articleDialogVisble"