From 135672988ea095b479d3b96ef84913c73c4297ea Mon Sep 17 00:00:00 2001
From: dengbw <dengbw@shengshi.com.cn>
Date: Mon, 22 May 2023 15:48:17 +0800
Subject: [PATCH] =?UTF-8?q?=E5=88=9D=E5=A7=8B=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .browserslistrc                    |   4 +
 .editorconfig                      |  15 ++
 .env                               |   3 +
 .env.development                   |   2 +
 .env.preview                       |   3 +
 .eslintignore                      |   4 +
 .eslintrc.js                       |  23 +++
 .gitignore                         |  23 +++
 .prettierignore                    |  10 ++
 exclude.list                       |   3 +-
 src/config/setting.js              |   5 +-
 src/views/extension/icon/index.vue | 227 +++++++++++++++++++++++++++++
 12 files changed, 318 insertions(+), 4 deletions(-)
 create mode 100644 .browserslistrc
 create mode 100644 .editorconfig
 create mode 100644 .env
 create mode 100644 .env.development
 create mode 100644 .env.preview
 create mode 100644 .eslintignore
 create mode 100644 .eslintrc.js
 create mode 100644 .gitignore
 create mode 100644 .prettierignore
 create mode 100644 src/views/extension/icon/index.vue

diff --git a/.browserslistrc b/.browserslistrc
new file mode 100644
index 00000000..669db341
--- /dev/null
+++ b/.browserslistrc
@@ -0,0 +1,4 @@
+> 1%
+last 2 versions
+Chrome >= 63
+not dead
diff --git a/.editorconfig b/.editorconfig
new file mode 100644
index 00000000..92639abb
--- /dev/null
+++ b/.editorconfig
@@ -0,0 +1,15 @@
+# https://editorconfig.org
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+tab_width = 2
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false
+insert_final_newline = false
diff --git a/.env b/.env
new file mode 100644
index 00000000..1f78438c
--- /dev/null
+++ b/.env
@@ -0,0 +1,3 @@
+VUE_APP_NAME=''
+VUE_APP_API_BASE_URL=https://market.liche.cn/api
+#npm run build 加载环境
\ No newline at end of file
diff --git a/.env.development b/.env.development
new file mode 100644
index 00000000..3754cdd9
--- /dev/null
+++ b/.env.development
@@ -0,0 +1,2 @@
+VUE_APP_API_BASE_URL=http://market.dev.liche.cn/api
+#npm run serve 加载环境
diff --git a/.env.preview b/.env.preview
new file mode 100644
index 00000000..5ed0bc17
--- /dev/null
+++ b/.env.preview
@@ -0,0 +1,3 @@
+NODE_ENV=production
+VUE_APP_API_BASE_URL=https://market.liche.cn/api
+npm run build:preview 加载环境
\ No newline at end of file
diff --git a/.eslintignore b/.eslintignore
new file mode 100644
index 00000000..33959ae5
--- /dev/null
+++ b/.eslintignore
@@ -0,0 +1,4 @@
+public
+src/assets
+node_modules
+dist
diff --git a/.eslintrc.js b/.eslintrc.js
new file mode 100644
index 00000000..14707ae4
--- /dev/null
+++ b/.eslintrc.js
@@ -0,0 +1,23 @@
+module.exports = {
+  root: true,
+  env: {
+    browser: true,
+    node: true,
+    es6: true
+  },
+  parser: 'vue-eslint-parser',
+  extends: [
+    'plugin:vue/essential',
+    'eslint:recommended',
+    'plugin:prettier/recommended'
+  ],
+  parserOptions: {
+    ecmaVersion: 2020,
+    sourceType: 'module'
+  },
+  rules: {
+    'no-console': 'off',
+    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
+    'vue/multi-word-component-names': 'off'
+  }
+};
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 00000000..d46d543c
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,23 @@
+.DS_Store
+node_modules
+/dist
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+.pnpm-debug.log
+.eslintcache
+
+# Editor directories and files
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
diff --git a/.prettierignore b/.prettierignore
new file mode 100644
index 00000000..9de3b6ed
--- /dev/null
+++ b/.prettierignore
@@ -0,0 +1,10 @@
+/public/**
+/src/assets/**
+/node_modules/**
+/dist/**
+
+.local
+.output.js
+
+**/*.svg
+**/*.sh
diff --git a/exclude.list b/exclude.list
index 03c1fc6b..7da99cc9 100644
--- a/exclude.list
+++ b/exclude.list
@@ -3,7 +3,6 @@
 /node_modules
 .svn
 .git
-config.js
 
 .DS_Store
 .env.local
@@ -20,4 +19,4 @@ yarn-error.log*
 *.ntvs*
 *.njsproj
 *.sln
-*.sw?
+*.sw?
\ No newline at end of file
diff --git a/src/config/setting.js b/src/config/setting.js
index 78a33722..a23d68cb 100644
--- a/src/config/setting.js
+++ b/src/config/setting.js
@@ -1,6 +1,7 @@
 // 接口地址
-export const API_BASE_URL = process.env.VUE_APP_API_BASE_URL;
-//export const API_BASE_URL = 'http://localhost:8088/system';
+//export const API_BASE_URL = process.env.VUE_APP_API_BASE_URL;
+export const API_BASE_URL = 'http://localhost:8088/system';
+//export const API_BASE_URL = 'https://cloud.haodian.cn/system';
 
 // 项目名称
 export const PROJECT_NAME = process.env.VUE_APP_NAME;
diff --git a/src/views/extension/icon/index.vue b/src/views/extension/icon/index.vue
new file mode 100644
index 00000000..0ce80409
--- /dev/null
+++ b/src/views/extension/icon/index.vue
@@ -0,0 +1,227 @@
+<template>
+  <div :class="['ele-body', { 'demo-icon-responsive': styleResponsive }]">
+    <el-alert
+      show-icon
+      type="info"
+      :title="tips"
+      :closable="true"
+      class="ele-alert-border"
+      style="margin-bottom: 10px"
+    />
+    <el-card shadow="never" body-style="padding: 0;" style="overflow: visible">
+      <div class="demo-icon-header ele-bg-white">
+        <el-tabs
+          :value="active"
+          class="demo-icon-tabs"
+          @tab-click="onTabChange"
+        >
+          <el-tab-pane
+            v-for="(item, index) in data"
+            :key="index"
+            :label="item.title"
+            :name="String(index)"
+          />
+        </el-tabs>
+        <div class="demo-icon-search">
+          <el-input
+            clearable
+            size="small"
+            v-model="keywords"
+            suffix-icon="el-icon-search"
+            placeholder="输入关键词搜索"
+            @input="onSearchChange"
+          />
+        </div>
+      </div>
+      <div style="padding: 15px">
+        <el-row v-if="result.length" class="demo-icon">
+          <el-col
+            v-for="(d, i) in result"
+            :key="i"
+            v-bind="styleResponsive ? { md: 4, sm: 6, xs: 8 } : { span: 4 }"
+            class="demo-icon-item"
+            v-clipboard:copy="d"
+            v-clipboard:error="onError"
+            v-clipboard:success="onCopy"
+          >
+            <div class="demo-icon-content">
+              <i :class="d"></i>
+            </div>
+            <div class="demo-icon-text ele-text-secondary">{{ d }}</div>
+            <div class="demo-icon-tip ele-bg-primary">点击复制</div>
+          </el-col>
+        </el-row>
+        <ele-empty v-else />
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+  import icons from 'ele-admin/es/ele-icon-picker/icons';
+
+  export default {
+    name: 'ExtensionIcon',
+    data() {
+      let elNum = 0;
+      let eleNum = 0;
+      icons.forEach((item) => {
+        item.icons.forEach((d) => {
+          if (d.indexOf('el-icon-_') === 0) {
+            eleNum++;
+          } else {
+            elNum++;
+          }
+        });
+      });
+      const total = elNum + eleNum;
+      return {
+        // 图标数据
+        data: icons,
+        // 搜索关键字
+        keywords: '',
+        // 当前显示的图标
+        result: icons[0]?.icons,
+        // 页签选中
+        active: '0',
+        // 提示文字
+        tips: `新增 ${eleNum} 个图标 + Element UI ${elNum} 个图标, 共计 ${total} 个图标`
+      };
+    },
+    computed: {
+      // 是否开启响应式布局
+      styleResponsive() {
+        return this.$store.state.theme.styleResponsive;
+      }
+    },
+    methods: {
+      /* 页签切换事件 */
+      onTabChange(obj) {
+        if (this.active !== obj.name) {
+          this.active = obj.name;
+          const temp = this.data[this.active].icons;
+          if (this.keywords) {
+            this.result = temp.filter((d) => d.includes(this.keywords));
+          } else {
+            this.result = temp;
+          }
+        }
+      },
+      /* 输入框改变事件 */
+      onSearchChange() {
+        for (let i = 0; i < this.data.length; i++) {
+          const temp = this.data[i].icons;
+          const result = temp.filter((d) => d.includes(this.keywords));
+          if (result.length) {
+            this.active = String(i);
+            this.result = result;
+            return;
+          }
+        }
+        this.result = [];
+      },
+      /* 复制成功 */
+      onCopy() {
+        this.$message.success('复制成功');
+      },
+      /* 复制失败 */
+      onError() {
+        this.$message.error('复制失败');
+      }
+    }
+  };
+</script>
+
+<style lang="scss" scoped>
+  .demo-icon-header {
+    position: sticky;
+    top: 0;
+    border-radius: 4px;
+    z-index: 1;
+  }
+
+  /* 选项卡 */
+  .demo-icon-tabs {
+    :deep(.el-tabs__nav-scroll) {
+      padding: 0 0 0 30px;
+    }
+
+    :deep(.el-tabs__item) {
+      height: 48px;
+      line-height: 48px;
+      padding: 0 30px 0 0 !important;
+    }
+
+    :deep(.el-tabs__item:focus.is-active.is-focus:not(:active)) {
+      box-shadow: none;
+    }
+  }
+
+  /* 搜索框 */
+  .demo-icon-search {
+    position: absolute;
+    top: 8px;
+    right: 15px;
+    width: 180px;
+    z-index: 1;
+  }
+
+  @media screen and (max-width: 660px) {
+    .demo-icon-responsive .demo-icon-search {
+      width: auto;
+      position: static;
+      margin: 10px 10px 0 10px;
+    }
+  }
+
+  /* 图标 */
+  .demo-icon {
+    border-top: 1px solid hsla(0, 0%, 60%, 0.15);
+    border-left: 1px solid hsla(0, 0%, 60%, 0.15);
+  }
+
+  .demo-icon-item {
+    text-align: center;
+    padding: 24px 0;
+    border-right: 1px solid hsla(0, 0%, 60%, 0.15);
+    border-bottom: 1px solid hsla(0, 0%, 60%, 0.15);
+    position: relative;
+    overflow: hidden;
+    cursor: pointer;
+
+    & > .demo-icon-content > i {
+      font-size: 38px;
+    }
+
+    & > .demo-icon-text {
+      padding: 0 5px;
+      font-size: 14px;
+      margin-top: 8px;
+      white-space: nowrap;
+      word-break: break-all;
+      text-overflow: ellipsis;
+      overflow: hidden;
+    }
+
+    & > .demo-icon-tip {
+      position: absolute;
+      left: 0;
+      right: 0;
+      bottom: -30px;
+      color: #fff;
+      padding: 4px 0;
+      font-size: 12px;
+      transition: bottom 0.2s;
+    }
+
+    &:hover > .demo-icon-tip {
+      bottom: 0;
+    }
+  }
+
+  :deep(.ele-admin-fixed-header:not(.ele-admin-fixed-body)) {
+    .demo-icon-header {
+      top: 100px;
+    }
+  }
+</style>