feat: 添加bbs前端

Yi.BBS.Vue2/src/components/AppHeader.vue

@@ -0,0 +1,134 @@
+<template>
+  <v-row class="mt-2">
+    <v-col cols="5" offset="0" class="mt-2" offset-md="4" md="5">
+      <v-text-field
+        label="全站搜索"
+        placeholder="输入"
+        dense
+        prepend-inner-icon="mdi-magnify"
+      >
+        <v-icon slot="append" color="blue"> mdi-send </v-icon>
+      </v-text-field>
+    </v-col>
+    
+    <v-col cols="7" md="3" class="mb-2 text-right">
+         <router-link :to="{ path: '/shop' }">
+      <v-btn icon medium>
+        <v-icon color="blue" dark> mdi-content-paste </v-icon>
+      </v-btn>
+            </router-link>
+      <router-link :to="{ path: '/index' }">
+        <v-btn icon medium class="mr-2">
+          <v-icon dark color="blue"> mdi-home </v-icon>
+          
+        </v-btn>
+      </router-link>
+
+      <v-menu offset-y>
+        <template v-slot:activator="{ on, attrs }">
+          <v-btn icon v-bind="attrs" v-on="on">
+            <v-avatar size="36" class="elevation-2">
+              <!-- <img src="https://z3.ax1x.com/2021/05/09/gJadhD.jpg" /> -->
+              <img
+                :src="
+                  baseurl +
+                  '/File/ShowNoticeImg?filePath=' +
+                  $store.state.user.user.icon
+                "
+              />
+            </v-avatar>
+          </v-btn>
+        </template>
+        <v-card class="mx-auto" tile width="200">
+          <v-system-bar></v-system-bar>
+
+          <v-list-item>
+            <v-list-item-icon>
+              <v-icon v-text="'mdi-star'"></v-icon>
+            </v-list-item-icon>
+            <v-list-item-content>
+              <v-list-item-title v-if="this.$store.state.user.user != null"
+                >用户：{{
+                  this.$store.state.user.user.username
+                }}</v-list-item-title
+              >
+            </v-list-item-content>
+          </v-list-item>
+
+          <v-list-item>
+            <v-list-item-icon>
+              <v-icon v-text="'mdi-star'"></v-icon>
+            </v-list-item-icon>
+            <v-list-item-content>
+              <v-list-item-title v-if="this.$store.state.user.user != null"
+                >等级：{{
+                  this.$store.state.user.user.level
+                }}</v-list-item-title
+              >
+            </v-list-item-content>
+          </v-list-item>
+          <v-divider></v-divider>
+          <v-list nav dense>
+            <v-list-item-group v-model="selectedItem" color="primary">
+              <v-list-item
+                v-for="(item, i) in items"
+                :key="i"
+                :to="item.router"
+              >
+                <v-list-item-icon>
+                  <v-icon v-text="item.icon"></v-icon>
+                </v-list-item-icon>
+                <v-list-item-content>
+                  <v-list-item-title v-text="item.text"></v-list-item-title>
+                </v-list-item-content>
+              </v-list-item>
+
+              <v-divider></v-divider>
+              <v-list-item>
+                <v-list-item-icon>
+                  <v-icon v-text="'mdi-star'"></v-icon>
+                </v-list-item-icon>
+                <v-list-item-content>
+                  <v-list-item-title
+                    @click="off()"
+                    v-text="'退出登录'"
+                  ></v-list-item-title>
+                </v-list-item-content>
+              </v-list-item>
+              <v-system-bar></v-system-bar>
+            </v-list-item-group>
+          </v-list>
+        </v-card>
+      </v-menu>
+    </v-col>
+  </v-row>
+</template>
+<script>
+export default {
+  data: () => ({
+    baseurl: "",
+    selectedItem: "",
+    items: [
+      { text: "个人资料", icon: "mdi-folder", router: "/userInfo" },
+      { text: "我的主题", icon: "mdi-account-multiple", router: "/myDiscuss" },
+      { text: "我的收藏", icon: "mdi-star", router: "/collection" },
+      { text: "我的仓库", icon: "mdi-home-account", router: "/warehouse" },
+      { text: "我的好友", icon: "mdi-account-group", router: "/friend" },
+    ],
+  }),
+  created() {
+    this.initialize();
+  },
+  mounted() {
+    this.baseurl = process.env.VUE_APP_BASE_API;
+  },
+  methods: {
+    initialize() {},
+    off() {
+      this.$store.dispatch("Logout").then((resp) => {
+        this.$router.push("/login");
+      });
+    },
+  },
+};
+</script>

Yi.BBS.Vue2/src/components/AppMain.vue

@@ -0,0 +1,75 @@
+<template>
+  <div>
+    <v-breadcrumbs :items="items" class="grey lighten-5">
+      <template v-slot:item="{ item }">
+        <v-breadcrumbs-item :to="item.to" :disabled="false">
+          {{ item.text }}
+        </v-breadcrumbs-item>
+      </template>
+    </v-breadcrumbs>
+    <v-progress-linear
+      :active="this.$store.state.loader.load"
+      :indeterminate="this.$store.state.loader.load"
+      color="cyan accent-4"
+      striped
+    ></v-progress-linear>
+
+    <v-container fluid>
+      <v-slide-y-transition>
+        <router-view></router-view>
+      </v-slide-y-transition>
+
+      <!-- <Loader></Loader> -->
+    </v-container>
+  </div>
+</template>
+<script>
+// import Loader from "../components/Loader.vue"
+export default {
+  // components: {
+  //     Loader
+  // },
+  data: () => ({
+    items: [{ text: "首页", to: "/index" }],
+  }),
+  watch: {
+    $route(to, from) {
+      if (to.path == "/index") {
+        this.items = [{ text: "首页", to: "/index" }];
+      } else if (to.path == "/discuss") {
+        this.items = [
+          { text: "首页", to: "/index" },
+          { text: "主题", to: "/discuss" },
+        ];
+      } else if (to.path == "/comment") {
+        this.items = [
+          { text: "首页", to: "/index" },
+          { text: "主题", to: "/discuss" },
+          { text: "评论", to: "/comment" },
+        ];
+      } else if (to.path == "/addDiscuss") {
+        this.items = [
+          { text: "首页", to: "/index" },
+          { text: "主题", to: "/discuss" },
+          { text: "添加主题", to: "/addDiscuss" },
+        ];
+      } else if (to.path == "/action") {
+        this.items = [
+          { text: "首页", to: "/index" },
+          { text: "权限管理", to: "/action" },
+        ];
+      } else if (to.path == "/user") {
+        this.items = [
+          { text: "首页", to: "/index" },
+          { text: "用户管理", to: "/user" },
+        ];
+      } else if (to.path == "/role") {
+        this.items = [
+          { text: "首页", to: "/index" },
+          { text: "角色管理", to: "/role" },
+        ];
+      }
+    },
+  },
+};
+</script>

Yi.BBS.Vue2/src/components/AppNavbar.vue

@@ -0,0 +1,127 @@
+<template>
+  <v-card class="mx-auto " height="100%" width="100%">
+
+
+    <v-list-item >
+      <v-list-item-content >
+        <v-list-item-title class="title blue--text"> {{title}} </v-list-item-title>
+        <v-list-item-subtitle> 正式版 </v-list-item-subtitle>
+      </v-list-item-content>
+    </v-list-item>
+
+    <v-divider></v-divider>
+
+    <v-list class="blue--text">
+      <v-list-item v-for="item in items" :key="item.title" :to="item.router" >
+        <v-list-item-icon>
+          <v-icon>{{ item.icon }}</v-icon>
+        </v-list-item-icon>
+
+        <v-list-item-content>
+          <v-list-item-title>{{ item.title }}</v-list-item-title>
+        </v-list-item-content>
+      </v-list-item>
+
+      <v-list-group :value="true" prepend-icon="mdi-account-circle" class="blue--text">
+        <template v-slot:activator>
+          <v-list-item-title>我的权限</v-list-item-title>
+        </template>
+        <v-list-item v-for="(items, i) in cruds" :key="i" :to="items.router">
+          <v-list-item-title v-text="items.title"></v-list-item-title>
+
+          <v-list-item-icon>
+            <v-icon v-text="items.icon"></v-icon>
+          </v-list-item-icon>
+        </v-list-item>
+      </v-list-group>
+
+      <v-list-group :value="true" prepend-icon="mdi-account-circle" class="blue--text">
+        <template v-slot:activator>
+          <v-list-item-title>其他</v-list-item-title>
+        </template>
+        <v-list-item v-for="(items, i) in other" :key="i" :to="items.router">
+          <v-list-item-title v-text="items.title"></v-list-item-title>
+
+          <v-list-item-icon>
+            <v-icon v-text="items.icon"></v-icon>
+          </v-list-item-icon>
+        </v-list-item>
+      </v-list-group>
+    </v-list>
+  </v-card>
+</template>
+<script>
+import userApi from "@/api/userApi";
+import settingApi from "@/api/settingApi";
+
+import myaction from "../utils/myaction";
+
+export default {
+  data() {
+    return {
+      title:"",
+      actions: [],
+      cruds: [], //这个是权限目录
+      other: [], //这个是其他目录
+      items: [], //这个是根目录
+    };
+  },
+  created() {
+    this.initialize();
+  },
+  methods: {
+    initialize() {
+//先查询是否在myactions中
+//如果在，添加到我的权限中
+//如果不在，再判断前4个字符是不是/my/,是就添加到其他中，不是就添加到根目录
+
+
+settingApi.getTitle().then(resp=>{
+  this.title=resp.data
+})
+
+      var user = this.$store.state.user.user;
+      userApi.getActionByUserId(user.id).then((resp) => {
+        const response = resp.data;
+        this.actions = response;
+
+        for (var i = 0; i < this.actions.length; i++) {
+          if (this.actions[i].router == "") {
+            continue;
+          }
+          var mydata = {
+            title: "",
+            icon: "mdi-view-dashboard",
+            router: "/index",
+          };
+          mydata.title = this.actions[i].actionName;
+          if(this.actions[i].icon != null)
+          {
+            mydata.icon = this.actions[i].icon;
+          }
+
+          mydata.router=this.actions[i].router;
+
+// console.log(this.actions[i].actionName,"this.actions[i].actionName")
+// console.log(myaction.actionList,"myaction.actionList");
+// console.log(myaction.actionList.indexOf(this.actions[i].actionName) ,"myaction.actionList.indexOf(this.actions[i].actionName) ");
+          if (myaction.actionList.indexOf(this.actions[i].actionName) != -1) {
+            this.cruds.push(mydata);
+          } else {
+            var data1 = this.actions[i].router.substring(0, 4); //前4个 ：/my
+            if (data1 != "/my/") {
+              this.items.push(mydata);
+            } else {
+              var data2 = this.actions[i].router
+                .substring(4)
+                .replace(/\//g, "%2F"); //后面
+              mydata.router = data1 + data2;
+              this.other.push(mydata);
+            }
+          }
+        }
+      });
+    },
+  },
+};
+</script>

Yi.BBS.Vue2/src/components/Layout.vue

@@ -0,0 +1,65 @@
+<template>
+  <div>
+   <!-- <iframe id="music" frameborder="no" border="0" marginwidth="0" marginheight="0" width=250 height=86 src="//music.163.com/outchain/player?type=2&id=1454730043&auto=0&height=66"></iframe> -->
+    <v-app id="inspire">
+      <v-navigation-drawer v-model="drawer"   app >
+        <app-navbar></app-navbar>
+        <template v-slot:append >
+          <div class="pa-2">
+            <v-btn block @click="off()"> 退出 </v-btn>
+          </div>
+        </template>
+      </v-navigation-drawer>
+
+      <v-app-bar app class="white">
+        <v-app-bar-nav-icon @click="drawer = !drawer"></v-app-bar-nav-icon>
+        <app-header></app-header>
+      </v-app-bar>
+
+      <v-main >
+        <app-main ></app-main>
+
+        <!-- <v-footer :absolute="true"  >
+          <v-col class="text-center" cols="12">
+            {{ new Date().getFullYear() }} — <strong>Jiftcc</strong>
+          </v-col>
+        </v-footer> -->
+      </v-main>
+    </v-app>
+  </div>
+</template>
+<script>
+import AppHeader from "./AppHeader.vue";
+import AppNavbar from "./AppNavbar.vue";
+import AppMain from "./AppMain.vue";
+export default {
+  data() {
+    return {
+      drawer: true,
+    };
+  },
+  methods: {
+    off() {
+      this.$store.dispatch("Logout").then((resp) => {
+        this.$router.push("/login");
+      });
+    },
+  },
+  components: {
+    AppHeader,
+    AppNavbar,
+    AppMain,
+  },
+};
+</script>
+<style scoped>
+#music{
+  position: fixed;
+  top: auto;
+  left: auto;
+  bottom: 0;
+  right: 0;
+  z-index: 10000;
+}
+</style>
+

Yi.BBS.Vue2/src/components/LayoutLogin.vue

@@ -0,0 +1,65 @@
+<template>
+  <v-app>
+    <v-container fluid class="grey lighten-5" v-bind:style="{ height: allDiv }">
+      <v-row v-bind:style="{ height: allDiv }">
+        <!-- -------------------------------公告----------------------------------- -->
+        <v-col
+          cols="0"
+          sm="4"
+          md="3"
+          class="white d-none d-sm-flex text-center"
+        >
+          <div style="width: 100%">
+            <h1 class="light-blue--text mt-8">{{title}} <br />论坛/博客/百科</h1>
+            <p class="my-4 title">Eleven</p>
+            <p class="my-4 title">欢迎！在这里，我们无所不谈！</p>
+
+<a href="https://beian.miit.gov.cn">工信部备案号：赣ICP备20008025号-3</a>
+            <v-img
+              src="../assets/login.svg"
+              contain
+              v-bind:style="{ marginTop: imgDiv }"
+              style="width: 100%"
+            ></v-img>
+          </div>
+        </v-col>
+        <!-- -------------------------------------------------------------------------- -->
+
+        <!-- ------------------------------表单-------------------------------- -->
+        <v-col cols="12" sm="8" md="9">
+          <v-container class="text-center align-center" fluid>
+            <div class="mt-15">
+            <router-view></router-view>
+            </div>
+          </v-container>
+        </v-col>
+        <!-- --------------------------------------------------------------- -->
+      </v-row>
+    </v-container>
+  </v-app>
+</template>
+<script>
+import settingApi from "@/api/settingApi";
+export default {
+  created() {
+    this.initialize();
+  },
+  methods: {
+    initialize() {
+      settingApi.getTitle().then((resp) => {
+        this.title = resp.data;
+      });
+    },
+  },
+  data: () => ({
+    title:"",
+    allDiv: document.documentElement.clientHeight + "px",
+    imgDiv: document.documentElement.clientHeight - 540 + "px",
+    //   email: '',
+    //   emailRules: [
+    //     v => !!v || 'E-mail is required',
+    //     v => /.+@.+\..+/.test(v) || 'E-mail must be valid',
+    //   ],
+  }),
+};
+</script>

Yi.BBS.Vue2/src/components/Loader.vue

@@ -0,0 +1,10 @@
+<template>
+  <div class="text-center">
+    <v-overlay :value="this.$store.state.loader.load">
+      <v-progress-circular
+        indeterminate
+        size="64"
+      ></v-progress-circular>
+    </v-overlay>
+  </div>
+</template>