轮播图配置页面增加以及打包iws修改

2025-01-15 10:05:56 +08:00 · 2025-01-15 10:05:56 +08:00 · 24d6b536a2
parent 72a93cf695
commit 24d6b536a2
6 changed files with 170 additions and 55 deletions
--- a/src/layout/components/Navbar.vue
+++ b/src/layout/components/Navbar.vue
@ -1,27 +1,36 @@
 <template>
  <div class="navbar">
-    <hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
+    <hamburger
+      id="hamburger-container"
+      :is-active="sidebar.opened"
+      class="hamburger-container"
+      @toggleClick="toggleSideBar"
+    />

-    <breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav"/>
+    <breadcrumb
+      id="breadcrumb-container"
+      class="breadcrumb-container"
+      v-if="!topNav"
+    />
    <top-nav id="topmenu-container" class="topmenu-container" v-if="topNav" />

    <div class="right-menu">
      <template v-if="device !== 'mobile'">
        <search id="header-search" class="right-menu-item" />

-
-
        <screenfull id="screenfull" class="right-menu-item hover-effect" />

        <el-tooltip content="布局大小" effect="dark" placement="bottom">
          <size-select id="size-select" class="right-menu-item hover-effect" />
        </el-tooltip>
-
      </template>

-      <el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
+      <el-dropdown
+        class="avatar-container right-menu-item hover-effect"
+        trigger="click"
+      >
        <div class="avatar-wrapper">
-          <img :src="avatar" class="user-avatar">
+          <img :src="avatar" class="user-avatar" />
          <i class="el-icon-caret-bottom" />
        </div>
        <el-dropdown-menu slot="dropdown">
@ -41,15 +50,15 @@
 </template>

 <script>
-import { mapGetters } from 'vuex'
-import Breadcrumb from '@/components/Breadcrumb'
-import TopNav from '@/components/TopNav'
-import Hamburger from '@/components/Hamburger'
-import Screenfull from '@/components/Screenfull'
-import SizeSelect from '@/components/SizeSelect'
-import Search from '@/components/HeaderSearch'
-import bonusGit from '@/components/bonus/Git'
-import bonusDoc from '@/components/bonus/Doc'
+import { mapGetters } from "vuex";
+import Breadcrumb from "@/components/Breadcrumb";
+import TopNav from "@/components/TopNav";
+import Hamburger from "@/components/Hamburger";
+import Screenfull from "@/components/Screenfull";
+import SizeSelect from "@/components/SizeSelect";
+import Search from "@/components/HeaderSearch";
+import bonusGit from "@/components/bonus/Git";
+import bonusDoc from "@/components/bonus/Doc";

 export default {
  components: {
@ -60,48 +69,46 @@ export default {
    SizeSelect,
    Search,
    bonusGit,
-    bonusDoc
+    bonusDoc,
  },
  computed: {
-    ...mapGetters([
-      'sidebar',
-      'avatar',
-      'device'
-    ]),
+    ...mapGetters(["sidebar", "avatar", "device"]),
    setting: {
      get() {
-        return this.$store.state.settings.showSettings
+        return this.$store.state.settings.showSettings;
      },
      set(val) {
-        this.$store.dispatch('settings/changeSetting', {
-          key: 'showSettings',
-          value: val
-        })
-      }
+        this.$store.dispatch("settings/changeSetting", {
+          key: "showSettings",
+          value: val,
+        });
+      },
    },
    topNav: {
      get() {
-        return this.$store.state.settings.topNav
-      }
-    }
+        return this.$store.state.settings.topNav;
+      },
+    },
  },
  methods: {
    toggleSideBar() {
-      this.$store.dispatch('app/toggleSideBar')
+      this.$store.dispatch("app/toggleSideBar");
    },
    async logout() {
-      this.$confirm('确定注销并退出系统吗？', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        this.$store.dispatch('LogOut').then(() => {
-          location.href = '/glweb/login';
+      this.$confirm("确定注销并退出系统吗？", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
      })
-      }).catch(() => {});
-    }
-  }
-}
+        .then(() => {
+          this.$store.dispatch("LogOut").then(() => {
+            location.href = "/iws/glweb/login";
+          });
+        })
+        .catch(() => {});
+    },
+  },
+};
 </script>

 <style lang="scss" scoped>
@ -110,18 +117,18 @@ export default {
  overflow: hidden;
  position: relative;
  background: #fff;
-  box-shadow: 0 1px 4px rgba(0,21,41,.08);
+  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);

  .hamburger-container {
    line-height: 46px;
    height: 100%;
    float: left;
    cursor: pointer;
-    transition: background .3s;
+    transition: background 0.3s;
    -webkit-tap-highlight-color: transparent;

    &:hover {
-      background: rgba(0, 0, 0, .025)
+      background: rgba(0, 0, 0, 0.025);
    }
  }

@ -158,10 +165,10 @@ export default {

      &.hover-effect {
        cursor: pointer;
-        transition: background .3s;
+        transition: background 0.3s;

        &:hover {
-          background: rgba(0, 0, 0, .025)
+          background: rgba(0, 0, 0, 0.025);
        }
      }
    }
--- a/src/permission.js
+++ b/src/permission.js
@ -51,7 +51,7 @@ router.beforeEach((to, from, next) => {
      next();
    } else {
      const redirectUrl =
-        process.env.NODE_ENV === "production" ? "/glweb/login" : "/login";
+        process.env.NODE_ENV === "production" ? "/iws/glweb/login" : "/login";
      next(`${redirectUrl}?redirect=${encodeURIComponent(to.fullPath)}`); // 否则全部重定向到登录页
      NProgress.done(true);
    }
--- a/src/router/index.js
+++ b/src/router/index.js
@ -185,5 +185,5 @@ export default new Router({
  mode: "history", // 去掉url中的#
  scrollBehavior: () => ({ y: 0 }),
  routes: constantRoutes,
-  base: process.env.NODE_ENV === "production" ? "/glweb" : "",
+  base: process.env.NODE_ENV === "production" ? "/iws/glweb" : "",
 });
--- a/src/views/register.vue
+++ b/src/views/register.vue
@ -81,7 +81,7 @@
          <span v-else>注 册 中...</span>
        </el-button>
        <div style="float: right">
-          <router-link class="link-type" :to="'/glweb/login'"
+          <router-link class="link-type" :to="'/iws/glweb/login'"
            >使用已有账户登录</router-link
          >
        </div>
--- a/src/views/swiper-manage/index.vue
+++ b/src/views/swiper-manage/index.vue
@ -0,0 +1,108 @@
+<template>
+  <div class="app-container">
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          plain
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+        >
+          新增轮播图
+        </el-button>
+      </el-col>
+    </el-row>
+
+    <el-table :data="noticeList" border>
+      <el-table-column label="序号" align="center" width="100" type="index" />
+      <el-table-column prop="imgSrc" label="图片链接" align="center" />
+      <el-table-column prop="isShow" label="是否禁用" align="center">
+        <template>
+          <el-switch active-text="激活" inactive-text="禁用" v-model="value2" />
+        </template>
+      </el-table-column>
+      <el-table-column prop="outLink" label="外部链接" align="center" />
+    </el-table>
+
+    <el-dialog
+      title="新增轮播图"
+      :visible.sync="addSwiperVisible"
+      width="40%"
+      append-to-body
+    >
+      <el-form
+        ref="addSwiperFormRef"
+        :model="addSwiperForm"
+        :rules="addSwiperFormRules"
+        label-width="120px"
+      >
+        <el-row>
+          <el-col :span="24">
+            <el-form-item label="外部链接：">
+              <el-input placeholder="请输入外部链接" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="是否激活：">
+              <el-switch
+                active-text="激活"
+                inactive-text="禁用"
+                v-model="value1"
+              ></el-switch>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="轮播图上传："> </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      addSwiperVisible: false,
+      value1: true,
+      value2: true,
+      noticeList: [
+        {
+          imgSrc: "xxxx",
+          isShow: true,
+          outLink: "xxxx999",
+        },
+        {
+          imgSrc: "xxxx",
+          isShow: true,
+          outLink: "xxxx999",
+        },
+        {
+          imgSrc: "xxxx",
+          isShow: false,
+          outLink: "xxxx999",
+        },
+      ],
+    };
+  },
+  methods: {
+    handleAdd() {
+      this.addSwiperVisible = true;
+    },
+    submitForm() {
+      this.addSwiperVisible = false;
+    },
+    cancel() {
+      this.addSwiperVisible = false;
+    },
+  },
+};
+</script>
+
+<style></style>
--- a/vue.config.js
+++ b/vue.config.js
@ -18,7 +18,7 @@ module.exports = {
  // 部署生产环境和开发环境下的URL。
  // 默认情况下，Vue CLI 会假设你的应用是被部署在一个域名的根路径上
  // 例如 https://www.bonus.vip/。如果应用被部署在一个子路径上，你就需要用这个选项指定这个子路径。例如，如果你的应用被部署在 https://www.bonus.vip/admin/，则设置 baseUrl 为 /admin/。
-  publicPath: process.env.NODE_ENV === "production" ? "/glweb/" : "/",
+  publicPath: process.env.NODE_ENV === "production" ? "/iws/glweb/" : "/",
  // 在npm run build 或 yarn build 时 ，生成文件的目录名称（要和baseUrl的生产环境路径一致）（默认dist）
  outputDir: "dist",
  // 用于放置生成的静态资源 (js、css、img、fonts) 的；（项目打包之后，静态资源会放在这个文件夹下）