初始化

2025-01-27 23:24:42 +08:00
parent c8a96306c4
commit 6ae8339299
421 changed files with 35687 additions and 0 deletions
--- a/pages/templates/components/CardList.vue
+++ b/pages/templates/components/CardList.vue
@@ -0,0 +1,57 @@
+<template>
+  <div class="xl:w-screen-xl sm:flex xl:p-0 p-4 m-auto relative" v-infinite-scroll="load">
+    <el-row :gutter="24" class="flex">
+      <template v-for="(item,index) in list" :key="index">
+        <el-col :xs="24" :sm="12" :md="8" :lg="6" :xl="6" class="mb-5 min-w-xs">
+          <el-card shadow="hover" :body-style="{ padding: '0px' }" class="hover:bg-gray-50 cursor-pointer">
+            <el-image
+                :src="item.image"
+                :fit="fit" :lazy="true" class="w-full md:h-[150px] h-[199px] cursor-pointer bg-gray-50"/>
+            <div class="flex-1 px-4 py-5 sm:p-6 !p-4">
+              <div class="text-gray-700 dark:text-white text-base font-semibold  flex flex-col gap-1.5">
+                <div class="flex-1 text-xl cursor-pointer flex items-center">
+                  {{ item.shortName }}
+                </div>
+              </div>
+              <div class="flex items-center gap-1.5 py-2 text-gray-500 justify-between">
+                <div class="text-gray-500 line-clamp-2">{{ item.comments }}</div>
+              </div>
+              <div class="button-group flex justify-between items-center mt-3">
+                <el-button class="w-full" @click="openSpmUrl(`https://${item.tenantId}.wsdns.cn`,item,item.companyId,true)">预览</el-button>
+              </div>
+            </div>
+          </el-card>
+        </el-col>
+      </template>
+    </el-row>
+  </div>
+  <div v-if="disabled" class="px-1 text-center text-gray-500 min-h-xs">
+    没有更多了
+  </div>
+</template>
+
+<script setup lang="ts">
+import {openSpmUrl} from "~/utils/common";
+import type {Company} from "~/api/system/company/model";
+
+const props = withDefaults(
+    defineProps<{
+      list?: Company[];
+      disabled?: boolean;
+      fit?: any;
+    }>(),
+    {
+      fit: 'cover'
+    }
+);
+
+const emit = defineEmits<{
+  (e: 'done'): void;
+}>();
+
+const load = () => {
+  if(!props.disabled){
+    emit('done')
+  }
+}
+</script>
--- a/pages/templates/components/PageBanner.vue
+++ b/pages/templates/components/PageBanner.vue
@@ -0,0 +1,115 @@
+<template>
+  <div class="banner m-auto relative sm:flex">
+    <svg viewBox="0 0 1440 181" fill="none" xmlns="http://www.w3.org/2000/svg"
+         class="pointer-events-none absolute w-full top-[-2px] transition-all text-green-5 flex-shrink-0 opacity-100 duration-[400ms] opacity-80 -z-10">
+      <mask id="path-1-inside-1_414_5526" fill="white">
+        <path d="M0 0H1440V181H0V0Z"></path>
+      </mask>
+      <path d="M0 0H1440V181H0V0Z" fill="url(#paint0_linear_414_5526)" fill-opacity="0.22"></path>
+      <path d="M0 2H1440V-2H0V2Z" fill="url(#paint1_linear_414_5526)" mask="url(#path-1-inside-1_414_5526)"></path>
+      <defs>
+        <linearGradient id="paint0_linear_414_5526" x1="720" y1="0" x2="720" y2="181" gradientUnits="userSpaceOnUse">
+          <stop stop-color="currentColor"></stop>
+          <stop offset="1" stop-color="currentColor" stop-opacity="0"></stop>
+        </linearGradient>
+        <linearGradient id="paint1_linear_414_5526" x1="0" y1="90.5" x2="1440" y2="90.5" gradientUnits="userSpaceOnUse">
+          <stop stop-color="currentColor" stop-opacity="0"></stop>
+          <stop offset="0.395" stop-color="currentColor"></stop>
+          <stop offset="1" stop-color="currentColor" stop-opacity="0"></stop>
+        </linearGradient>
+      </defs>
+    </svg>
+    <div class="md:w-screen-xl m-auto md:p-0 px-4">
+      <div class="py-8 sm:py-16" _path="/templates" _dir="" _draft="false" _partial="false" _locale=""
+           _id="content:4.templates.yml" _type="yaml" _source="content" _file="4.templates.yml" _stem="4.templates"
+           _extension="yml">
+        <div class="gap-8 sm:gap-y-16 grid lg:grid-cols-2 lg:items-center" v-if="layout">
+          <div class="">
+            <h1
+                class="text-3xl font-bold tracking-tight text-gray-900 dark:text-white sm:text-4xl lg:text-5xl">
+              <span v-if="layout.title">{{ layout.title }}</span>
+              <span v-if="layout.name">{{ layout.name }}</span>
+            </h1>
+
+            <div class="mt-4 text-lg text-gray-500 dark:text-gray-400">
+              {{ layout.description }}
+            </div>
+            <div class="flex justify-between w-full items-center mt-4">
+              <el-space>
+                <div class="w-[500px]">
+                  <el-input
+                      v-model="where.keywords"
+                      placeholder="搜索"
+                      :prefix-icon="Search"
+                      @keydown.enter="handleClick"
+                  >
+                    <template #append>
+                      <el-button size="large" type="primary" @click="handleClick">搜索</el-button>
+                    </template>
+                  </el-input>
+                </div>
+                <el-button
+                    size="large"
+                    @click="openSpmUrl(`/passport/login`)"
+                >
+                  创建
+                </el-button>
+              </el-space>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { Search } from '@element-plus/icons-vue'
+import {useConfigInfo} from "~/composables/configState";
+import {openSpmUrl} from "~/utils/common";
+import type {CompanyParam} from "~/api/system/company/model";
+
+const token = useToken();
+const sysDomain = useSysDomain();
+
+withDefaults(
+    defineProps<{
+      layout?: any;
+      title?: string;
+      desc?: string;
+      buyUrl?: string;
+    }>(),
+    {
+      title: 'Templates',
+      desc: 'Explore community templates to get up and running in a few seconds.',
+      demoUrl: '/product/website',
+      buyUrl: 'https://github.com/websoft9/ansible-templates'
+    }
+);
+
+// 搜索表单
+const where = reactive<CompanyParam>({
+  keywords: ''
+});
+
+const config = useConfigInfo();
+// 搜索结果
+const handleClick = async () => {
+  if (where.keywords == '') {
+    return false;
+  }
+  if(activeName.value == 'web'){
+    const {data: response} = await useServerRequest<ApiResult<PageResult<Website>>>('/cms/cms-website/page',{baseURL: runtimeConfig.public.apiServer, params: {
+        page: page.value, keywords: where.keywords
+      }})
+    if(response.value?.data){
+      if (response.value?.data.list) {
+        websites.value = response.value?.data.list;
+      }
+      if(response.value.data.count == 0){
+        resultText.value = '暂无相关结果'
+      }
+    }
+  }
+}
+</script>
--- a/pages/templates/index.vue
+++ b/pages/templates/index.vue
@@ -0,0 +1,84 @@
+<template>
+  <PageBanner :layout="layout" :title="`${form?.categoryName}`" :desc="`${form?.comments}`" />
+  <CardList :param="{type: 0,official: true}" :list="list" :disabled="disabled" @done="onSearch" />
+</template>
+<script setup lang="ts">
+import type {ApiResult, PageResult} from "~/api";
+import {useServerRequest} from "~/composables/useServerRequest";
+import type {Navigation} from "~/api/cms/navigation/model";
+import type {Company, CompanyParam} from "~/api/system/company/model";
+import CardList from './components/CardList.vue';
+
+const route = useRoute();
+
+// 页面信息
+const runtimeConfig = useRuntimeConfig();
+const list = ref<Company[]>([]);
+const page = ref<number>(1);
+const resultText = ref('');
+const layout = ref<any>();
+const disabled = ref<boolean>(false);
+
+// 获取状态
+const form = ref<Navigation>();
+
+// 搜索表单
+const where = reactive<CompanyParam>({
+  keywords: ''
+});
+
+const onSearch = () => {
+  if(!disabled.value){
+    page.value++;
+    reload(route.path);
+  }
+}
+
+// 请求数据
+const reload = async (path: string) => {
+  const {data: response} = await useServerRequest<ApiResult<PageResult<Company>>>('/system/company/pageAll',{baseURL: runtimeConfig.public.apiServer, params: {
+      page: page.value,
+      limit: 8,
+      categoryId: getIdBySpm(5),
+      keywords: where.keywords
+    }})
+  if(response.value?.data){
+    if (list.value.length < response.value?.data.count) {
+      disabled.value = false;
+      if (response.value?.data.list) {
+        list.value = list.value.concat(response.value?.data.list);
+      }
+    }else {
+      disabled.value = true;
+    }
+    if(response.value.data.count == 0){
+      resultText.value = '暂无相关结果'
+    }
+  }
+}
+
+const { data: nav } = await useServerRequest<ApiResult<Navigation>>(`/cms/cms-navigation/${getIdBySpm(5)}`)
+if(nav.value?.data){
+  form.value = nav.value?.data;
+  useHead({
+    title: `${form.value.title} - WEBSOFT`,
+    bodyAttrs: {
+      class: "page-container",
+    }
+  });
+}
+// 页面布局
+if(form.value?.layout){
+  layout.value = JSON.parse(form.value?.layout)
+}
+
+
+
+watch(
+    () => route.path,
+    (path) => {
+      reload(path);
+    },
+    { immediate: true }
+);
+</script>