first commit

src/views/components/workplace/index.vue

@@ -0,0 +1,50 @@
+<template>
+  <div class="m-auto mt-24px max-w-1000px">
+    <Container title="推荐产品" class="body">
+      <div class="flex flex-wrap">
+        <Product
+          v-for="product in products"
+          :key="product.id"
+          class="mt-20px ml-20px"
+          :product="product"
+          @refresh="getProductList"
+        />
+      </div>
+    </Container>
+    <Container title="成功案例" class="body mt-24px">
+      <div class="flex flex-wrap">
+        <Case v-for="item in cases" :key="item.id" class="mt-20px ml-20px" :data="item"></Case>
+      </div>
+    </Container>
+  </div>
+</template>
+<script setup lang="ts">
+import Container from '@/views/components/workplace/modules/container.vue';
+import Product from '@/views/components/workplace/modules/product.vue';
+import Case from '@/views/components/workplace/modules/case.vue';
+import { fetchProductList, fetchSuccessCaseList } from '@/api/all/index';
+import { ref, onMounted } from 'vue';
+
+const products = ref([]);
+const cases = ref([]);
+onMounted(() => {
+  getProductList();
+  getSuccessCaseList();
+});
+const getProductList = async () => {
+  products.value = await fetchProductList();
+};
+
+const getSuccessCaseList = async () => {
+  cases.value = await fetchSuccessCaseList();
+};
+</script>
+
+<style scoped lang="less">
+.body {
+  padding-left: 0;
+  :deep(> .title) {
+    padding-left: 20px;
+  }
+}
+</style>