fs-admin/src/views/miniprogram/Banner.vue

<script setup lang="ts">
import type { BasicForm } from '@/types/form'

const CRUD = {
  create() {
    return Promise.resolve()
  },
  update() {
    return Promise.resolve()
  },
  getList() {
    return Promise.resolve()
  }
}

const formConfig = reactive<BasicForm>({
  span: 24,
  formItems: [
    {
      label: '图片',
      value: '',
      name: 'image',
      type: 'upload',
      rules: [{ required: true, message: '请上传图片', trigger: 'blur' }],
      props: {
        class: 'avatar-uploader',
        'show-file-list': false
      }
    },
    {
      label: '标题',
      value: '',
      name: 'name',
      type: 'input'
    },
    {
      label: '跳转地址',
      value: 'src',
      name: 'phone',
      type: 'input'
    }
  ]
})
</script>

<template>
  <pro-table :crud="CRUD" :formConfig="formConfig">
    <el-table-column prop="name" label="标题"></el-table-column>
    <el-table-column prop="image" label="图片">
      <template #default="{ row }">
        <el-image :src="row.src" style="width: 100px"></el-image>
      </template>
    </el-table-column>
    <el-table-column prop="src" label="跳转地址"></el-table-column>
  </pro-table>
</template>

<style lang="scss" scoped></style>