zlong 1 year ago
parent
commit
00dd253202
4 changed files with 58 additions and 10 deletions
  1. 1 0
      components.d.ts
  2. 39 0
      src/components/ImageUpload.vue
  3. 3 3
      src/model/carousals.ts
  4. 15 7
      src/pages/carousal/index.vue

+ 1 - 0
components.d.ts

@@ -8,6 +8,7 @@ export {}
 declare module 'vue' {
   export interface GlobalComponents {
     Copyright: typeof import('./src/components/Copyright.vue')['default']
+    ImageUpload: typeof import('./src/components/ImageUpload.vue')['default']
     RegularPage: typeof import('./src/components/RegularPage.vue')['default']
     RouterLink: typeof import('vue-router')['RouterLink']
     RouterView: typeof import('vue-router')['RouterView']

+ 39 - 0
src/components/ImageUpload.vue

@@ -0,0 +1,39 @@
+<script setup lang="ts">
+import type { UploadProps } from 'tdesign-vue-next'
+const file1 = ref<UploadProps['value']>([]);
+
+</script>
+
+<template>
+  <div>
+    <t-upload
+      ref="uploadRef1"
+      v-model="file1"
+      :image-viewer-props="imageViewerProps"
+      :size-limit="sizeLimit"
+      action="https://service-bv448zsw-1257786608.gz.apigw.tencentcs.com/api/upload-demo"
+      theme="image"
+      tips="单张图片文件上传(上传成功状态演示)"
+      accept="image/*"
+      :disabled="disabled"
+      :auto-upload="autoUpload"
+      :show-image-file-name="showImageFileName"
+      :upload-all-files-in-one-request="uploadAllFilesInOneRequest"
+      :locale="{
+          triggerUploadText: {
+            image: '请选择图片',
+          },
+        }"
+      @fail="handleFail"
+    >
+      <!-- custom UI -->
+      <!-- <template #fileListDisplay="{ files }">
+        <div>{{ JSON.stringify(files) }}</div>
+      </template> -->
+    </t-upload>
+  </div>
+</template>
+
+<style scoped>
+
+</style>

+ 3 - 3
src/model/carousals.ts

@@ -5,8 +5,8 @@ export interface CreateCarousalsRequest {
   targetId:string
 }
 export interface GetCarousalsRequest {
-  page:string,
-  size:string,
-  order?:string
+  page:number,
+  size:number,
+  order?:[string]
 }
 

+ 15 - 7
src/pages/carousal/index.vue

@@ -4,7 +4,7 @@ import { onMounted, ref, reactive } from 'vue'
 import type { BaseTableColumns } from 'tdesign-vue-next'
 import type { Classify } from '@/model/classify'
 import ClassifyDialog from '@/pages/carousal/components/CarousalDialog.vue'
-import { createCarousal } from '@/api/carousal'
+import { getCarousalList } from '@/api/carousal'
 
 const columns: BaseTableColumns = [
   {
@@ -19,7 +19,7 @@ const columns: BaseTableColumns = [
   },
   {
     title: '显示状态',
-    colKey: 'targetType',
+    colKey: 'status',
     width: 100
   },
   {
@@ -32,15 +32,23 @@ const loading = ref(false)
 const data = ref([])
 const pagination = reactive({
   page: 1,
-  size: 10
+  size: 10,
+  total:0
+})
+const query = reactive({
+  page:1,
+  size:10,
 })
 const classifyDialogVisible = ref(false)
 const isEdit = ref(false)
-const currentTableData = ref<Classify | {}>({})
-const fetchClassifyTableData = () => {
+const currentTableData = ref<{}>({})
+const fetchClassifyTableData = async () => {
   /* TODO: 获取轮播图表格数据 */
-  const createCarousalApi = createCarousal(pagination)
-  console.log(createCarousalApi,'api')
+  query.page = pagination.page
+  query.size = pagination.size
+  const getCarousalListApi = await getCarousalList(query)
+  currentTableData.value = getCarousalListApi.data
+  pagination.total = getCarousalListApi.pagination.total
 }
 onMounted(fetchClassifyTableData)
 const editClick = (classify: Classify) => {