From 0dcc8c59124a5c8b37e4a5b216ce504919b78223 Mon Sep 17 00:00:00 2001
From: Megghy <megghy@qq.com>
Date: Tue, 19 Dec 2023 21:27:47 +0800
Subject: [PATCH] fix IsAnonymous

---
 src/api/account.ts                            | 22 ++++--
 src/api/api-models.ts                         |  1 +
 src/components/DynamicForm.vue                | 51 +++++++++++-
 src/data/VTsuruTypes.ts                       | 29 ++++++-
 src/data/constants.ts                         |  3 +-
 src/views/manage/QuestionBoxManageView.vue    |  4 +-
 src/views/manage/SettingsManageView.vue       | 79 +++++++++++++------
 .../indexTemplate/DefaultIndexTemplate.vue    | 32 ++++++++
 .../indexTemplate/SimpleIndexTemplate.vue     | 18 +++--
 9 files changed, 192 insertions(+), 47 deletions(-)

diff --git a/src/api/account.ts b/src/api/account.ts
index 6f8b579..e11df27 100644
--- a/src/api/account.ts
+++ b/src/api/account.ts
@@ -93,22 +93,28 @@ export async function DelBiliBlackList(id: number): Promise<APIRoot<unknown>> {
     id: id,
   })
 }
+export function downloadConfigDirect<T>(name: string) {
+  return QueryGetAPI<string>(VTSURU_API_URL + 'get-config', {
+    name: name,
+  })
+}
 export async function downloadConfig<T>(name: string) {
   try {
     const resp = await QueryGetAPI<string>(VTSURU_API_URL + 'get-config', {
       name: name,
     })
     if (resp.code == 200) {
-      message.success('已获取配置文件')
+      console.log('已获取配置文件: ' + name)
       return JSON.parse(resp.data) as T
     } else if (resp.code == 404) {
-      message.error(`未找到名为 ${name} 的配置文件`)
+      console.error(`未找到名为 ${name} 的配置文件`)
     } else {
-      message.error('获取失败: ' + resp.message)
+      console.error(`无法获取配置文件 [${name}]: ` + resp.message)
     }
   } catch (err) {
-    message.error(`获取配置文件失败: ` + err)
+    console.error(`无法获取配置文件 [${name}]: ` + err)
   }
+  return null
 }
 export async function uploadConfig(name: string, data: unknown) {
   try {
@@ -117,11 +123,13 @@ export async function uploadConfig(name: string, data: unknown) {
       json: JSON.stringify(data),
     })
     if (resp.code == 200) {
-      message.success('已保存至服务器')
+      console.log('已保存配置文件至服务器:' + name)
+      return true
     } else {
-      message.error('保存失败: ' + resp.message)
+      console.error('保存失败: ' + resp.message)
     }
   } catch (err) {
-    message.error(`保存配置文件失败: ` + err)
+    console.error(`保存配置文件失败: ` + err)
   }
+  return false
 }
diff --git a/src/api/api-models.ts b/src/api/api-models.ts
index 4eda8c8..070067d 100644
--- a/src/api/api-models.ts
+++ b/src/api/api-models.ts
@@ -234,6 +234,7 @@ export interface QAInfo {
   isPublic: boolean
   isFavorite: boolean
   sendAt: number
+  isAnonymous: boolean
 }
 export interface LotteryUserInfo {
   name: string
diff --git a/src/components/DynamicForm.vue b/src/components/DynamicForm.vue
index c1a698f..6f9c245 100644
--- a/src/components/DynamicForm.vue
+++ b/src/components/DynamicForm.vue
@@ -1,13 +1,56 @@
 <script setup lang="ts">
-import { FormRules, NForm } from 'naive-ui'
+import { TemplateConfig } from '@/data/VTsuruTypes'
+import { NButton, NEmpty, NForm, NFormItem, NInput, NUpload, UploadFileInfo, useMessage } from 'naive-ui'
+import { ref } from 'vue'
 
-defineProps<{
-  rules: FormRules
+const message = useMessage()
+
+const props = defineProps<{
+  configData: any
+  config: TemplateConfig<any> | undefined
 }>()
 
+const fileList = ref<UploadFileInfo[]>([])
+
+function OnFileListChange(files: UploadFileInfo[]) {
+  console.log(props.configData)
+  if (files.length == 1) {
+    var file = files[0]
+    if ((file.file?.size ?? 0) > 10 * 1024 * 1024) {
+      message.error('文件大小不能超过10MB')
+      fileList.value = []
+    }
+  }
+}
+function onSubmit() {
+  console.log(props.configData)
+}
+
 function getItems() {}
 </script>
 
 <template>
-  <NForm> </NForm>
+  <NEmpty v-if="!config" description="此模板不支持配置" />
+  <NForm v-else>
+    <NFormItem v-for="item in config.items" :key="item.name" :label="item.name">
+      <component v-if="item.type == 'render'" :is="item.render(configData)"></component>
+      <template v-else-if="item.type == 'string'">
+        <NInput :value="item.data.get(configData)" @update:value="item.data.set(configData, $event)" />
+      </template>
+      <NUpload
+        v-else-if="item.type == 'image'"
+        accept=".png,.jpg,.jpeg,.gif,.svg,.webp,.ico"
+        list-type="image-card"
+        :default-upload="false"
+        v-model:file-list="fileList"
+        @update:file-list="OnFileListChange"
+        :max="item.imageLimit"
+      >
+        上传图片
+      </NUpload>
+    </NFormItem>
+    <NFormItem>
+      <NButton type="primary" @click="onSubmit">提交</NButton>
+    </NFormItem>
+  </NForm>
 </template>
diff --git a/src/data/VTsuruTypes.ts b/src/data/VTsuruTypes.ts
index 046fe2b..3a065af 100644
--- a/src/data/VTsuruTypes.ts
+++ b/src/data/VTsuruTypes.ts
@@ -2,14 +2,37 @@ import { VNode } from 'vue'
 
 export type TemplateConfig<T> = {
   name: string
-  items: (TemplateConfigItem<T> | TemplateConfigImageItem<T>)[]
+  items: (TemplateConfigStringItem<T> | TemplateConfigNumberItem<T> | TemplateConfigStringArrayItem<T> | TemplateConfigNumberArrayItem<T> | TemplateConfigImageItem<T> | TemplateConfigRenderItem<T>)[]
   onConfirm?: (arg0: T) => void
 }
 interface TemplateConfigBase {
   name: string
 }
-export type TemplateConfigItem<T> = TemplateConfigBase & {
-  type: 'default'
+
+type CommonProps = TemplateConfigBase
+type DataAccessor<T, V> = {
+  get: (config: T) => V
+  set: (config: T, value: V) => void
+}
+
+// 扩展 CommonProps 以包含额外的共有属性
+export type TemplateConfigItemWithType<T, V> = CommonProps & { data: DataAccessor<T, V> }
+
+export type TemplateConfigStringItem<T> = TemplateConfigItemWithType<T, string> & {
+  type: 'string'
+}
+export type TemplateConfigStringArrayItem<T> = TemplateConfigItemWithType<T, string[]> & {
+  type: 'stringArray'
+}
+export type TemplateConfigNumberItem<T> = TemplateConfigItemWithType<T, number> & {
+  type: 'number'
+}
+export type TemplateConfigNumberArrayItem<T> = TemplateConfigItemWithType<T, number[]> & {
+  type: 'numberArray'
+}
+
+export type TemplateConfigRenderItem<T> = TemplateConfigBase & {
+  type: 'render'
   render: (arg0: T) => VNode
 }
 export type TemplateConfigImageItem<T> = TemplateConfigBase & {
diff --git a/src/data/constants.ts b/src/data/constants.ts
index 5ea9a69..662d272 100644
--- a/src/data/constants.ts
+++ b/src/data/constants.ts
@@ -1,3 +1,4 @@
+import DefaultIndexTemplateVue from '@/views/view/indexTemplate/DefaultIndexTemplate.vue'
 import { computed, defineAsyncComponent, ref, watchEffect } from 'vue'
 
 const debugAPI = import.meta.env.VITE_DEBUG_API
@@ -41,5 +42,5 @@ export const SongListTemplateMap = {
   simple: { name: '简单', compoent: defineAsyncComponent(() => import('@/views/view/songListTemplate/SimpleSongListTemplate.vue')) },
 } as { [key: string]: { name: string; compoent: any } }
 export const IndexTemplateMap = {
-  '': { name: '默认', compoent: defineAsyncComponent(() => import('@/views/view/indexTemplate/DefaultIndexTemplate.vue')) },
+  '': { name: '默认', compoent: DefaultIndexTemplateVue },
 } as { [key: string]: { name: string; compoent: any } }
diff --git a/src/views/manage/QuestionBoxManageView.vue b/src/views/manage/QuestionBoxManageView.vue
index bb5e272..1fa215b 100644
--- a/src/views/manage/QuestionBoxManageView.vue
+++ b/src/views/manage/QuestionBoxManageView.vue
@@ -279,8 +279,8 @@ onMounted(() => {
                   <NTag type="warning" size="tiny"> 未读 </NTag>
                   <NDivider vertical />
                 </template>
-                <NText :depth="item.sender?.name ? 1 : 3" style="margin-top: 3px">
-                  {{ item.sender?.name ?? '匿名用户' }}
+                <NText :depth="item.isAnonymous ? 3 : 1" style="margin-top: 3px">
+                  {{ item.isAnonymous ? '匿名用户' : item.sender?.name }}
                 </NText>
                 <NTag v-if="item.isSenderRegisted" size="small" type="info" :bordered="false" style="margin-left: 5px"> 已注册 </NTag>
                 <NTag v-if="item.isPublic" size="small" type="success" :bordered="false" style="margin-left: 5px"> 公开 </NTag>
diff --git a/src/views/manage/SettingsManageView.vue b/src/views/manage/SettingsManageView.vue
index a7792b0..1b72aad 100644
--- a/src/views/manage/SettingsManageView.vue
+++ b/src/views/manage/SettingsManageView.vue
@@ -1,16 +1,19 @@
 <script setup lang="ts">
-import { DelBiliBlackList, SaveAccountSettings, SaveEnableFunctions, useAccount } from '@/api/account'
+import { DelBiliBlackList, SaveAccountSettings, SaveEnableFunctions, downloadConfigDirect, useAccount } from '@/api/account'
 import { FunctionTypes, ScheduleWeekInfo, SongFrom, SongLanguage, SongRequestOption, SongsInfo } from '@/api/api-models'
+import DynamicForm from '@/components/DynamicForm.vue'
+import { TemplateConfig } from '@/data/VTsuruTypes'
 import { FETCH_API, IndexTemplateMap, ScheduleTemplateMap, SongListTemplateMap } from '@/data/constants'
 import { NButton, NCard, NCheckbox, NCheckboxGroup, NDivider, NEmpty, NList, NListItem, NModal, NSelect, NSpace, NSpin, NTabPane, NTabs, NText, SelectOption, useMessage } from 'naive-ui'
-import { Ref, computed, h, onActivated, onMounted, ref } from 'vue'
+import { computed, h, nextTick, onActivated, onMounted, ref } from 'vue'
 import { useRoute } from 'vue-router'
 
 interface TemplateDefineTypes {
   TemplateMap: { [name: string]: { name: string; compoent: any } }
   Options: SelectOption[]
   Data: any
-  Selected: Ref<string>
+  Selected: string
+  Config?: any | undefined
 }
 
 const accountInfo = useAccount()
@@ -19,7 +22,7 @@ const route = useRoute()
 
 const isSaving = ref(false)
 
-const templates = {
+const templates = ref({
   index: {
     TemplateMap: IndexTemplateMap,
     Options: Object.entries(IndexTemplateMap).map((v) => ({
@@ -27,7 +30,7 @@ const templates = {
       value: v[0],
     })),
     Data: null,
-    Selected: ref(accountInfo.value?.settings.indexTemplate ?? ''),
+    Selected: accountInfo.value?.settings.indexTemplate ?? '',
   },
   schedule: {
     TemplateMap: ScheduleTemplateMap,
@@ -85,7 +88,7 @@ const templates = {
         ],
       },
     ] as ScheduleWeekInfo[],
-    Selected: ref(accountInfo.value?.settings.scheduleTemplate ?? ''),
+    Selected: accountInfo.value?.settings.scheduleTemplate ?? '',
   },
   songlist: {
     TemplateMap: SongListTemplateMap,
@@ -162,9 +165,9 @@ const templates = {
         updateTime: Date.now(),
       },
     ] as SongsInfo[],
-    Selected: ref(accountInfo.value?.settings.songListTemplate ?? ''),
+    Selected: accountInfo.value?.settings.songListTemplate ?? '',
   },
-} as { [type: string]: TemplateDefineTypes }
+} as { [type: string]: TemplateDefineTypes })
 
 const templateOptions = [
   {
@@ -183,7 +186,15 @@ const templateOptions = [
 const selectedOption = ref(route.query.template?.toString() ?? 'index')
 const selectedTab = ref(route.query.tab?.toString() ?? 'general')
 
-const selectedTemplateData = computed(() => templates[selectedOption.value])
+const dynamicConfigRef = ref()
+const selectedTemplateData = computed(() => templates.value[selectedOption.value])
+const selectedComponent = computed(() => selectedTemplateData.value?.TemplateMap[selectedTemplateData.value.Selected].compoent)
+const selectedTemplateConfig = computed(() => {
+  if (dynamicConfigRef.value?.Config) {
+    return dynamicConfigRef.value?.Config as TemplateConfig<any>
+  }
+  return undefined
+})
 
 const biliUserInfo = ref()
 const settingModalVisiable = ref(false)
@@ -245,23 +256,48 @@ async function SaveTemplateSetting() {
   if (accountInfo.value) {
     switch (selectedOption.value) {
       case 'index': {
-        accountInfo.value.settings.indexTemplate = selectedTemplateData.value.Selected.value ?? ''
+        accountInfo.value.settings.indexTemplate = selectedTemplateData.value.Selected ?? ''
         break
       }
       case 'songlist': {
-        accountInfo.value.settings.songListTemplate = selectedTemplateData.value.Selected.value ?? ''
+        accountInfo.value.settings.songListTemplate = selectedTemplateData.value.Selected ?? ''
         break
       }
       case 'schedule': {
-        accountInfo.value.settings.scheduleTemplate = selectedTemplateData.value.Selected.value ?? ''
+        accountInfo.value.settings.scheduleTemplate = selectedTemplateData.value.Selected ?? ''
         break
       }
     }
     await SaveComboSetting()
   }
 }
-function onOpenTemplateSettings() {
+async function onOpenTemplateSettings() {
   settingModalVisiable.value = true
+  nextTick(async () => {
+    await getTemplateConfig()
+  })
+}
+async function getTemplateConfig() {
+  if (selectedTemplateConfig.value && !selectedTemplateData.value.Config) {
+    await downloadConfigDirect(selectedTemplateConfig.value.name)
+      .then((data) => {
+        if (data.code == 200) {
+          message.success('已获取配置文件')
+          console.log(`已获取模板配置: ${selectedTemplateConfig.value?.name}`)
+          selectedTemplateData.value.Config = JSON.parse(data.data)
+        } else if (data.code == 404) {
+          //message.error(`未找到名为 ${name} 的配置文件`)
+          console.error(`未找到名为 ${selectedTemplateConfig.value?.name} 的配置文件`)
+          selectedTemplateData.value.Config = dynamicConfigRef.value.DefaultConfig
+        } else {
+          message.error('获取失败: ' + data.message)
+          console.error('获取失败: ' + data.message)
+        }
+      })
+      .catch((err) => {
+        message.error(err)
+      })
+  }
 }
 const buttonGroup = computed(() => {
   return h(NSpace, () => [h(NButton, { type: 'primary', onClick: () => SaveTemplateSetting() }, () => '设为展示模板'), h(NButton, { type: 'info', onClick: onOpenTemplateSettings }, () => '模板设置')])
@@ -342,18 +378,13 @@ onMounted(async () => {
             <NDivider style="margin: 5px 0 5px 0" title-placement="left"> 模板 </NDivider>
             <div>
               <NSpace>
-                <NSelect style="width: 150px" :options="selectedTemplateData.Options" v-model:value="selectedTemplateData.Selected.value" />
+                <NSelect style="width: 150px" :options="selectedTemplateData.Options" v-model:value="selectedTemplateData.Selected" />
                 <component :is="buttonGroup" />
               </NSpace>
               <NDivider />
               <Transition name="fade" mode="out-in">
-                <div v-if="true" :key="selectedTemplateData.Selected.value">
-                  <component
-                    :is="selectedTemplateData.TemplateMap[selectedTemplateData.Selected.value].compoent"
-                    :user-info="accountInfo"
-                    :bili-info="biliUserInfo"
-                    :current-data="selectedTemplateData.Data"
-                  />
+                <div v-if="selectedComponent" :key="selectedTemplateData.Selected">
+                  <component ref="dynamicConfigRef" :is="selectedComponent" :user-info="accountInfo" :bili-info="biliUserInfo" :current-data="selectedTemplateData.Data" />
                 </div>
               </Transition>
             </div>
@@ -362,5 +393,9 @@ onMounted(async () => {
       </NTabs>
     </NSpin>
   </NCard>
-  <NModal preset="card" v-model:show="settingModalVisiable" closable style="width: 600px; max-width: 90vw" title="模板设置"> 开发中... </NModal>
+  <NModal preset="card" v-model:show="settingModalVisiable" closable style="width: 600px; max-width: 90vw" title="模板设置">
+    只是测试, 没用
+    <NSpin v-if="!selectedTemplateData.Config" show />
+    <DynamicForm v-else :key="selectedTemplateData.Selected" :configData="selectedTemplateData.Config" :config="selectedTemplateConfig" />
+  </NModal>
 </template>
diff --git a/src/views/view/indexTemplate/DefaultIndexTemplate.vue b/src/views/view/indexTemplate/DefaultIndexTemplate.vue
index 215f7aa..013cfb1 100644
--- a/src/views/view/indexTemplate/DefaultIndexTemplate.vue
+++ b/src/views/view/indexTemplate/DefaultIndexTemplate.vue
@@ -1,6 +1,7 @@
 <script lang="ts" setup>
 import { isDarkMode } from '@/Utils'
 import { UserInfo } from '@/api/api-models'
+import { TemplateConfig } from '@/data/VTsuruTypes'
 import { NAvatar, NButton, NDivider, NSpace, NText } from 'naive-ui'
 
 const width = window.innerWidth
@@ -13,6 +14,37 @@ const props = defineProps<{
 function navigate(url: string) {
   window.open(url, '_blank')
 }
+defineExpose({ Config, DefaultConfig })
+</script>
+
+<script lang="ts">
+export type ConfigType = {
+  cover: string
+}
+export const DefaultConfig = {} as ConfigType
+export const Config: TemplateConfig<ConfigType> = {
+  name: 'Template.Index.Simple',
+  items: [
+    {
+      name: '封面',
+      type: 'image',
+      imageLimit: 1,
+      onUploaded: (url, config) => {
+        config.cover = url instanceof String ? (url as string) : url[0]
+      },
+    },
+    {
+      name: 'test',
+      type: 'string',
+      data: {
+        get: (d) => d.cover,
+        set: (d, v) => {
+          d.cover = v
+        },
+      },
+    },
+  ],
+}
 </script>
 
 <template>
diff --git a/src/views/view/indexTemplate/SimpleIndexTemplate.vue b/src/views/view/indexTemplate/SimpleIndexTemplate.vue
index 3b3c44c..8f70b43 100644
--- a/src/views/view/indexTemplate/SimpleIndexTemplate.vue
+++ b/src/views/view/indexTemplate/SimpleIndexTemplate.vue
@@ -15,25 +15,27 @@ function navigate(url: string) {
 }
 </script>
 
-<script>
-export type SimpleIndexConfig = {
+<script lang="ts">
+export type ConfigType = {
   cover?: string
 }
-export const Config: TemplateConfig<SimpleIndexConfig> = {
+export const Config: TemplateConfig<ConfigType> = {
   name: 'Template.Index.Simple',
   items: [
     {
       name: '封面',
       type: 'image',
       imageLimit: 1,
-      onUploaded: (url, config) => {config.cover = (url instanceof String ? url as string : url[0])}
+      onUploaded: (url, config) => {
+        config.cover = url instanceof String ? (url as string) : url[0]
+      },
     },
     {
       name: 'test',
-      type: 'default',
-       render: (config) => h('div', '1')
-    }
-  ]
+      type: 'render',
+      render: (config) => h('div', '1'),
+    },
+  ],
 }
 </script>