banner

src/modules/admin/components/CategoryModal.tsx

@@ -53,53 +53,46 @@ export default defineComponent({
     return () => {
       return (
         <div class={EditStyle}>
-          <div class={"edit_content"}>
-            <div class={"form_content"}>
-              <Form {...layout} onSubmit={submit}>
-                <Form.Item {...validateInfos.cover} wrapperCol={{ span: 24 }}>
-                  <UploadImage
-                    data={formState.formData.cover}
-                    text={"上传菜单banner图"}
-                    onChange={changeBanner}
-                  ></UploadImage>
-                </Form.Item>
-                <Form.Item {...validateInfos.name} label={"菜单名称"}>
-                  <Input
-                    placeholder={"请输入菜单名称"}
-                    v-model={[formState.formData.name, "value"]}
-                    maxlength={30}
-                  />
-                </Form.Item>
-                <Form.Item {...validateInfos.subName} label={"副标题"}>
-                  <Input
-                    placeholder={"请输入副标题"}
-                    v-model={[formState.formData.subName, "value"]}
-                    maxlength={30}
-                  />
-                </Form.Item>
-                <Form.Item {...validateInfos.type} label={"菜单类型"}>
-                  <Select v-model={[formState.formData.type, "value"]}>
-                    <Select.Option value="list">列表</Select.Option>
-                    <Select.Option value="detail">详情</Select.Option>
-                    <Select.Option value="download">下载</Select.Option>
-                  </Select>
-                </Form.Item>
-                <Form.Item {...validateInfos.isHome} label={"是否首页展示"}>
-                  <Checkbox
-                    v-model={[formState.formData.isHome, "checked"]}
-                  ></Checkbox>
-                </Form.Item>
-                <Form.Item
-                  style={{ marginBottom: 0 }}
-                  wrapperCol={{ span: 24 }}
-                >
-                  <Button type="primary" htmlType="submit" block>
-                    保存
-                  </Button>
-                </Form.Item>
-              </Form>
-            </div>
-          </div>
+          <Form {...layout} onSubmit={submit}>
+            <Form.Item {...validateInfos.cover} wrapperCol={{ span: 24 }}>
+              <UploadImage
+                data={formState.formData.cover}
+                text={"上传菜单banner图"}
+                onChange={changeBanner}
+              ></UploadImage>
+            </Form.Item>
+            <Form.Item {...validateInfos.name} label={"菜单名称"}>
+              <Input
+                placeholder={"请输入菜单名称"}
+                v-model={[formState.formData.name, "value"]}
+                maxlength={30}
+              />
+            </Form.Item>
+            <Form.Item {...validateInfos.subName} label={"副标题"}>
+              <Input
+                placeholder={"请输入副标题"}
+                v-model={[formState.formData.subName, "value"]}
+                maxlength={30}
+              />
+            </Form.Item>
+            <Form.Item {...validateInfos.type} label={"菜单类型"}>
+              <Select v-model={[formState.formData.type, "value"]}>
+                <Select.Option value="list">列表</Select.Option>
+                <Select.Option value="detail">详情</Select.Option>
+                <Select.Option value="download">下载</Select.Option>
+              </Select>
+            </Form.Item>
+            <Form.Item {...validateInfos.isHome} label={"是否首页展示"}>
+              <Checkbox
+                v-model={[formState.formData.isHome, "checked"]}
+              ></Checkbox>
+            </Form.Item>
+            <Form.Item style={{ marginBottom: 0 }} wrapperCol={{ span: 24 }}>
+              <Button type="primary" htmlType="submit" block>
+                保存
+              </Button>
+            </Form.Item>
+          </Form>
         </div>
       );
     };
@@ -107,30 +100,4 @@ export default defineComponent({
 });
 const EditStyle = css`
   width: 500px;
-  .edit_content {
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-  }
-  .comp_content {
-    flex: 1;
-    height: 0;
-    overflow: hidden;
-
-    .ant-tabs {
-      height: 100%;
-      .ant-tabs-nav {
-        .ant-tabs-nav-wrap {
-          overflow-x: auto;
-        }
-      }
-      .ant-tabs-tab {
-        user-select: none;
-      }
-      .ant-tabs-content {
-        height: 100%;
-        overflow-y: hidden;
-      }
-    }
-  }
 `;

src/modules/admin/components/UploadImage.tsx

@@ -54,6 +54,8 @@ const ImageStyle = css`
   .wapper {
     width: 100%;
     height: 100%;
+    max-height: 300px;
+    overflow: hidden;
     display: flex;
     align-items: center;
     justify-content: center;

src/modules/admin/module/article/index.ts

@@ -7,11 +7,13 @@ import Modal from "@/components/Provider/Modal";
 export const useArticle = defineStore("article", {
   state: () => ({
     listController: new ListController(request),
+    bannerList: new ListController(request),
   }),
   getters: {},
   actions: {
     initArticle() {
       this.listController.setCrudPrefix("/article");
+      this.bannerList.setCrudPrefix("/banner");
     },
     async addOrUpdateArticle(item: any) {
       loading.show("保存中");
@@ -36,7 +38,34 @@ export const useArticle = defineStore("article", {
       }
       return res.result;
     },
-   
+    async addOrUpdateBanner(item: any) {
+      loading.show("保存中");
+      let res = {} as any;
+      if (item._id) {
+        res = await this.bannerList.saveItem(item);
+      } else {
+        res = await this.bannerList.addItem(item);
+      }
+      loading.hidden();
+      if (res.errorNo != 200) {
+        message.success("保存失败");
+        return;
+      }
+      message.success("保存成功");
+    },
+    async deleteBanner(item: any) {
+      const ok = await Modal.confirm({
+        title: "删除确认",
+        content: `删除后数据无法恢复，确认删除：${item?.name}？`,
+        type: "danger",
+      });
+      if (ok) {
+        loading.show("删除中");
+        await this.bannerList.deleteItem(item._id);
+        loading.hidden();
+        message.success("删除成功");
+      }
+    },
     async deleteArticle(item: any) {
       const ok = await Modal.confirm({
         title: "删除确认",

src/typings/asset.d.ts

@@ -26,5 +26,13 @@ declare type ArticleItem = {
   content?: string; //内容
   sort: number;
 };
-
+declare type BannerItem = {
+  _id: string;
+  aid?: string; // 文章id
+  name: string; //名称
+  cover: string; //封面图
+  url?: string; //链接地址
+  sort: number;
+  isHome: bool;
+};
 declare module "quill-better-table";

src/views/admin/banner/ArticleList.tsx

@@ -0,0 +1,138 @@
+import { useArticle, useCategory } from "@/modules/admin";
+import { css } from "@linaria/core";
+import { Button, Card, Table, TreeNode, TreeSelect } from "ant-design-vue";
+import { defineComponent, onMounted, reactive, ref } from "vue";
+import { any } from "vue-types";
+import Modal from "@/components/Provider/Modal";
+import { CategoryItem } from "@/typings/asset";
+import { cloneDeep } from "lodash";
+import loading from "@/components/Provider/Loading";
+export default defineComponent({
+  props: {
+    current: any(),
+  },
+  setup(props) {
+    const artStore = useArticle();
+    const cateStore = useCategory();
+    const modal = Modal.use();
+    const selectRef = ref();
+    const state = reactive({
+      selectedRowKeys: [] as any,
+      selectedRow: null,
+      defaultId: "6464aef88dcb7ddb98b57a2e",
+      treeData: [] as any,
+    });
+    const columns = [
+      {
+        title: "名称",
+        dataIndex: "title",
+      },
+    ];
+    onMounted(() => {
+      initTreeData();
+      let query = {
+        cid: state.defaultId,
+      };
+      if (props.current._id) {
+        state.selectedRowKeys.splice(0, 1, props.current._id);
+        state.selectedRow = props.current;
+        state.defaultId = props.current.cid;
+        query = {
+          cid: props.current.cid,
+        };
+      }
+      artStore.listController.state.query = JSON.stringify(query);
+      artStore.listController.loadPage(1);
+    });
+    const changeSelected = (record: any, selected: any) => {
+      if (selected) {
+        state.selectedRowKeys.splice(0, 1, record._id);
+        state.selectedRow = record;
+      } else {
+        state.selectedRowKeys = [];
+        state.selectedRow = null;
+      }
+    };
+    const dataRender = (item: CategoryItem) => {
+      if (item.children) {
+        const temp = {
+          value: item._id,
+          label: item.name,
+          children: [] as any,
+          selectable: false,
+        };
+        const children = item.children.map((subItem: CategoryItem) => {
+          return dataRender(subItem);
+        });
+        temp.children = children;
+        return temp;
+      } else {
+        return {
+          value: item._id,
+          label: item.name,
+        };
+      }
+    };
+    const initTreeData = () => {
+      const catrgory = cloneDeep(cateStore.categoryTree);
+      const tree = catrgory.map((item: CategoryItem) => {
+        return dataRender(item);
+      });
+      state.treeData = tree;
+    };
+    const submit = () => {
+      modal.submit(state.selectedRow);
+    };
+    const treeChange = async (value: any) => {
+      artStore.listController.state.query = JSON.stringify({
+        cid: value,
+      });
+      loading.show("");
+      await artStore.listController.loadPage(1);
+      loading.hidden();
+    };
+
+    return () => (
+      <div class={Page}>
+        <div class={"mb-20px"}>
+          <TreeSelect
+            ref={selectRef}
+            class={"w-200px"}
+            defaultValue={state.defaultId}
+            treeData={state.treeData}
+            onChange={treeChange}
+          ></TreeSelect>
+        </div>
+        <Table
+          bordered
+          rowKey={(record) => record._id}
+          rowSelection={{
+            hideSelectAll: true,
+            selectedRowKeys: state.selectedRowKeys,
+            onSelect: (record, selected) => {
+              changeSelected(record, selected);
+            },
+          }}
+          size="small"
+          pagination={{
+            size: "small",
+            showSizeChanger: false,
+            pageSize: artStore.listController.state.size,
+            total: artStore.listController.state.total,
+            onChange: (v) => artStore.listController.loadPage(v),
+          }}
+          columns={columns}
+          dataSource={artStore.listController.state.list}
+        ></Table>
+        <div class={"mt-10px text-right"}>
+          <Button type="primary" onClick={submit}>
+            确定
+          </Button>
+        </div>
+      </div>
+    );
+  },
+});
+const Page = css`
+  width: 800px;
+`;

src/views/admin/banner/EditBanner.tsx

@@ -0,0 +1,202 @@
+import Modal from "@/components/Provider/Modal";
+import { useArticle } from "@/modules/admin";
+import UploadImage from "@/modules/admin/components/UploadImage";
+import { BannerItem } from "@/typings/asset";
+import { css } from "@linaria/core";
+import {
+  Button,
+  Form,
+  FormInstance,
+  Input,
+  RadioButton,
+  RadioGroup,
+} from "ant-design-vue";
+import { RightOutlined } from "@ant-design/icons-vue";
+import { defineComponent, reactive, ref, nextTick, onMounted } from "vue";
+import { object } from "vue-types";
+import ArticleList from "./ArticleList";
+
+export default defineComponent({
+  props: {
+    data: object<BannerItem>(),
+  },
+  setup(props) {
+    const modal = Modal.use();
+    const artStore = useArticle();
+    const state = reactive({
+      formData: {
+        ...{
+          aid: "",
+          name: "",
+          cover: "",
+          url: "",
+          sort: 0,
+          isHome: false,
+        },
+        ...props.data,
+      },
+      type: "url",
+      article: {} as any,
+    });
+
+    const formRef = ref<FormInstance>();
+    onMounted(async () => {
+      if (state.formData.aid) {
+        const res = await artStore.listController.itemDetail(
+          state.formData.aid
+        );
+        state.article = res.result || {};
+      }
+    });
+    const submit = () => {
+      formRef.value?.validate().then(async () => {
+        console.log(state.formData);
+        modal.submit(state.formData);
+      });
+    };
+    const changeThumb = (v: string) => {
+      state.formData.cover = v;
+    };
+    const selectArt = async () => {
+      const res: any = await Modal.show(
+        <ArticleList current={state.article} />,
+        {
+          title: "选择站内文章",
+        }
+      );
+      if (res) {
+        state.article = res;
+        state.formData.aid = res._id;
+        if (res.cover) {
+          state.formData.cover = res.cover;
+        }
+      }
+      console.log(res);
+    };
+    return () => {
+      return (
+        <div>
+          <div class={ModalPage}>
+            <div class={"form_box"}>
+              <Form
+                ref={formRef}
+                model={state.formData}
+                labelCol={{ span: 6 }}
+                wrapperCol={{ span: 18 }}
+              >
+                <RadioGroup
+                  class={"radio_g"}
+                  value={state.type}
+                  buttonStyle="solid"
+                  onChange={(e) => {
+                    state.type = e.target.value;
+                    formRef.value?.clearValidate();
+                  }}
+                >
+                  <RadioButton value="url">站外链接</RadioButton>
+                  <RadioButton value="article">站内文章</RadioButton>
+                </RadioGroup>
+                {state.type == "url" && (
+                  <Form.Item
+                    label={"链接地址"}
+                    name={"url"}
+                    rules={[
+                      {
+                        required: true,
+                        message: "链接地址不能为空",
+                        trigger: "change",
+                      },
+                    ]}
+                  >
+                    <Input
+                      placeholder={"请输入链接地址"}
+                      value={state.formData.url}
+                      onChange={(e) => {
+                        state.formData.url = e.target.value || "";
+                        state.formData.aid = "";
+                      }}
+                    />
+                  </Form.Item>
+                )}
+                {state.type == "article" && (
+                  <Form.Item
+                    label={"站内文章"}
+                    name={"aid"}
+                    rules={[
+                      {
+                        required: true,
+                        message: "请选择站内文章",
+                        trigger: "change",
+                      },
+                    ]}
+                  >
+                    <div class={"select_inp"} onClick={selectArt}>
+                      <Input
+                        placeholder={"请选择站内文章"}
+                        value={state.article.title}
+                        readonly
+                        suffix={<RightOutlined style={{ color: "#d9d9d9" }} />}
+                      />
+                    </div>
+                  </Form.Item>
+                )}
+                <Form.Item
+                  label={"轮播名称"}
+                  name={"name"}
+                  rules={[
+                    {
+                      required: true,
+                      message: "轮播名称不能为空",
+                      trigger: "change",
+                    },
+                  ]}
+                >
+                  <Input
+                    placeholder={"请输入轮播名称"}
+                    v-model={[state.formData.name, "value"]}
+                  />
+                </Form.Item>
+                <Form.Item
+                  label={"轮播图片"}
+                  name={"cover"}
+                  rules={[
+                    {
+                      required: true,
+                      message: "请上传轮播图片",
+                      trigger: "change",
+                    },
+                  ]}
+                >
+                  <UploadImage
+                    data={state.formData.cover}
+                    text={"上传轮播图"}
+                    onChange={changeThumb}
+                  ></UploadImage>
+                </Form.Item>
+              </Form>
+            </div>
+            <div class={"footer"}>
+              <Button type="primary" block onClick={submit}>
+                保存
+              </Button>
+            </div>
+          </div>
+        </div>
+      );
+    };
+  },
+});
+const ModalPage = css`
+  width: 500px;
+  .radio_g {
+    width: 100%;
+    text-align: center;
+    margin-bottom: 24px;
+  }
+  .select_inp {
+    cursor: pointer;
+    input {
+      cursor: pointer;
+    }
+  }
+`;

src/views/admin/banner/index.tsx

@@ -1,13 +1,123 @@
+import Modal from "@/components/Provider/Modal";
+import { useArticle } from "@/modules/admin";
 import { css } from "@linaria/core";
-import { Card, PageHeader } from "ant-design-vue";
+import {
+  Button,
+  Card,
+  PageHeader,
+  Space,
+  Table,
+  message,
+} from "ant-design-vue";
 import { defineComponent } from "vue";
+import EditBanner from "./EditBanner";
+import Image from "@/components/Image";
+export default defineComponent({
+  setup() {
+    const artStore = useArticle();
+    artStore.bannerList.loadPage(1);
+    const columns = [
+      {
+        title: "名称",
+        dataIndex: "title",
+      },
+      {
+        title: "图片",
+        dataIndex: "cover",
+        customRender: ({ record }: any) => {
+          return <Image src={record.cover} />;
+        },
+      },
+      {
+        title: "链接/文章",
+        dataIndex: "content",
+        customRender: ({ record }: any) => {
+          return "";
+        },
+      },
+      {
+        title: "操作",
+        customRender: ({ record }: any) => {
+          return (
+            <Space>
+              <Button
+                type="link"
+                onClick={() => {
+                  editItem(record);
+                }}
+              >
+                编辑
+              </Button>
+              <Button
+                danger
+                type="link"
+                onClick={() => {
+                  artStore.deleteArticle(record);
+                }}
+              >
+                删除
+              </Button>
+            </Space>
+          );
+        },
+      },
+    ];
+    const editItem = async (item?: any) => {
+      if (artStore.bannerList.state.list.length >= 10) {
+        message.warn("轮播图过多，请先删除一部分再添加");
+        return;
+      }
+      let listItem = undefined;
+      if (item._id) {
+        const res = await artStore.listController.itemDetail(item._id);
+        if (res.errorNo != 200) {
+          message.warn("未查询到数据！");
+          return;
+        }
+        listItem = res.result;
+      }
 
-export default defineComponent(() => {
-  return () => (
-    <Card class={Page}>
-      <PageHeader title={"首页轮播"} />
-    </Card>
-  );
+      const itemData: any = await Modal.show(<EditBanner data={listItem} />, {
+        title: item._id ? `编辑轮播` : `添加轮播`,
+      });
+
+      // artStore.addOrUpdateArticle(itemData);
+    };
+    return () => (
+      <Card class={Page}>
+        <PageHeader title={"首页轮播"}>
+          {{
+            extra: () => {
+              return (
+                <Button
+                  type="primary"
+                  onClick={() => {
+                    editItem({});
+                  }}
+                >
+                  ＋ 添加轮播
+                </Button>
+              );
+            },
+          }}
+        </PageHeader>
+        <Table
+          bordered
+          size="small"
+          pagination={{
+            size: "small",
+            showSizeChanger: false,
+            hideOnSinglePage: true,
+            pageSize: artStore.bannerList.state.size,
+            total: artStore.bannerList.state.total,
+            // onChange: (v) => artStore.bannerList.loadPage(v),
+          }}
+          columns={columns}
+          dataSource={artStore.bannerList.state.list}
+        ></Table>
+      </Card>
+    );
+  },
 });
 const Page = css`
   height: 100%;

src/views/admin/components/WangEditor.tsx

@@ -109,7 +109,7 @@ export default defineComponent({
         const html = editor.getHtml();
         const text = editor.getText();
         emit("change", { html, text });
-        console.log(html, text);
+        // console.log(html, text);
       },
     };
 

src/views/admin/config/menus.ts

@@ -1,325 +0,0 @@
-export const MenusConfig = [
-  {
-    name: "首页轮播",
-    path: "/banner",
-  },
-  {
-    name: "菜单管理",
-    path: "/category",
-  },
-  {
-    name: "学院概述",
-    children: [
-      {
-        name: "学院简介",
-        path: "/intro/",
-      },
-      {
-        name: "历史沿革",
-        path: "/intro/bill/product",
-      },
-      {
-        name: "学院领导",
-        path: "/intro/bill/produce",
-      },
-      {
-        name: "组织机构",
-        path: "/intro/report/process",
-      },
-    ],
-  },
-  {
-    name: "新闻资讯",
-    children: [
-      {
-        name: "要闻快讯",
-        path: "/prices/bill/purchase",
-      },
-      {
-        name: "通知公告",
-        path: "/prices/bill/product",
-      },
-      {
-        name: "热点专题",
-        path: "/prices/bill/produce",
-      },
-      {
-        name: "招聘信息",
-        path: "/prices/report/process",
-      },
-    ],
-  },
-  {
-    name: "党建工作",
-    children: [
-      {
-        name: "组织建设",
-        path: "/prices/materials",
-      },
-      {
-        name: "党建动态",
-        path: "/prices/crafts",
-      },
-      {
-        name: "党务公开",
-        path: "/prices/process",
-      },
-      {
-        name: "党风廉政",
-        path: "/prices/process",
-      },
-      {
-        name: "专题教育",
-        path: "/prices/process",
-      },
-      {
-        name: "服务指南",
-        path: "/prices/process",
-      },
-      {
-        name: "学习资源",
-        path: "/prices/process",
-      },
-    ],
-  },
-  {
-    name: "教育教学",
-    children: [
-      {
-        name: "本科生教育",
-        path: "/prices/supplier/list",
-      },
-      {
-        name: "研究生教育",
-        path: "/prices/supplier/list",
-      },
-      {
-        name: "教师工作室",
-        path: "/prices/supplier/list",
-      },
-    ],
-  },
-  {
-    name: "科学研究",
-    children: [
-      {
-        name: "教授委员会",
-        path: "/prices/setting/unit",
-      },
-      {
-        name: "学术委员会",
-        path: "/prices/setting/cates",
-      },
-      {
-        name: "研创动态",
-        path: "/prices/users",
-      },
-      {
-        name: "研创成果",
-        path: "/prices/setting/company",
-      },
-      {
-        name: "科研平台",
-        path: "/prices/setting/company",
-      },
-    ],
-  },
-  {
-    name: "师资队伍",
-    children: [
-      {
-        name: "美术系",
-        path: "/prices/setting/unit",
-      },
-      {
-        name: "动画系",
-        path: "/prices/setting/cates",
-      },
-      {
-        name: "工业设计系",
-        path: "/prices/users",
-      },
-      {
-        name: "视觉传达设计系",
-        path: "/prices/setting/company",
-      },
-      {
-        name: "博士导师",
-        path: "/prices/setting/company",
-      },
-      {
-        name: "硕士导师",
-        path: "/prices/setting/company",
-      },
-      {
-        name: "荣休教师",
-        path: "/prices/setting/company",
-      },
-    ],
-  },
-  {
-    name: "学科建设",
-    children: [
-      {
-        name: "工业设计系",
-        path: "/prices/users",
-      },
-      {
-        name: "视觉传达设计系",
-        path: "/prices/setting/company",
-      },
-      {
-        name: "环境设计系",
-        path: "/prices/setting/company",
-      },
-      {
-        name: "美术系",
-        path: "/prices/setting/unit",
-      },
-      {
-        name: "动画系",
-        path: "/prices/setting/cates",
-      },
-    ],
-  },
-  {
-    name: "人才培养",
-    children: [
-      {
-        name: "本科生教育",
-        path: "/prices/users",
-      },
-      {
-        name: "研究生教育",
-        path: "/prices/setting/company",
-      },
-    ],
-  },
-  {
-    name: "招生就业",
-    children: [
-      {
-        name: "本科生招生",
-        path: "/prices/users",
-      },
-      {
-        name: "研究生招生",
-        path: "/prices/setting/company",
-      },
-      {
-        name: "就业去向",
-        path: "/prices/setting/company",
-      },
-    ],
-  },
-  {
-    name: "学生工作",
-    children: [
-      {
-        name: "奖勤助贷",
-        path: "/prices/users",
-      },
-      {
-        name: "团学动态",
-        path: "/prices/setting/company",
-      },
-      {
-        name: "学生实践",
-        path: "/prices/setting/company",
-      },
-      {
-        name: "学生风采",
-        path: "/prices/setting/company",
-      },
-      {
-        name: "特色活动",
-        path: "/prices/setting/company",
-      },
-    ],
-  },
-  {
-    name: "合作交流",
-    children: [
-      {
-        name: "交流动态",
-        path: "/prices/users",
-      },
-      {
-        name: "合作项目",
-        path: "/prices/setting/company",
-      },
-      {
-        name: "出国（境）升学",
-        path: "/prices/setting/company",
-      },
-    ],
-  },
-  {
-    name: "师生作品",
-    children: [
-      {
-        name: "美术展览",
-        path: "/prices/users",
-      },
-      {
-        name: "动画艺术",
-        path: "/prices/setting/company",
-      },
-      {
-        name: "产品设计",
-        path: "/prices/setting/company",
-      },
-      {
-        name: "视觉传达",
-        path: "/prices/setting/company",
-      },
-      {
-        name: "环境设计",
-        path: "/prices/setting/company",
-      },
-    ],
-  },
-  {
-    name: "教工之家",
-    children: [
-      {
-        name: "工会/教代会",
-        path: "/prices/users",
-      },
-    ],
-  },
-  {
-    name: "校友空间",
-    children: [
-      {
-        name: "校友服务",
-        path: "/prices/users",
-      },
-      {
-        name: "校友组织",
-        path: "/prices/users",
-      },
-      {
-        name: "校友活动",
-        path: "/prices/users",
-      },
-      {
-        name: "校友名录",
-        path: "/prices/users",
-      },
-    ],
-  },
-  {
-    name: "下载专区",
-    children: [
-      {
-        name: "教师必备",
-        path: "/prices/users",
-      },
-      {
-        name: "学生必备",
-        path: "/prices/users",
-      },
-    ],
-  },
-];

src/views/admin/detail/components/DownloadEditor.tsx

@@ -105,7 +105,7 @@ export default defineComponent({
                       editItem({});
                     }}
                   >
-                    添加{data?.name}文件
+                    + 添加{data?.name}文件
                   </Button>
                 );
               },

src/views/admin/detail/components/DownloadModal.tsx

@@ -31,7 +31,7 @@ export default defineComponent({
 
     const rules = reactive({
       title: [{ required: true, message: "名称不能为空", trigger: "change" }],
-      content: [{ required: true, message: "文件不能为空", trigger: "change" }],
+      summary: [{ required: true, message: "文件不能为空", trigger: "change" }],
     });
 
     const { validate, validateInfos } = Form.useForm(formState.formData, rules);
@@ -42,40 +42,33 @@ export default defineComponent({
       });
     }
     const changeFile = (v: string) => {
-      formState.formData.content = v;
+      formState.formData.summary = v;
     };
 
     return () => {
       return (
         <div class={EditStyle}>
-          <div class={"edit_content"}>
-            <div class={"form_content"}>
-              <Form {...layout} onSubmit={submit}>
-                <Form.Item {...validateInfos.title} label={"文件名称"}>
-                  <Input
-                    placeholder={"请输入文件名称"}
-                    v-model={[formState.formData.title, "value"]}
-                    maxlength={30}
-                  />
-                </Form.Item>
-                <Form.Item {...validateInfos.content} label={"文件"}>
-                  <UploadFile
-                    data={formState.formData.content}
-                    text={"上传文件"}
-                    onChange={changeFile}
-                  ></UploadFile>
-                </Form.Item>
-                <Form.Item
-                  style={{ marginBottom: 0 }}
-                  wrapperCol={{ span: 24 }}
-                >
-                  <Button type="primary" htmlType="submit" block>
-                    保存
-                  </Button>
-                </Form.Item>
-              </Form>
-            </div>
-          </div>
+          <Form {...layout} onSubmit={submit}>
+            <Form.Item {...validateInfos.title} label={"文件名称"}>
+              <Input
+                placeholder={"请输入文件名称"}
+                v-model={[formState.formData.title, "value"]}
+                maxlength={30}
+              />
+            </Form.Item>
+            <Form.Item {...validateInfos.summary} label={"文件"}>
+              <UploadFile
+                data={formState.formData.summary}
+                text={"上传文件"}
+                onChange={changeFile}
+              ></UploadFile>
+            </Form.Item>
+            <Form.Item style={{ marginBottom: 0 }} wrapperCol={{ span: 24 }}>
+              <Button type="primary" htmlType="submit" block>
+                保存
+              </Button>
+            </Form.Item>
+          </Form>
         </div>
       );
     };
@@ -83,30 +76,4 @@ export default defineComponent({
 });
 const EditStyle = css`
   width: 500px;
-  .edit_content {
-    display: flex;
-    flex-direction: column;
-    height: 100%;
-  }
-  .comp_content {
-    flex: 1;
-    height: 0;
-    overflow: hidden;
-
-    .ant-tabs {
-      height: 100%;
-      .ant-tabs-nav {
-        .ant-tabs-nav-wrap {
-          overflow-x: auto;
-        }
-      }
-      .ant-tabs-tab {
-        user-select: none;
-      }
-      .ant-tabs-content {
-        height: 100%;
-        overflow-y: hidden;
-      }
-    }
-  }
 `;

src/views/admin/detail/components/ListEditor.tsx

@@ -1,15 +1,20 @@
 import { Button, PageHeader, Space, Table, message } from "ant-design-vue";
-import { defineComponent, onMounted, reactive } from "vue";
+import { defineComponent, onMounted } from "vue";
 
 import loading from "@/components/Provider/Loading";
-import { useArticle } from "@/modules/admin";
+import Modal from "@/components/Provider/Modal";
+import { useArticle, useCategory } from "@/modules/admin";
 import { CategoryItem } from "@/typings/asset";
-import { object } from "vue-types";
-import WangEditor from "../../components/WangEditor";
 import * as dayjs from "dayjs";
+import { object } from "vue-types";
 import ListEditModal from "./ListEditModal";
-import Modal from "@/components/Provider/Modal";
-
+const preNames = [
+  "美术系",
+  "动画系",
+  "工业设计系",
+  "视觉传达设计系",
+  "环境设计系",
+];
 export default defineComponent({
   props: {
     data: object<CategoryItem>(),
@@ -17,7 +22,14 @@ export default defineComponent({
   setup(props) {
     const data: any = props.data || {};
     const artStore = useArticle();
-
+    const cateStore = useCategory();
+    const preCategory = cateStore.categories.find((e) => {
+      return e._id == data.pid;
+    });
+    let preName = preCategory?.name || "";
+    if (!preNames.includes(preName)) {
+      preName = "";
+    }
     onMounted(() => {
       initList();
     });
@@ -95,9 +107,10 @@ export default defineComponent({
     };
 
     return () => {
+      const titleName = preName ? `${preName}-${data.name}` : data?.name;
       return (
         <div>
-          <PageHeader title={data?.name}>
+          <PageHeader title={titleName}>
             {{
               extra: () => {
                 return (
@@ -107,7 +120,7 @@ export default defineComponent({
                       editItem({});
                     }}
                   >
-                    添加{data?.name}
+                    + 添加{data?.name}
                   </Button>
                 );
               },