<template>
  <div v-if="form" class="app-info flex justify-around items-center">
    <div class="item text-center">
      <div class="rate text-gray-400">评分</div>
      <div class="text-2xl font-bold">3.1</div>
      <el-rate v-model="form.rate" disabled size="small"/>
    </div>
    <el-divider class="opacity-40" style="height: 40px" direction="vertical" />
    <div class="item text-center flex flex-col items-center">
      <div class="text-gray-400">插件ID</div>
      <el-icon size="24" class="py-1"><Cpu /></el-icon>
      <span class="text-gray-500">{{ form.websiteId }}</span>
    </div>
    <el-divider class="opacity-40" style="height: 40px" direction="vertical" />
    <nuxt-link :to="`https://${form.domain}`" class="item text-center flex flex-col items-center">
      <div class="text-gray-400">域名</div>
      <el-icon size="24" class="py-1"><Compass /></el-icon>
      <span class="text-gray-500">{{ form.domain }}</span>
    </nuxt-link>
    <el-divider class="opacity-40" style="height: 40px" direction="vertical" />
    <nuxt-link :to="`https://${form.tenantId}.wsdns.cn`" class="item text-center flex flex-col items-center">
      <div class="text-gray-400">开发者</div>
      <el-icon size="24" class="py-1"><Avatar /></el-icon>
      <span class="text-gray-500">{{'WebSoft Inc.'}}</span>
    </nuxt-link>
    <el-divider class="opacity-40" style="height: 40px" direction="vertical" />
    <div class="item text-center flex flex-col items-center">
      <div class="text-gray-400">下载次数</div>
<!--      <div>#<span class="text-2xl font-bold">13</span></div>-->
      <el-icon size="24" class="py-1"><Download /></el-icon>
      <span class="text-gray-500">{{ form.downloads }}</span>
    </div>
    <el-divider class="opacity-40" style="height: 40px" direction="vertical" />
    <div class="item text-center">
      <div class="text-gray-400">大小</div>
      <div class="text-2xl font-bold">26</div>
      <span class="text-gray-400">MB</span>
    </div>
  </div>
</template>

<script setup lang="ts">
import { ArrowLeft,View, Menu, Search,Compass, Cpu,Monitor, Download, Platform, Avatar } from '@element-plus/icons-vue'
import type {CmsWebsite} from "~/api/cms/cmsWebsite/model";
import {getTenantIdByDomain} from "~/api/cms/cmsDomain";
import {listTenant} from "~/api/system/tenant";

const i18n = useI18n();

const props = withDefaults(
    defineProps<{
      title?: string;
      desc?: string;
      buyUrl?: string;
      form?: CmsWebsite;
      value?: number;
    }>(),
    {}
);

const emit = defineEmits<{
  (e: 'done', where: any): void
}>()

// 搜索表单
const where = reactive<any>({
  keywords: '',
  page: 1,
  limit: 20,
  status: 0,
  parentId: undefined,
  categoryId: undefined,
  lang: i18n.locale.value
});

const reload = () => {

}
reload();
</script>
<style scoped lang="less">
</style>
