feat: 更换logo

Former-commit-id: 01401f1e9ba211c29e0baa6c224db93f88796d6c
2022-05-15 00:06:22 +08:00
parent 4205db37f0
commit de34583621
6 changed files with 78 additions and 56 deletions
--- a/src/components/Hamburger/index.vue
+++ b/src/components/Hamburger/index.vue
@@ -1,29 +1,34 @@
 <template>
  <div style="padding: 0 15px" @click="toggleClick">
-    <svg :class="{ 'is-active': isActive }" class="hamburger" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg"
-      width="64" height="64">
+    <svg
+      :class="{ 'is-active': isActive }"
+      class="hamburger"
+      viewBox="0 0 1024 1024"
+      xmlns="http://www.w3.org/2000/svg"
+      width="64"
+      height="64"
+    >
      <path
-        d="M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM142.4 642.1L298.7 519a8.84 8.84 0 0 0 0-13.9L142.4 381.9c-5.8-4.6-14.4-.5-14.4 6.9v246.3a8.9 8.9 0 0 0 14.4 7z" />
+        d="M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM142.4 642.1L298.7 519a8.84 8.84 0 0 0 0-13.9L142.4 381.9c-5.8-4.6-14.4-.5-14.4 6.9v246.3a8.9 8.9 0 0 0 14.4 7z"
+      />
    </svg>
  </div>
 </template>

 <script setup lang="ts">
-
 defineProps({
  isActive: {
    required: true,
    type: Boolean,
    default: false
-  },
-})
+  }
+});

 const emit = defineEmits(['toggleClick']);

 function toggleClick() {
-  emit('toggleClick')
+  emit('toggleClick');
 }
-
 </script>

 <style scoped>
--- a/src/layout/components/Sidebar/Logo.vue
+++ b/src/layout/components/Sidebar/Logo.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="sidebar-logo-container" :class="{ collapse: isCollapse }">
+  <div class="sidebar-logo-container" :class="{ collapse: collapse }">
    <transition name="sidebarLogoFade">
      <router-link
        v-if="collapse"
@@ -8,18 +8,18 @@
        to="/"
      >
        <img v-if="logo" :src="logo" class="sidebar-logo" />
-        <h1 v-else class="sidebar-title">{{ title }}</h1>
+        <h1 v-else class="sidebar-title">vue3-element-admin</h1>
      </router-link>
      <router-link v-else key="expand" class="sidebar-logo-link" to="/">
        <img v-if="logo" :src="logo" class="sidebar-logo" />
-        <h1 class="sidebar-title">{{ title }}</h1>
+        <h1 class="sidebar-title">vue3-element-admin</h1>
      </router-link>
    </transition>
  </div>
 </template>

 <script setup lang="ts">
-import { ref, reactive, toRefs } from 'vue';
+import { reactive, toRefs } from 'vue';

 const props = defineProps({
  collapse: {
@@ -29,13 +29,11 @@ const props = defineProps({
 });

 const state = reactive({
-  isCollapse: props.collapse
+  isCollapse: props.collapse,
+  logo: new URL(`../../../assets/logo.png`, import.meta.url).href
 });

-const { isCollapse } = toRefs(state);
-
-const title = ref('vue3-element-admin');
-const logo = ref('https://www.youlai.tech/files/blog/logo.png');
+const { logo } = toRefs(state);
 </script>

 <style lang="scss" scoped>
@@ -62,8 +60,8 @@ const logo = ref('https://www.youlai.tech/files/blog/logo.png');
    width: 100%;

    & .sidebar-logo {
-      width: 32px;
-      height: 32px;
+      width: 20px;
+      height: 20px;
      vertical-align: middle;
    }

--- a/src/views/dashboard/components/Project/index.vue
+++ b/src/views/dashboard/components/Project/index.vue
@@ -51,8 +51,8 @@
            <el-link
              target="_blank"
              type="warning"
-              href="http://youlaitech.gitee.io/youlai-mall"
-              >官方文档(完善中..)</el-link
+              href="https://www.youlai.tech/"
+              >官方文档</el-link
            >
          </el-col>
          <el-col :span="6">
@@ -95,7 +95,7 @@

 <script lang="ts">
 export default {
-  name: 'index',
+  name: 'index'
 };
 </script>

--- a/src/views/error-page/401.vue
+++ b/src/views/error-page/401.vue
@@ -1,7 +1,7 @@
 <!-- setup 无法设置组件名称，组件名称keepAlive必须 -->
 <script lang="ts">
 export default {
-  name: 'Page401',
+  name: 'Page401'
 };
 </script>

@@ -10,16 +10,14 @@ import { reactive, toRefs } from 'vue';
 import { useRouter } from 'vue-router';

 const state = reactive({
-  errGif: new URL(
-    `../../assets/401_images/401.gif`,
-    import.meta.url).href,
+  errGif: new URL(`../../assets/401_images/401.gif`, import.meta.url).href,

  ewizardClap:
    'https://wpimg.wallstcn.com/007ef517-bafd-4066-aae4-6883632d9646',
-  dialogVisible: false,
-})
+  dialogVisible: false
+});

-const { errGif, ewizardClap, dialogVisible } = toRefs(state)
+const { errGif, ewizardClap, dialogVisible } = toRefs(state);

 const router = useRouter();

@@ -53,7 +51,12 @@ function back() {
        </ul>
      </el-col>
      <el-col :span="12">
-        <img :src="errGif" width="313" height="428" alt="Girl has dropped her ice cream." />
+        <img
+          :src="errGif"
+          width="313"
+          height="428"
+          alt="Girl has dropped her ice cream."
+        />
      </el-col>
    </el-row>
    <el-dialog v-model="dialogVisible" title="随便看">
@@ -62,7 +65,6 @@ function back() {
  </div>
 </template>

-
 <style lang="scss" scoped>
 .errPage-container {
  width: 800px;
--- a/src/views/error-page/404.vue
+++ b/src/views/error-page/404.vue
@@ -1,32 +1,51 @@
 <!-- setup 无法设置组件名称，组件名称keepAlive必须 -->
 <script lang="ts">
 export default {
-  name: 'Page404',
+  name: 'Page404'
 };
 </script>

 <script setup lang="ts">
-
 function message() {
  return 'The webmaster said that you can not enter this page...';
 }
 </script>

-
 <template>
  <div class="wscn-http404-container">
    <div class="wscn-http404">
      <div class="pic-404">
-        <img class="pic-404__parent" src="@/assets/404_images/404.png" alt="404" />
-        <img class="pic-404__child left" src="@/assets/404_images/404_cloud.png" alt="404" />
-        <img class="pic-404__child mid" src="@/assets/404_images/404_cloud.png" alt="404" />
-        <img class="pic-404__child right" src="@/assets/404_images/404_cloud.png" alt="404" />
+        <img
+          class="pic-404__parent"
+          src="@/assets/404_images/404.png"
+          alt="404"
+        />
+        <img
+          class="pic-404__child left"
+          src="@/assets/404_images/404_cloud.png"
+          alt="404"
+        />
+        <img
+          class="pic-404__child mid"
+          src="@/assets/404_images/404_cloud.png"
+          alt="404"
+        />
+        <img
+          class="pic-404__child right"
+          src="@/assets/404_images/404_cloud.png"
+          alt="404"
+        />
      </div>
      <div class="bullshit">
        <div class="bullshit__oops">OOPS!</div>
        <div class="bullshit__info">
          All rights reserved
-          <a style="color: #20a0ff" href="https://wallstreetcn.com" target="_blank">wallstreetcn</a>
+          <a
+            style="color: #20a0ff"
+            href="https://wallstreetcn.com"
+            target="_blank"
+            >wallstreetcn</a
+          >
        </div>
        <div class="bullshit__headline">{{ message }}</div>
        <div class="bullshit__info">
--- a/src/views/pms/goods/components/GoodsInfo.vue
+++ b/src/views/pms/goods/components/GoodsInfo.vue
@@ -53,10 +53,7 @@
            <single-upload v-model="item.url" :show-close="true" />

            <div v-if="item.url">
-              <el-link
-                type="danger"
-                class="button"
-                v-if="item.main == true"
+              <el-link type="danger" class="button" v-if="item.main == true"
                >商品主图</el-link
              >
              <el-link
@@ -64,7 +61,8 @@
                class="button"
                v-else
                @click="changeMainPicture(index)"
-                >设为主图</el-link>
+                >设为主图</el-link
+              >
            </div>

            <div v-else>
@@ -105,15 +103,15 @@ const dataFormRef = ref(ElForm);
 const props = defineProps({
  modelValue: {
    type: Object,
-    default: () => {},
-  },
+    default: () => {}
+  }
 });

 const goodsInfo: any = computed({
  get: () => props.modelValue,
-  set: (value) => {
+  set: value => {
    emit('update:modelValue', value);
-  },
+  }
 });

 const state = reactive({
@@ -124,14 +122,14 @@ const state = reactive({
    { url: undefined, main: false },
    { url: undefined, main: false },
    { url: undefined, main: false },
-    { url: undefined, main: false },
+    { url: undefined, main: false }
  ] as Array<any>,
  rules: {
    name: [{ required: true, message: '请填写商品名称', trigger: 'blur' }],
    originPrice: [{ required: true, message: '请填写原价', trigger: 'blur' }],
    price: [{ required: true, message: '请填写现价', trigger: 'blur' }],
-    brandId: [{ required: true, message: '请选择商品品牌', trigger: 'blur' }],
-  },
+    brandId: [{ required: true, message: '请选择商品品牌', trigger: 'blur' }]
+  }
 });

 const { brandOptions, pictures, rules } = toRefs(state);
@@ -144,7 +142,7 @@ function loadData() {
  if (goodsId) {
    const mainPicUrl = goodsInfo.value.picUrl;
    if (mainPicUrl) {
-      state.pictures.filter((item) => item.main)[0].url = mainPicUrl;
+      state.pictures.filter(item => item.main)[0].url = mainPicUrl;
    }
    const subPicUrls = goodsInfo.value.subPicUrls;
    if (subPicUrls && subPicUrls.length > 0) {
@@ -177,14 +175,14 @@ function handleNext() {
    if (valid) {
      // 商品图片
      const mainPicUrl = state.pictures
-        .filter((item) => item.main == true && item.url)
-        .map((item) => item.url);
+        .filter(item => item.main == true && item.url)
+        .map(item => item.url);
      if (mainPicUrl && mainPicUrl.length > 0) {
        goodsInfo.value.picUrl = mainPicUrl[0];
      }
      const subPicUrl = state.pictures
-        .filter((item) => item.main == false && item.url)
-        .map((item) => item.url);
+        .filter(item => item.main == false && item.url)
+        .map(item => item.url);
      if (subPicUrl && subPicUrl.length > 0) {
        goodsInfo.value.subPicUrls = subPicUrl;
      }