[add] 首页

2023-11-23 09:36:12 +08:00
parent 95f94b071e
commit 1abf8ffda4
6 changed files with 521 additions and 29 deletions
@@ -0,0 +1,84 @@
+<template>
+  <a-card :bordered="false">
+    <a-spin :spinning="loading">
+      <div class="top-wrapper">
+        <p class="left-p"><i class="iconfont icon-rukou left-icon"></i>快捷入口</p>
+        <p class="right-p" @click="menuManage"><i class="iconfont icon-settings"></i>菜单管理</p>
+      </div>
+      <div class="content-wrapper">
+        <div class="content-div" v-for="item in dataSource" :key="item.id">
+          <i class="iconfont" :class="'icon-' + item.iconName"></i>
+          <p>{{ item.name }}</p>
+        </div>
+        <div class="plus-div">
+          <a-icon type="plus" />
+        </div>
+      </div>
+    </a-spin>
+  </a-card>
+</template>
+
+<script>
+export default {
+  name: 'QuickEnterCard',
+  data () {
+    return {
+      loading: false,
+      dataSource: [
+        { iconName: 'shengchanliuchengguanli', name: '新建流程' },
+        { iconName: 'a-moxingkuaisuchaifen1', name: '标准拆分' },
+        { iconName: 'shoucang', name: '我的收藏' },
+        { iconName: 'a-fagui1', name: '国内法规' },
+        { iconName: 'a-moxingkuaisuchaifen1', name: '征求意见' },
+        { iconName: 'jiaoseguanli', name: '角色管理' },
+        { iconName: 'wenda1', name: '我的问答' }
+      ]
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+.content-wrapper {
+  //display: flex;
+  //flex-direction: row;
+  //flex-wrap: wrap;
+  //justify-content: space-between;
+  display: grid;
+  grid-template-columns: repeat(auto-fill, 100px);
+  grid-gap: 10px;
+  grid-auto-flow: row;
+  margin-top: 10px;
+  & > div {
+    width: 100px;
+    height: 100px;
+    border-radius: 8px 8px 8px 8px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+  }
+  .content-div {
+    background: rgba(213,44,38,0.08);
+    .iconfont {
+      font-size: 27px;
+      color: @primary-color;
+    }
+    p {
+      margin-bottom: 0;
+      font-size: 16px;
+      font-family: PingFang SC, PingFang SC;
+      font-weight: 400;
+      color: #000000;
+      line-height: 28px;
+    }
+  }
+  .plus-div {
+    border: 1px dashed @primary-color;
+    box-sizing: border-box;
+    .anticon {
+      font-size: 28px;
+    }
+  }
+}
+</style>