<template>
  <div>
    <div class="gva-form-box">
      <el-form :model="formData" label-position="right" label-width="80px">
        <el-form-item label="作品名称:">
          <el-input v-model="formData.name" clearable placeholder="请输入" />
        </el-form-item>
        <el-form-item label="1:图片 2:视频:">
          <el-switch v-model="formData.type" active-color="#13ce66" inactive-color="#ff4949" active-text="是"
            inactive-text="否" clearable></el-switch>
        </el-form-item>
        <el-form-item label="作品地址:">
          <el-input v-model="formData.url" clearable placeholder="请输入" />
        </el-form-item>
        <el-form-item label="作品简介:">
          <el-input v-model="formData.artIntro" clearable placeholder="请输入" />
        </el-form-item>
        <el-form-item label="作品描述:">
          <el-input v-model="formData.artDesc" clearable placeholder="请输入" />
        </el-form-item>
        <el-form-item label="艺术家描述:">
          <el-input v-model="formData.artistDesc" clearable placeholder="请输入" />
        </el-form-item>
        <el-form-item label="作品标签:">
          <el-input v-model="formData.tags" clearable placeholder="请输入" />
        </el-form-item>
        <el-form-item label="权益类型:">
          <el-input v-model.number="formData.equityId" clearable placeholder="请输入" />
        </el-form-item>
        <el-form-item label="实物:">
          <el-switch v-model="formData.isObj" active-color="#13ce66" inactive-color="#ff4949" active-text="是"
            inactive-text="否" clearable></el-switch>
        </el-form-item>
        <el-form-item label="价格:">
          <el-input v-model.number="formData.price" clearable placeholder="请输入" />
        </el-form-item>
        <el-form-item label="创建用户ID:">
          <el-input v-model.number="formData.createUserId" clearable placeholder="请输入" />
        </el-form-item>
        <el-form-item label="所属用户ID:">
          <el-input v-model.number="formData.ownerUserId" clearable placeholder="请输入" />
        </el-form-item>
        <el-form-item label="藏品唯一标识:">
          <el-input v-model="formData.token" clearable placeholder="请输入" />
        </el-form-item>
        <el-form-item label="寄售:">
          <el-switch v-model="formData.isConsign" active-color="#13ce66" inactive-color="#ff4949" active-text="是"
            inactive-text="否" clearable></el-switch>
        </el-form-item>
        <el-form-item>
          <el-button size="mini" type="primary" @click="save">保存</el-button>
          <el-button size="mini" type="primary" @click="back">返回</el-button>
        </el-form-item>
      </el-form>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Arts'
}
</script>

<script setup>
import {
  createArts,
  updateArts,
  findArts
} from '@/api/arts'

// 自动获取字典
import { getDictFunc } from '@/utils/format'
import { useRoute, useRouter } from "vue-router"
import { ElMessage } from 'element-plus'
import { ref } from 'vue'
const route = useRoute()
const router = useRouter()
const type = ref('')
const formData = ref({
  name: '',
  type: false,
  url: '',
  artIntro: '',
  artDesc: '',
  artistDesc: '',
  tags: '',
  equityId: 0,
  isObj: false,
  price: 0,
  createUserId: 0,
  ownerUserId: 0,
  token: '',
  isConsign: false,
})

// 初始化方法
const init = async () => {
  // 建议通过url传参获取目标数据ID 调用 find方法进行查询数据操作 从而决定本页面是create还是update 以下为id作为url参数示例
  if (route.query.id) {
    const res = await findArts({ ID: route.query.id })
    if (res.code === 0) {
      formData.value = res.data.rearts
      type.value = 'update'
    }
  } else {
    type.value = 'create'
  }
}

init()
// 保存按钮
const save = async () => {
  let res
  switch (type.value) {
    case 'create':
      res = await createArts(formData.value)
      break
    case 'update':
      res = await updateArts(formData.value)
      break
    default:
      res = await createArts(formData.value)
      break
  }
  if (res.code === 0) {
    ElMessage({
      type: 'success',
      message: '创建/更改成功'
    })
  }
}

// 返回按钮
const back = () => {
  router.go(-1)
}

</script>

<style>

</style>
