@sugarat/easypicker2-client 2.4.3 → 2.6.0

package/src/pages/dashboard/index.vue

@@ -1,335 +0,0 @@
-<template>
-  <div class="dashboard">
-    <div class="pc-nav">
-      <div class="nav">
-        <!-- LOGO -->
-        <div class="logo">
-          <router-link to="/">
-            <img
-              src="https://img.cdn.sugarat.top/easypicker/EasyPicker.png"
-              alt="logo"
-            />
-          </router-link>
-        </div>
-        <input v-if="isMobile" type="checkbox" id="navActive" />
-        <nav>
-          <label v-if="isMobile" for="navActive" class="nav-item">
-            <span>Hello💐，</span>
-            {{ userName }}
-          </label>
-          <label
-            for="navActive"
-            class="nav-item"
-            v-for="(n, idx) in navList"
-            :key="idx"
-            :class="{
-              active: navActiveIdx === idx
-            }"
-            @click="handleNav(idx)"
-            >{{ n.title }}</label
-          >
-          <label
-            @click="handleLogout"
-            v-if="isMobile"
-            for="navActive"
-            class="nav-item"
-          >
-            <span style="margin-right: 6px">退出</span>
-            <el-icon size="16">
-              <svg
-                width="16"
-                height="16"
-                viewBox="0 0 16 16"
-                fill="none"
-                xmlns="http://www.w3.org/2000/svg"
-                data-v-53d86618
-              >
-                <path
-                  fill-rule="evenodd"
-                  clip-rule="evenodd"
-                  d="M10.6667 2.55473C13.0212 3.58347 14.6667 5.93291 14.6667 8.66667C14.6667 12.3486 11.6819 15.3333 8 15.3333C4.3181 15.3333 1.33333 12.3486 1.33333 8.66667C1.33333 5.93291 2.97879 3.58347 5.33333 2.55473V4.04684C3.7392 4.969 2.66667 6.69259 2.66667 8.66667C2.66667 11.6122 5.05448 14 8 14C10.9455 14 13.3333 11.6122 13.3333 8.66667C13.3333 6.69259 12.2608 4.969 10.6667 4.04684V2.55473ZM7.33333 8.66667V1.33333C7.33333 1.14924 7.48257 1 7.66667 1H8.33333C8.51743 1 8.66667 1.14924 8.66667 1.33333V8.66667C8.66667 8.85076 8.51743 9 8.33333 9H7.66667C7.48257 9 7.33333 8.85076 7.33333 8.66667Z"
-                  fill="#86909C"
-                  data-v-53d86618
-                />
-              </svg>
-            </el-icon>
-          </label>
-        </nav>
-        <div class="mask"></div>
-      </div>
-      <!-- 移动端展示 -->
-      <span id="navMenu">
-        <message-panel v-if="isMobile" class="mobile-message-bell" />
-        <label for="navActive">
-          <el-icon size="32">
-            <Expand />
-          </el-icon>
-        </label>
-      </span>
-      <div class="flex fac" v-if="!isMobile">
-        <message-panel />
-        <span>Hello 💐，</span>
-        <el-dropdown class="exit">
-          <span class="exit-info">
-            <span class="ellipsis">{{ userName }}</span>
-            <el-icon>
-              <ArrowDown />
-            </el-icon>
-          </span>
-          <template #dropdown>
-            <el-dropdown-menu>
-              <el-dropdown-item @click="handleLogout" :icon="Close"
-                >退出</el-dropdown-item
-              >
-            </el-dropdown-menu>
-          </template>
-        </el-dropdown>
-      </div>
-    </div>
-    <router-view></router-view>
-    <div>
-      <home-footer type="dashboard"></home-footer>
-    </div>
-  </div>
-</template>
-<script lang="ts" setup>
-import { Expand, Close, ArrowDown, Bell } from '@element-plus/icons-vue'
-import HomeFooter from '@components/HomeFooter/index.vue'
-
-import { onMounted, reactive, ref, computed, watch } from 'vue'
-import { useRoute, useRouter } from 'vue-router'
-import { useStore } from 'vuex'
-import { ElMessage, ElMessageBox } from 'element-plus'
-import MessagePanel from '@/components/MessagePanel/index.vue'
-import { UserApi } from '@/apis'
-
-const $router = useRouter()
-const $store = useStore()
-const $route = useRoute()
-const isMobile = computed(() => $store.getters['public/isMobile'])
-const navList = reactive<
-  { title: string; path: string; isExternal?: boolean }[]
->([
-  {
-    title: '文件管理',
-    path: '/dashboard/files'
-  },
-  {
-    title: '任务管理',
-    path: '/dashboard/tasks'
-  }
-])
-const navActiveIdx = ref(0)
-const handleNav = (idx: number) => {
-  const n = navList[idx]
-  if (!n.isExternal && idx !== navActiveIdx.value) {
-    $router.push({
-      path: n.path
-    })
-  }
-  if (n.isExternal) {
-    window.open(n.path, '_blank')
-  }
-}
-
-// 自动切换激活的标题栏
-watch(
-  () => $route.path,
-  (path: string) => {
-    const idx = navList.findIndex((n) => path.startsWith(n.path))
-    if (idx !== -1) {
-      navActiveIdx.value = idx
-    }
-  }
-)
-
-const handleLogout = () => {
-  ElMessageBox.confirm('确认退出登录？', '登出提示', {
-    draggable: true
-  })
-    .then(() => {
-      // 登出接口
-      UserApi.logout().finally(() => {
-        $store.commit('user/setToken', null)
-        $router.replace({
-          name: 'home'
-        })
-      })
-    })
-    .catch(() => {
-      ElMessage.info('取消')
-    })
-}
-const userName = ref('World')
-
-const refreshActiveTab = () => {
-  // 动态修改active的项
-  navActiveIdx.value = navList.findIndex((v) => $route.path.startsWith(v.path))
-}
-onMounted(() => {
-  // 动态添加管理页面入口
-  UserApi.checkPower().then((r) => {
-    const isSuperAdmin = r.data?.power
-    userName.value = r.data?.name
-    $store.commit('user/setSuperAdmin', isSuperAdmin)
-    if (isSuperAdmin) {
-      const superNavList = [
-        {
-          title: '应用管理',
-          path: '/dashboard/manage'
-        },
-        {
-          title: '网站监控',
-          path: 'https://www.frontjs.com/app/87c1ef7667a513f313b4abb22a88dc78',
-          isExternal: true
-        }
-      ]
-      navList.push(...superNavList)
-    }
-    const isSystem = r.data?.system
-    if (isSystem) {
-      navList.splice(0, navList.length)
-      navList.push({
-        title: '系统管理',
-        path: '/dashboard/config'
-      })
-    }
-    refreshActiveTab()
-  })
-})
-</script>
-<style scoped lang="scss">
-.dashboard {
-  background-color: #fafafa;
-}
-.pc-nav {
-  background-color: #fff;
-  display: flex;
-  padding: 10px;
-  justify-content: space-between;
-  align-items: center;
-  .exit {
-    cursor: pointer;
-    display: flex;
-    align-items: center;
-    .exit-info {
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      > span {
-        margin-right: 5px;
-        display: block;
-        max-width: 70px;
-      }
-    }
-  }
-  .nav {
-    display: flex;
-    nav {
-      display: flex;
-      align-items: center;
-      .nav-item {
-        font-size: 1rem;
-        color: #595959;
-        padding: 10px;
-        cursor: pointer;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        &.active {
-          color: #409eff !important;
-          font-weight: 600;
-        }
-      }
-    }
-    .exit {
-      color: #595959;
-    }
-  }
-  .logo {
-    width: 180px;
-    margin: 0 10px;
-    img {
-      height: 40px;
-    }
-  }
-}
-#navActive {
-  display: none;
-  opacity: 0;
-}
-#navMenu {
-  display: none;
-}
-.mobile-message-bell {
-  display: none;
-  position: fixed;
-  right: 0;
-  top: 0;
-}
-@media screen and (max-width: 700px) {
-  #navActive {
-    display: block;
-    position: fixed;
-    left: 0;
-    top: 0;
-  }
-  .mobile-message-bell {
-    display: block;
-  }
-  #navMenu {
-    cursor: pointer;
-    display: block;
-    position: absolute;
-    left: 10px;
-    top: 5px;
-    font-size: 2rem;
-  }
-  .pc-nav {
-    position: fixed;
-    left: 0;
-    right: 0;
-    top: 0;
-    z-index: 6;
-    .nav {
-      flex-wrap: wrap;
-      width: 100%;
-      .logo {
-        width: 100%;
-        text-align: center;
-      }
-    }
-    #navActive {
-      & + nav {
-        display: none;
-      }
-    }
-    #navActive:checked {
-      & + nav {
-        display: flex;
-        flex-direction: column;
-        width: 100%;
-        position: absolute;
-        z-index: 1;
-        background: #fff;
-        left: 0;
-        top: 50px;
-        + .mask {
-          display: block;
-          position: fixed;
-          left: 0;
-          right: 0;
-          bottom: 0;
-          top: 50px;
-          background-color: rgba(0, 0, 0, 0.5);
-        }
-      }
-    }
-    .exit {
-      position: absolute;
-      right: 10px;
-      top: 20px;
-    }
-  }
-}
-</style>

package/src/pages/dashboard/manage/config/index.vue

@@ -1,97 +0,0 @@
-<template>
-  <div class="user">
-    <div class="panel">
-      <el-divider>部分路由管理</el-divider>
-      <ul class="routes">
-        <li v-for="r in showRoutes" :key="r.name">
-          <el-switch
-            @change="handleChangeRoute(r)"
-            :value="!r.disabled"
-            style="
-              --el-switch-on-color: #13ce66;
-              --el-switch-off-color: #ff4949;
-            "
-          />
-          <span class="title">{{ r.title }}</span>
-          <span class="path">{{ r.path }}</span>
-        </li>
-      </ul>
-    </div>
-  </div>
-</template>
-<script lang="ts" setup>
-import { ElMessage } from 'element-plus'
-import { computed, onMounted, reactive, ref } from 'vue'
-import { useStore } from 'vuex'
-import { useRouter } from 'vue-router'
-import { SuperOverviewApi } from '@/apis'
-
-const $store = useStore()
-const $router = useRouter()
-const routes = computed(() =>
-  $router.options.routes.filter((v) => v.meta?.allowDisabled)
-)
-const showRoutes = reactive<
-  {
-    path: string
-    name: string
-    title: string
-    disabled: boolean
-  }[]
->([])
-
-const handleChangeRoute = (r: typeof showRoutes[0]) => {
-  SuperOverviewApi.addDisabledRoute(r.path, !r.disabled).then(() => {
-    r.disabled = !r.disabled
-  })
-}
-onMounted(() => {
-  for (const r of routes.value) {
-    SuperOverviewApi.checkDisabledRoute(r.path).then((v) => {
-      showRoutes.push({
-        path: r.path,
-        name: r.name.toString(),
-        title: r.meta.title,
-        disabled: !!v.data?.status
-      })
-    })
-  }
-})
-const isMobile = computed(() => $store.getters['public/isMobile'])
-</script>
-
-<style scoped lang="scss">
-@media screen and (max-width: 700px) {
-  .user {
-    margin-top: 40px !important;
-  }
-}
-
-.user {
-  margin: 0 auto;
-}
-
-.panel {
-  max-width: 1256px;
-  padding: 1em;
-  background-color: #fff;
-  margin: 10px auto;
-  box-sizing: border-box;
-  box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
-  border-radius: 4px;
-}
-
-.routes {
-  max-width: 500px;
-  margin: 0 auto;
-  li {
-    display: flex;
-    padding: 20px;
-    align-items: center;
-    .title {
-      font-weight: bold;
-      margin: 0 10px;
-    }
-  }
-}
-</style>

package/src/pages/dashboard/manage/index.vue

@@ -1,105 +0,0 @@
-<template>
-  <div class="monitor">
-    <div class="navs">
-      <el-menu
-        :default-active="defaultActive"
-        class="el-menu-nav"
-        :collapse="isCollapse"
-        @select="handleSelect"
-      >
-        <el-menu-item index="overview">
-          <el-icon>
-            <DataAnalysis />
-          </el-icon>
-          <template #title>概况</template>
-        </el-menu-item>
-        <el-menu-item index="user">
-          <el-icon>
-            <User />
-          </el-icon>
-          <template #title>用户</template>
-        </el-menu-item>
-        <el-menu-item index="wish">
-          <el-icon>
-            <DataBoard />
-          </el-icon>
-          <template #title>需求</template>
-        </el-menu-item>
-        <el-menu-item index="config">
-          <el-icon>
-            <Setting />
-          </el-icon>
-          <template #title>配置</template>
-        </el-menu-item>
-      </el-menu>
-    </div>
-    <div class="container">
-      <router-view></router-view>
-    </div>
-  </div>
-</template>
-<script lang="ts" setup>
-import { onMounted, ref } from 'vue'
-import { useRoute, useRouter } from 'vue-router'
-import { User, DataBoard, DataAnalysis, Setting } from '@element-plus/icons-vue'
-
-const defaultActive = ref('overview')
-const isCollapse = ref(false)
-const $router = useRouter()
-const $route = useRoute()
-const handleSelect = (path: string) => {
-  if ($route.path.endsWith(path)) {
-    return
-  }
-  $router.replace({
-    path
-  })
-}
-onMounted(() => {
-  const value = $route.path.split('/').slice(-1)[0]
-  defaultActive.value = value
-})
-</script>
-
-<style scoped>
-.monitor {
-  width: 96%;
-  /* min-height: 100vh; */
-  padding: 10px;
-  overflow: hidden;
-  display: flex;
-}
-.navs {
-  min-width: 140px;
-}
-.container {
-  padding-left: 20px;
-  flex-grow: 1;
-  width: calc(100% - 150px);
-}
-
-@media screen and (max-width: 700px) {
-  .monitor {
-    margin-top: 70px;
-    padding: 10px 0;
-    width: 100%;
-  }
-  .navs {
-    position: absolute;
-    left: 50%;
-    transform: translateX(-50%);
-  }
-
-  .el-radio-group {
-    display: none;
-  }
-  .el-menu-nav {
-    display: flex;
-  }
-  .container {
-    padding-left: 0;
-    margin-top: 30px;
-    width: 100%;
-  }
-}
-</style>