Эхлэл Бүгдийг харах Тусламж
Бүртгүүлэх Нэвтрэх
tourism_project
/
tourism_merchant_ui
8
0
Салаа 0
Файлууд Асуудлууд 0 Хуулах хүсэлтүүд 0 Мэдлэгийн сан
Эх сурвалжийг харах

1. 完成登录得改造

MONSTER-ygh 1 жил өмнө
parent
ad10939a13
commit
d133b10df3
16 өөрчлөгдсөн 1113 нэмэгдсэн , 1704 устгасан
Өөрчлөлтийг ялгаж харах Өөрчлөлтийн статистик харах
  1. 30 2
      src/api/login.js
  2. 62 0
      src/api/tourism/scenicAreaManagement/attractionInfo.js
  3. 0 1614
      src/assets/iconfont/demo_index.html
  4. BIN
      src/assets/images/login-background.jpg
  5. BIN
      src/assets/images/login-background.png
  6. BIN
      src/assets/images/login-bg-img.png
  7. BIN
      src/assets/login/from_left.png
  8. BIN
      src/assets/login/from_right.png
  9. BIN
      src/assets/login/from_title.png
  10. 18 8
      src/store/modules/user.js
  11. 315 78
      src/views/login.vue
  12. 2 2
      src/views/register.vue
  13. 273 0
      src/views/tourism/scenicAreaManagement/contentManagement/attractionInfo.vue
  14. 294 0
      src/views/tourism/scenicAreaManagement/contentManagement/dialog/addAndEdit.vue
  15. 114 0
      src/views/tourism/scenicAreaManagement/contentManagement/dialog/details.vue
  16. 5 0
      src/views/tourism/scenicAreaManagement/contentManagement/navigationManagement.vue

+ 30 - 2
src/api/login.js
Файл харах 

@@ -45,8 +45,8 @@ export function logout() {
 
     method: 'post'
 
   })
 
 }
 
-
 
-// 获取验证码
 
+ 
+// 获取验证码 （密码登录）
 
 export function getCodeImg() {
 
   return request({
 
     url: '/system/captcha/generate',
 
@@ -57,3 +57,31 @@ export function getCodeImg() {
 
     timeout: 20000
 
   })
 
 }
 
+
 
+// 获取验证码
 
+export function getCodeNum(data) {
 
+  return request({
 
+    url: '/merchant/merchantAuth/sendSmsCode',
 
+    headers: {
 
+      isToken: false
 
+    },
 
+    method: 'post',
 
+    data,
 
+    timeout: 20000
 
+  })
 
+}
 
+
 
+export function loginCode(username, code) {
 
+  const data = {
 
+    username,
 
+    code
 
+  }
 
+  return request({
 
+    url: '/merchant/merchantAuth/loginByCode',
 
+    headers: {
 
+      isToken: false
 
+    },
 
+    method: 'post',
 
+    data: data
 
+  })
 
+}

+ 62 - 0
src/api/tourism/scenicAreaManagement/attractionInfo.js
Файл харах 

@@ -0,0 +1,62 @@
 
+import request from '@/utils/request'
 
+
 
+// 分页查询
 
+export const pageList = (query) => {
 
+  return request({
 
+    url: '/merchantDetail/pageList',
 
+    method: 'get',
 
+    params: query
 
+  })
 
+}
 
+
 
+export const ticketPageList = (query) => {
 
+  return request({
 
+    url: '/goods/goods/pageList',
 
+    method: 'get',
 
+    params: query
 
+  })
 
+}
 
+
 
+// 新增/修改
 
+export const saveAndEdit = (data) => {
 
+  return request({
 
+    url: '/goods/goods/insertOrUpdate',
 
+    method: 'post',
 
+    data: data
 
+  })
 
+}
 
+
 
+// 删除模板
 
+export const deleteById = (id) => {
 
+  return request({
 
+    url: '/goods/goods/deleteById',
 
+    method: 'delete',
 
+    params: {id:id}
 
+  })
 
+}
 
+
 
+// 修改上/下架状态
 
+export const updateStatus = (query) => {
 
+  return request({
 
+    url: '/goods/goods/updateStatus',
 
+    method: 'get',
 
+    params: query
 
+  })
 
+}
 
+
 
+// id获取详情
 
+export function getSelectById(id) {
 
+  return request({
 
+    url: '/goods/goods/selectById?id=' + id,
 
+    method: 'get'
 
+  })
 
+}
 
+
 
+// 获取行政区划
 
+export function basePositionApi(data) {
 
+  return request({
 
+    url: '/system/basePosition/list',
 
+    method: 'get',
 
+    params:data
 
+  })
 
+}

+ 0 - 1614
src/assets/iconfont/demo_index.html
Файл харах 

@@ -1,1614 +0,0 @@
 
-<!DOCTYPE html>
 
-<html>
 
-<head>
 
-  <meta charset="utf-8"/>
 
-  <title>iconfont Demo</title>
 
-  <link rel="shortcut icon" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg" type="image/x-icon"/>
 
-  <link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg"/>
 
-  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
 
-  <link rel="stylesheet" href="demo.css">
 
-  <link rel="stylesheet" href="iconfont.css">
 
-  <script src="iconfont.js"></script>
 
-  <!-- jQuery -->
 
-  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
 
-  <!-- 代码高亮 -->
 
-  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
 
-  <style>
 
-    .main .logo {
 
-      margin-top: 0;
 
-      height: auto;
 
-    }
 
-
 
-    .main .logo a {
 
-      display: flex;
 
-      align-items: center;
 
-    }
 
-
 
-    .main .logo .sub-title {
 
-      margin-left: 0.5em;
 
-      font-size: 22px;
 
-      color: #fff;
 
-      background: linear-gradient(-45deg, #3967FF, #B500FE);
 
-      -webkit-background-clip: text;
 
-      -webkit-text-fill-color: transparent;
 
-    }
 
-  </style>
 
-</head>
 
-<body>
 
-  <div class="main">
 
-    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
 
-      <img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
 
-      
-    </a></h1>
 
-    <div class="nav-tabs">
 
-      <ul id="tabs" class="dib-box">
 
-        <li class="dib active"><span>Unicode</span></li>
 
-        <li class="dib"><span>Font class</span></li>
 
-        <li class="dib"><span>Symbol</span></li>
 
-      </ul>
 
-      
-      <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=1782818" target="_blank" class="nav-more">查看项目</a>
 
-      
-    </div>
 
-    <div class="tab-container">
 
-      <div class="content unicode" style="display: block;">
 
-          <ul class="icon_lists dib-box">
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe6ef;</span>
 
-                <div class="name">删除列</div>
 
-                <div class="code-name">&amp;#xe6ef;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe6f0;</span>
 
-                <div class="name">删除行</div>
 
-                <div class="code-name">&amp;#xe6f0;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe7de;</span>
 
-                <div class="name">table</div>
 
-                <div class="code-name">&amp;#xe7de;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe60a;</span>
 
-                <div class="name">拆分行</div>
 
-                <div class="code-name">&amp;#xe60a;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe60b;</span>
 
-                <div class="name">拆分列</div>
 
-                <div class="code-name">&amp;#xe60b;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe60d;</span>
 
-                <div class="name">拆分</div>
 
-                <div class="code-name">&amp;#xe60d;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe6ce;</span>
 
-                <div class="name">行追加</div>
 
-                <div class="code-name">&amp;#xe6ce;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe6cf;</span>
 
-                <div class="name">列追加</div>
 
-                <div class="code-name">&amp;#xe6cf;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe8a2;</span>
 
-                <div class="name">插入行</div>
 
-                <div class="code-name">&amp;#xe8a2;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe8a4;</span>
 
-                <div class="name">插入列</div>
 
-                <div class="code-name">&amp;#xe8a4;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe66a;</span>
 
-                <div class="name">上下合并</div>
 
-                <div class="code-name">&amp;#xe66a;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe66b;</span>
 
-                <div class="name">左右合并</div>
 
-                <div class="code-name">&amp;#xe66b;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe609;</span>
 
-                <div class="name">treeselect</div>
 
-                <div class="code-name">&amp;#xe609;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe66e;</span>
 
-                <div class="name">Barcode</div>
 
-                <div class="code-name">&amp;#xe66e;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe612;</span>
 
-                <div class="name">bar-code</div>
 
-                <div class="code-name">&amp;#xe612;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe692;</span>
 
-                <div class="name">Dialog</div>
 
-                <div class="code-name">&amp;#xe692;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe6b5;</span>
 
-                <div class="name">Organization Chart</div>
 
-                <div class="code-name">&amp;#xe6b5;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe697;</span>
 
-                <div class="name">级联</div>
 
-                <div class="code-name">&amp;#xe697;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe666;</span>
 
-                <div class="name">Color picker</div>
 
-                <div class="code-name">&amp;#xe666;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe75f;</span>
 
-                <div class="name">省市区</div>
 
-                <div class="code-name">&amp;#xe75f;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe6fb;</span>
 
-                <div class="name">文本</div>
 
-                <div class="code-name">&amp;#xe6fb;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe8fb;</span>
 
-                <div class="name">link</div>
 
-                <div class="code-name">&amp;#xe8fb;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe61c;</span>
 
-                <div class="name">警告</div>
 
-                <div class="code-name">&amp;#xe61c;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe68e;</span>
 
-                <div class="name">alert</div>
 
-                <div class="code-name">&amp;#xe68e;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe608;</span>
 
-                <div class="name">gitee</div>
 
-                <div class="code-name">&amp;#xe608;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe607;</span>
 
-                <div class="name">Logo GitHub</div>
 
-                <div class="code-name">&amp;#xe607;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe82a;</span>
 
-                <div class="name">dialog</div>
 
-                <div class="code-name">&amp;#xe82a;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe68a;</span>
 
-                <div class="name">地图</div>
 
-                <div class="code-name">&amp;#xe68a;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe7bd;</span>
 
-                <div class="name">编辑器</div>
 
-                <div class="code-name">&amp;#xe7bd;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe6b3;</span>
 
-                <div class="name">divider</div>
 
-                <div class="code-name">&amp;#xe6b3;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe642;</span>
 
-                <div class="name">按钮</div>
 
-                <div class="code-name">&amp;#xe642;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe648;</span>
 
-                <div class="name">按钮</div>
 
-                <div class="code-name">&amp;#xe648;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe705;</span>
 
-                <div class="name">按钮</div>
 
-                <div class="code-name">&amp;#xe705;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe602;</span>
 
-                <div class="name">加号</div>
 
-                <div class="code-name">&amp;#xe602;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe600;</span>
 
-                <div class="name">workbench_personal center_secondary password</div>
 
-                <div class="code-name">&amp;#xe600;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe822;</span>
 
-                <div class="name">lock</div>
 
-                <div class="code-name">&amp;#xe822;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe622;</span>
 
-                <div class="name">HTML</div>
 
-                <div class="code-name">&amp;#xe622;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe61a;</span>
 
-                <div class="name">时间</div>
 
-                <div class="code-name">&amp;#xe61a;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe60f;</span>
 
-                <div class="name">chart-area</div>
 
-                <div class="code-name">&amp;#xe60f;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe601;</span>
 
-                <div class="name">时间范围</div>
 
-                <div class="code-name">&amp;#xe601;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe629;</span>
 
-                <div class="name">多选项</div>
 
-                <div class="code-name">&amp;#xe629;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe7b2;</span>
 
-                <div class="name">日期</div>
 
-                <div class="code-name">&amp;#xe7b2;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe7fe;</span>
 
-                <div class="name">编辑器</div>
 
-                <div class="code-name">&amp;#xe7fe;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe620;</span>
 
-                <div class="name">滑块</div>
 
-                <div class="code-name">&amp;#xe620;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe802;</span>
 
-                <div class="name">表格</div>
 
-                <div class="code-name">&amp;#xe802;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe7dc;</span>
 
-                <div class="name">stream list</div>
 
-                <div class="code-name">&amp;#xe7dc;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe619;</span>
 
-                <div class="name">input</div>
 
-                <div class="code-name">&amp;#xe619;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe62f;</span>
 
-                <div class="name">开关 关</div>
 
-                <div class="code-name">&amp;#xe62f;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe829;</span>
 
-                <div class="name">评分</div>
 
-                <div class="code-name">&amp;#xe829;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe624;</span>
 
-                <div class="name">附 件</div>
 
-                <div class="code-name">&amp;#xe624;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe621;</span>
 
-                <div class="name">html</div>
 
-                <div class="code-name">&amp;#xe621;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe614;</span>
 
-                <div class="name">编辑器</div>
 
-                <div class="code-name">&amp;#xe614;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe603;</span>
 
-                <div class="name">textarea</div>
 
-                <div class="code-name">&amp;#xe603;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe604;</span>
 
-                <div class="name">定位</div>
 
-                <div class="code-name">&amp;#xe604;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe69d;</span>
 
-                <div class="name">栅格</div>
 
-                <div class="code-name">&amp;#xe69d;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe73e;</span>
 
-                <div class="name">分割线</div>
 
-                <div class="code-name">&amp;#xe73e;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe73b;</span>
 
-                <div class="name">日期范围</div>
 
-                <div class="code-name">&amp;#xe73b;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe63c;</span>
 
-                <div class="name">下 拉</div>
 
-                <div class="code-name">&amp;#xe63c;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe605;</span>
 
-                <div class="name">单选</div>
 
-                <div class="code-name">&amp;#xe605;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe606;</span>
 
-                <div class="name">chart-line</div>
 
-                <div class="code-name">&amp;#xe606;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe6a7;</span>
 
-                <div class="name">计数器</div>
 
-                <div class="code-name">&amp;#xe6a7;</div>
 
-              </li>
 
-          
-            <li class="dib">
 
-              <span class="icon iconfont">&#xe6b4;</span>
 
-                <div class="name">tab</div>
 
-                <div class="code-name">&amp;#xe6b4;</div>
 
-              </li>
 
-          
-          </ul>
 
-          <div class="article markdown">
 
-          <h2 id="unicode-">Unicode 引用</h2>
 
-          <hr>
 
-
 
-          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
 
-          <ul>
 
-            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
 
-            <li>默认情况下不支持多色，直接添加多色图标会自动去色。</li>
 
-          </ul>
 
-          <blockquote>
 
-            <p>注意：新版 iconfont 支持两种方式引用多色图标：SVG symbol 引用方式和彩色字体图标模式。（使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。）</p>
 
-          </blockquote>
 
-          <p>Unicode 使用步骤如下：</p>
 
-          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
 
-<pre><code class="language-css"
 
->@font-face {
 
-  font-family: 'iconfont';
 
-  src: url('iconfont.woff2?t=1677832299229') format('woff2'),
 
-       url('iconfont.woff?t=1677832299229') format('woff'),
 
-       url('iconfont.ttf?t=1677832299229') format('truetype');
 
-}
 
-</code></pre>
 
-          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
 
-<pre><code class="language-css"
 
->.iconfont {
 
-  font-family: "iconfont" !important;
 
-  font-size: 16px;
 
-  font-style: normal;
 
-  -webkit-font-smoothing: antialiased;
 
-  -moz-osx-font-smoothing: grayscale;
 
-}
 
-</code></pre>
 
-          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
 
-<pre>
 
-<code class="language-html"
 
->&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
 
-</code></pre>
 
-          <blockquote>
 
-            <p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
 
-          </blockquote>
 
-          </div>
 
-      </div>
 
-      <div class="content font-class">
 
-        <ul class="icon_lists dib-box">
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-shanchulie"></span>
 
-            <div class="name">
 
-              删除列
 
-            </div>
 
-            <div class="code-name">.icon-shanchulie
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-shanchuhang"></span>
 
-            <div class="name">
 
-              删除行
 
-            </div>
 
-            <div class="code-name">.icon-shanchuhang
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-table_layout"></span>
 
-            <div class="name">
 
-              table
 
-            </div>
 
-            <div class="code-name">.icon-table_layout
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-chaifenhang"></span>
 
-            <div class="name">
 
-              拆分行
 
-            </div>
 
-            <div class="code-name">.icon-chaifenhang
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-chaifenlie"></span>
 
-            <div class="name">
 
-              拆分列
 
-            </div>
 
-            <div class="code-name">.icon-chaifenlie
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-chaifen"></span>
 
-            <div class="name">
 
-              拆分
 
-            </div>
 
-            <div class="code-name">.icon-chaifen
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-zhuijiahang"></span>
 
-            <div class="name">
 
-              行追加
 
-            </div>
 
-            <div class="code-name">.icon-zhuijiahang
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-zhuijialie"></span>
 
-            <div class="name">
 
-              列追加
 
-            </div>
 
-            <div class="code-name">.icon-zhuijialie
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-charuhang"></span>
 
-            <div class="name">
 
-              插入行
 
-            </div>
 
-            <div class="code-name">.icon-charuhang
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-charulie"></span>
 
-            <div class="name">
 
-              插入列
 
-            </div>
 
-            <div class="code-name">.icon-charulie
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-shangxiahebing"></span>
 
-            <div class="name">
 
-              上下合并
 
-            </div>
 
-            <div class="code-name">.icon-shangxiahebing
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-zuoyouhebing"></span>
 
-            <div class="name">
 
-              左右合并
 
-            </div>
 
-            <div class="code-name">.icon-zuoyouhebing
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-treeselect"></span>
 
-            <div class="name">
 
-              treeselect
 
-            </div>
 
-            <div class="code-name">.icon-treeselect
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-barcode2"></span>
 
-            <div class="name">
 
-              Barcode
 
-            </div>
 
-            <div class="code-name">.icon-barcode2
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-barcode"></span>
 
-            <div class="name">
 
-              bar-code
 
-            </div>
 
-            <div class="code-name">.icon-barcode
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-dialog"></span>
 
-            <div class="name">
 
-              Dialog
 
-            </div>
 
-            <div class="code-name">.icon-dialog
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-address"></span>
 
-            <div class="name">
 
-              Organization Chart
 
-            </div>
 
-            <div class="code-name">.icon-address
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-cascader"></span>
 
-            <div class="name">
 
-              级联
 
-            </div>
 
-            <div class="code-name">.icon-cascader
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-colorpicker"></span>
 
-            <div class="name">
 
-              Color picker
 
-            </div>
 
-            <div class="code-name">.icon-colorpicker
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-shengshiqu"></span>
 
-            <div class="name">
 
-              省市区
 
-            </div>
 
-            <div class="code-name">.icon-shengshiqu
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-text"></span>
 
-            <div class="name">
 
-              文本
 
-            </div>
 
-            <div class="code-name">.icon-text
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-link"></span>
 
-            <div class="name">
 
-              link
 
-            </div>
 
-            <div class="code-name">.icon-link
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-alert"></span>
 
-            <div class="name">
 
-              警告
 
-            </div>
 
-            <div class="code-name">.icon-alert
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-alert1"></span>
 
-            <div class="name">
 
-              alert
 
-            </div>
 
-            <div class="code-name">.icon-alert1
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-gitee"></span>
 
-            <div class="name">
 
-              gitee
 
-            </div>
 
-            <div class="code-name">.icon-gitee
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-github"></span>
 
-            <div class="name">
 
-              Logo GitHub
 
-            </div>
 
-            <div class="code-name">.icon-github
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icondialog"></span>
 
-            <div class="name">
 
-              dialog
 
-            </div>
 
-            <div class="code-name">.icondialog
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon_map"></span>
 
-            <div class="name">
 
-              地图
 
-            </div>
 
-            <div class="code-name">.icon_map
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont iconbianjiqi"></span>
 
-            <div class="name">
 
-              编辑器
 
-            </div>
 
-            <div class="code-name">.iconbianjiqi
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icondivider"></span>
 
-            <div class="name">
 
-              divider
 
-            </div>
 
-            <div class="code-name">.icondivider
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont iconanniu"></span>
 
-            <div class="name">
 
-              按钮
 
-            </div>
 
-            <div class="code-name">.iconanniu
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-button"></span>
 
-            <div class="name">
 
-              按钮
 
-            </div>
 
-            <div class="code-name">.icon-button
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-button1"></span>
 
-            <div class="name">
 
-              按钮
 
-            </div>
 
-            <div class="code-name">.icon-button1
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont iconadd"></span>
 
-            <div class="name">
 
-              加号
 
-            </div>
 
-            <div class="code-name">.iconadd
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-password"></span>
 
-            <div class="name">
 
-              workbench_personal center_secondary password
 
-            </div>
 
-            <div class="code-name">.icon-password
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-lock"></span>
 
-            <div class="name">
 
-              lock
 
-            </div>
 
-            <div class="code-name">.icon-lock
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-html"></span>
 
-            <div class="name">
 
-              HTML
 
-            </div>
 
-            <div class="code-name">.icon-html
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-time"></span>
 
-            <div class="name">
 
-              时间
 
-            </div>
 
-            <div class="code-name">.icon-time
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-chart1"></span>
 
-            <div class="name">
 
-              chart-area
 
-            </div>
 
-            <div class="code-name">.icon-chart1
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-timerange"></span>
 
-            <div class="name">
 
-              时间范围
 
-            </div>
 
-            <div class="code-name">.icon-timerange
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-checkbox"></span>
 
-            <div class="name">
 
-              多选项
 
-            </div>
 
-            <div class="code-name">.icon-checkbox
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-date"></span>
 
-            <div class="name">
 
-              日期
 
-            </div>
 
-            <div class="code-name">.icon-date
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-setting"></span>
 
-            <div class="name">
 
-              编辑器
 
-            </div>
 
-            <div class="code-name">.icon-setting
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-slider"></span>
 
-            <div class="name">
 
-              滑块
 
-            </div>
 
-            <div class="code-name">.icon-slider
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-table"></span>
 
-            <div class="name">
 
-              表格
 
-            </div>
 
-            <div class="code-name">.icon-table
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-list"></span>
 
-            <div class="name">
 
-              stream list
 
-            </div>
 
-            <div class="code-name">.icon-list
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-input"></span>
 
-            <div class="name">
 
-              input
 
-            </div>
 
-            <div class="code-name">.icon-input
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-switch"></span>
 
-            <div class="name">
 
-              开关 关
 
-            </div>
 
-            <div class="code-name">.icon-switch
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-rate"></span>
 
-            <div class="name">
 
-              评分
 
-            </div>
 
-            <div class="code-name">.icon-rate
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-att"></span>
 
-            <div class="name">
 
-              附 件
 
-            </div>
 
-            <div class="code-name">.icon-att
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-doc"></span>
 
-            <div class="name">
 
-              html
 
-            </div>
 
-            <div class="code-name">.icon-doc
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-editor"></span>
 
-            <div class="name">
 
-              编辑器
 
-            </div>
 
-            <div class="code-name">.icon-editor
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-textarea"></span>
 
-            <div class="name">
 
-              textarea
 
-            </div>
 
-            <div class="code-name">.icon-textarea
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-location"></span>
 
-            <div class="name">
 
-              定位
 
-            </div>
 
-            <div class="code-name">.icon-location
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-col"></span>
 
-            <div class="name">
 
-              栅格
 
-            </div>
 
-            <div class="code-name">.icon-col
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-divider"></span>
 
-            <div class="name">
 
-              分割线
 
-            </div>
 
-            <div class="code-name">.icon-divider
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-daterange"></span>
 
-            <div class="name">
 
-              日期范围
 
-            </div>
 
-            <div class="code-name">.icon-daterange
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-select"></span>
 
-            <div class="name">
 
-              下 拉
 
-            </div>
 
-            <div class="code-name">.icon-select
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-radio"></span>
 
-            <div class="name">
 
-              单选
 
-            </div>
 
-            <div class="code-name">.icon-radio
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-chart"></span>
 
-            <div class="name">
 
-              chart-line
 
-            </div>
 
-            <div class="code-name">.icon-chart
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-inputNumber"></span>
 
-            <div class="name">
 
-              计数器
 
-            </div>
 
-            <div class="code-name">.icon-inputNumber
 
-            </div>
 
-          </li>
 
-          
-          <li class="dib">
 
-            <span class="icon iconfont icon-tab"></span>
 
-            <div class="name">
 
-              tab
 
-            </div>
 
-            <div class="code-name">.icon-tab
 
-            </div>
 
-          </li>
 
-          
-        </ul>
 
-        <div class="article markdown">
 
-        <h2 id="font-class-">font-class 引用</h2>
 
-        <hr>
 
-
 
-        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
 
-        <p>与 Unicode 使用方式相比，具有如下特点：</p>
 
-        <ul>
 
-          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
 
-          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
 
-        </ul>
 
-        <p>使用步骤如下：</p>
 
-        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
 
-<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
 
-</code></pre>
 
-        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
 
-<pre><code class="language-html">&lt;span class="iconfont iconxxx"&gt;&lt;/span&gt;
 
-</code></pre>
 
-        <blockquote>
 
-          <p>"
 
-            iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
 
-        </blockquote>
 
-      </div>
 
-      </div>
 
-      <div class="content symbol">
 
-          <ul class="icon_lists dib-box">
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-shanchulie"></use>
 
-                </svg>
 
-                <div class="name">删除列</div>
 
-                <div class="code-name">#icon-shanchulie</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-shanchuhang"></use>
 
-                </svg>
 
-                <div class="name">删除行</div>
 
-                <div class="code-name">#icon-shanchuhang</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-table_layout"></use>
 
-                </svg>
 
-                <div class="name">table</div>
 
-                <div class="code-name">#icon-table_layout</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-chaifenhang"></use>
 
-                </svg>
 
-                <div class="name">拆分行</div>
 
-                <div class="code-name">#icon-chaifenhang</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-chaifenlie"></use>
 
-                </svg>
 
-                <div class="name">拆分列</div>
 
-                <div class="code-name">#icon-chaifenlie</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-chaifen"></use>
 
-                </svg>
 
-                <div class="name">拆分</div>
 
-                <div class="code-name">#icon-chaifen</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-zhuijiahang"></use>
 
-                </svg>
 
-                <div class="name">行追加</div>
 
-                <div class="code-name">#icon-zhuijiahang</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-zhuijialie"></use>
 
-                </svg>
 
-                <div class="name">列追加</div>
 
-                <div class="code-name">#icon-zhuijialie</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-charuhang"></use>
 
-                </svg>
 
-                <div class="name">插入行</div>
 
-                <div class="code-name">#icon-charuhang</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-charulie"></use>
 
-                </svg>
 
-                <div class="name">插入列</div>
 
-                <div class="code-name">#icon-charulie</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-shangxiahebing"></use>
 
-                </svg>
 
-                <div class="name">上下合并</div>
 
-                <div class="code-name">#icon-shangxiahebing</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-zuoyouhebing"></use>
 
-                </svg>
 
-                <div class="name">左右合并</div>
 
-                <div class="code-name">#icon-zuoyouhebing</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-treeselect"></use>
 
-                </svg>
 
-                <div class="name">treeselect</div>
 
-                <div class="code-name">#icon-treeselect</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-barcode2"></use>
 
-                </svg>
 
-                <div class="name">Barcode</div>
 
-                <div class="code-name">#icon-barcode2</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-barcode"></use>
 
-                </svg>
 
-                <div class="name">bar-code</div>
 
-                <div class="code-name">#icon-barcode</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-dialog"></use>
 
-                </svg>
 
-                <div class="name">Dialog</div>
 
-                <div class="code-name">#icon-dialog</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-address"></use>
 
-                </svg>
 
-                <div class="name">Organization Chart</div>
 
-                <div class="code-name">#icon-address</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-cascader"></use>
 
-                </svg>
 
-                <div class="name">级联</div>
 
-                <div class="code-name">#icon-cascader</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-colorpicker"></use>
 
-                </svg>
 
-                <div class="name">Color picker</div>
 
-                <div class="code-name">#icon-colorpicker</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-shengshiqu"></use>
 
-                </svg>
 
-                <div class="name">省市区</div>
 
-                <div class="code-name">#icon-shengshiqu</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-text"></use>
 
-                </svg>
 
-                <div class="name">文本</div>
 
-                <div class="code-name">#icon-text</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-link"></use>
 
-                </svg>
 
-                <div class="name">link</div>
 
-                <div class="code-name">#icon-link</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-alert"></use>
 
-                </svg>
 
-                <div class="name">警告</div>
 
-                <div class="code-name">#icon-alert</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-alert1"></use>
 
-                </svg>
 
-                <div class="name">alert</div>
 
-                <div class="code-name">#icon-alert1</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-gitee"></use>
 
-                </svg>
 
-                <div class="name">gitee</div>
 
-                <div class="code-name">#icon-gitee</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-github"></use>
 
-                </svg>
 
-                <div class="name">Logo GitHub</div>
 
-                <div class="code-name">#icon-github</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icondialog"></use>
 
-                </svg>
 
-                <div class="name">dialog</div>
 
-                <div class="code-name">#icondialog</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon_map"></use>
 
-                </svg>
 
-                <div class="name">地图</div>
 
-                <div class="code-name">#icon_map</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#iconbianjiqi"></use>
 
-                </svg>
 
-                <div class="name">编辑器</div>
 
-                <div class="code-name">#iconbianjiqi</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icondivider"></use>
 
-                </svg>
 
-                <div class="name">divider</div>
 
-                <div class="code-name">#icondivider</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#iconanniu"></use>
 
-                </svg>
 
-                <div class="name">按钮</div>
 
-                <div class="code-name">#iconanniu</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-button"></use>
 
-                </svg>
 
-                <div class="name">按钮</div>
 
-                <div class="code-name">#icon-button</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-button1"></use>
 
-                </svg>
 
-                <div class="name">按钮</div>
 
-                <div class="code-name">#icon-button1</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#iconadd"></use>
 
-                </svg>
 
-                <div class="name">加号</div>
 
-                <div class="code-name">#iconadd</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-password"></use>
 
-                </svg>
 
-                <div class="name">workbench_personal center_secondary password</div>
 
-                <div class="code-name">#icon-password</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-lock"></use>
 
-                </svg>
 
-                <div class="name">lock</div>
 
-                <div class="code-name">#icon-lock</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-html"></use>
 
-                </svg>
 
-                <div class="name">HTML</div>
 
-                <div class="code-name">#icon-html</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-time"></use>
 
-                </svg>
 
-                <div class="name">时间</div>
 
-                <div class="code-name">#icon-time</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-chart1"></use>
 
-                </svg>
 
-                <div class="name">chart-area</div>
 
-                <div class="code-name">#icon-chart1</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-timerange"></use>
 
-                </svg>
 
-                <div class="name">时间范围</div>
 
-                <div class="code-name">#icon-timerange</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-checkbox"></use>
 
-                </svg>
 
-                <div class="name">多选项</div>
 
-                <div class="code-name">#icon-checkbox</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-date"></use>
 
-                </svg>
 
-                <div class="name">日期</div>
 
-                <div class="code-name">#icon-date</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-setting"></use>
 
-                </svg>
 
-                <div class="name">编辑器</div>
 
-                <div class="code-name">#icon-setting</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-slider"></use>
 
-                </svg>
 
-                <div class="name">滑块</div>
 
-                <div class="code-name">#icon-slider</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-table"></use>
 
-                </svg>
 
-                <div class="name">表格</div>
 
-                <div class="code-name">#icon-table</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-list"></use>
 
-                </svg>
 
-                <div class="name">stream list</div>
 
-                <div class="code-name">#icon-list</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-input"></use>
 
-                </svg>
 
-                <div class="name">input</div>
 
-                <div class="code-name">#icon-input</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-switch"></use>
 
-                </svg>
 
-                <div class="name">开关 关</div>
 
-                <div class="code-name">#icon-switch</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-rate"></use>
 
-                </svg>
 
-                <div class="name">评分</div>
 
-                <div class="code-name">#icon-rate</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-att"></use>
 
-                </svg>
 
-                <div class="name">附 件</div>
 
-                <div class="code-name">#icon-att</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-doc"></use>
 
-                </svg>
 
-                <div class="name">html</div>
 
-                <div class="code-name">#icon-doc</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-editor"></use>
 
-                </svg>
 
-                <div class="name">编辑器</div>
 
-                <div class="code-name">#icon-editor</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-textarea"></use>
 
-                </svg>
 
-                <div class="name">textarea</div>
 
-                <div class="code-name">#icon-textarea</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-location"></use>
 
-                </svg>
 
-                <div class="name">定位</div>
 
-                <div class="code-name">#icon-location</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-col"></use>
 
-                </svg>
 
-                <div class="name">栅格</div>
 
-                <div class="code-name">#icon-col</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-divider"></use>
 
-                </svg>
 
-                <div class="name">分割线</div>
 
-                <div class="code-name">#icon-divider</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-daterange"></use>
 
-                </svg>
 
-                <div class="name">日期范围</div>
 
-                <div class="code-name">#icon-daterange</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-select"></use>
 
-                </svg>
 
-                <div class="name">下 拉</div>
 
-                <div class="code-name">#icon-select</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-radio"></use>
 
-                </svg>
 
-                <div class="name">单选</div>
 
-                <div class="code-name">#icon-radio</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-chart"></use>
 
-                </svg>
 
-                <div class="name">chart-line</div>
 
-                <div class="code-name">#icon-chart</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-inputNumber"></use>
 
-                </svg>
 
-                <div class="name">计数器</div>
 
-                <div class="code-name">#icon-inputNumber</div>
 
-            </li>
 
-          
-            <li class="dib">
 
-                <svg class="icon svg-icon" aria-hidden="true">
 
-                  <use xlink:href="#icon-tab"></use>
 
-                </svg>
 
-                <div class="name">tab</div>
 
-                <div class="code-name">#icon-tab</div>
 
-            </li>
 
-          
-          </ul>
 
-          <div class="article markdown">
 
-          <h2 id="symbol-">Symbol 引用</h2>
 
-          <hr>
 
-
 
-          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
 
-            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
 
-          <ul>
 
-            <li>支持多色图标了，不再受单色限制。</li>
 
-            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
 
-            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
 
-            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
 
-          </ul>
 
-          <p>使用步骤如下：</p>
 
-          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
 
-<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
 
-</code></pre>
 
-          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
 
-<pre><code class="language-html">&lt;style&gt;
 
-.icon {
 
-  width: 1em;
 
-  height: 1em;
 
-  vertical-align: -0.15em;
 
-  fill: currentColor;
 
-  overflow: hidden;
 
-}
 
-&lt;/style&gt;
 
-</code></pre>
 
-          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
 
-<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
 
-  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
 
-&lt;/svg&gt;
 
-</code></pre>
 
-          </div>
 
-      </div>
 
-
 
-    </div>
 
-  </div>
 
-  <script>
 
-  $(document).ready(function () {
 
-      $('.tab-container .content:first').show()
 
-
 
-      $('#tabs li').click(function (e) {
 
-        var tabContent = $('.tab-container .content')
 
-        var index = $(this).index()
 
-
 
-        if ($(this).hasClass('active')) {
 
-          return
 
-        } else {
 
-          $('#tabs li').removeClass('active')
 
-          $(this).addClass('active')
 
-
 
-          tabContent.hide().eq(index).fadeIn()
 
-        }
 
-      })
 
-    })
 
-  </script>
 
-</body>
 
-</html>

BIN
src/assets/images/login-background.jpg
Файл харах


BIN
src/assets/images/login-background.png
Файл харах


BIN
src/assets/images/login-bg-img.png
Файл харах


BIN
src/assets/login/from_left.png
Файл харах


BIN
src/assets/login/from_right.png
Файл харах


BIN
src/assets/login/from_title.png
Файл харах


+ 18 - 8
src/store/modules/user.js
Файл харах 

@@ -1,4 +1,4 @@
 
-import { login, logout, getInfo } from '@/api/login'
 
+import { login, logout, getInfo,loginCode } from '@/api/login'
 
 import { getToken, setToken, removeToken } from '@/utils/auth'
 
 
 const user = {
 
@@ -36,13 +36,23 @@ const user = {
 
       const code = userInfo.code
 
       const uuid = userInfo.uuid
 
       return new Promise((resolve, reject) => {
 
-        login(username, password, code, uuid).then(res => {
 
-          setToken(res.data.access_token)
 
-          commit('SET_TOKEN', res.data.access_token)
 
-          resolve()
 
-        }).catch(error => {
 
-          reject(error)
 
-        })
 
+        if(userInfo.loginType == 1){ // 密码登录
 
+          login(username, password, code, uuid).then(res => {
 
+            setToken(res.data.access_token)
 
+            commit('SET_TOKEN', res.data.access_token)
 
+            resolve()
 
+          }).catch(error => {
 
+            reject(error)
 
+          })
 
+        }else { // 验证码登录
 
+          loginCode(username,  code).then(res => {
 
+            setToken(res.data.access_token)
 
+            commit('SET_TOKEN', res.data.access_token)
 
+            resolve()
 
+          }).catch(error => {
 
+            reject(error)
 
+          })
 
+        }
 
       })
 
     },

+ 315 - 78
src/views/login.vue
Файл харах 

@@ -1,68 +1,134 @@
 
 <template>
 
   <div class="login" :class="processClass">
 
-    <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
 
-      <h3 class="title"> {{loginTitle}}</h3>
 
-      <el-form-item prop="username">
 
-        <el-input
 
-          v-model="loginForm.username"
 
-          type="text"
 
-          auto-complete="off"
 
-          placeholder="账号"
 
-        >
 
-          <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
 
-        </el-input>
 
-      </el-form-item>
 
-      <el-form-item prop="password">
 
-        <el-input
 
-          v-model="loginForm.password"
 
-          type="password"
 
-          auto-complete="off"
 
-          placeholder="密码"
 
-          @keyup.enter.native="handleLogin"
 
-        >
 
-          <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
 
-        </el-input>
 
-      </el-form-item>
 
-      <el-form-item prop="code" v-if="captchaEnabled">
 
-        <el-input
 
-          v-model="loginForm.code"
 
-          auto-complete="off"
 
-          placeholder="验证码"
 
-          style="width: 63%"
 
-          @keyup.enter.native="handleLogin"
 
-        >
 
-          <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
 
-        </el-input>
 
-        <div class="login-code">
 
-          <img :src="codeUrl" @click="getCode" class="login-code-img"/>
 
+    <div class="login-box">
 
+      <div class="login-from-bgm">
 
+        <img :src="require('@/assets/login/from_left.png')" alt="">
 
+      </div>
 
+      <div class="login-from-box">
 
+        <div class="login-from-title">
 
+          <img :src="require('@/assets/login/from_title.png')" alt="">
 
+          <span> {{loginTitle}}</span>
 
         </div>
 
-      </el-form-item>
 
-      <el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>
 
-      <el-form-item style="width:100%;">
 
-        <el-button
 
-          :loading="loading"
 
-          size="medium"
 
-          type="primary"
 
-          style="width:100%;"
 
-          @click.native.prevent="handleLogin"
 
-        >
 
-          <span v-if="!loading">登 录</span>
 
-          <span v-else>登 录 中...</span>
 
-        </el-button>
 
-        <div style="float: right;" v-if="register">
 
-          <router-link class="link-type" :to="'/register'">立即注册</router-link>
 
-        </div>
 
-      </el-form-item>
 
-    </el-form>
 
+        
+        <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
 
+          <div class="login-from-tab">
 
+            <div 
+            v-for="(item,index) in loginTypeList"
 
+            :key="index"
 
+            @click="setLoginType(item)"
 
+            :class="[ item.type == loginForm.loginType ? 'login-from-tab-action' : '' ]"
 
+            >
 
+              <span>{{ item.name }}</span>
 
+              <span></span>
 
+            </div>
 
+          </div>
 
+          <!--  账号登录  -->
 
+          <div style="min-height: calc( 100% - 200px );width: 100%;" v-if="loginForm.loginType == 1">
 
+            <el-form-item prop="username">
 
+              <el-input
 
+                v-model="loginForm.username"
 
+                type="text"
 
+                auto-complete="off"
 
+                placeholder="账号"
 
+              >
 
+                <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
 
+              </el-input>
 
+            </el-form-item>
 
+            <el-form-item prop="password">
 
+              <el-input
 
+                v-model="loginForm.password"
 
+                type="password"
 
+                auto-complete="off"
 
+                placeholder="密码"
 
+                @keyup.enter.native="handleLogin"
 
+              >
 
+                <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon" />
 
+              </el-input>
 
+            </el-form-item>
 
+            <el-form-item prop="code" v-if="captchaEnabled">
 
+              <el-input
 
+                v-model="loginForm.code"
 
+                auto-complete="off"
 
+                placeholder="验证码"
 
+                style="width: 63%"
 
+                @keyup.enter.native="handleLogin"
 
+              >
 
+                <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
 
+              </el-input>
 
+              <div class="login-code">
 
+                <img :src="codeUrl" @click="getCode" class="login-code-img"/>
 
+              </div>
 
+            </el-form-item>
 
+            <el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>
 
+          </div>
 
+          <!--  验证码登录  -->
 
+          <div style="min-height: calc( 100% - 200px );width: 100%;" v-if="loginForm.loginType == 2">
 
+            <el-form-item prop="phone">
 
+              <el-input
 
+                v-model="loginForm.phone"
 
+                type="text"
 
+                auto-complete="off"
 
+                placeholder="手机号"
 
+                @keyup.enter.native="getCode()"
 
+              >
 
+                <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon" />
 
+              </el-input>
 
+            </el-form-item>
 
+            <el-form-item prop="code" v-if="captchaEnabled">
 
+              <el-input
 
+                v-model="loginForm.code"
 
+                auto-complete="off"
 
+                placeholder="验证码"
 
+                style="width: 63%"
 
+                @keyup.enter.native="handleLogin"
 
+              >
 
+                <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon" />
 
+              </el-input>
 
+              <div class="login-code">
 
+                <el-button
 
+                  :loading="codeLoading"
 
+                  size="medium"
 
+                  type="primary"
 
+                  style="width:100%;background: linear-gradient( 90deg, #34F8F3 0%, #1AA0F2 100%);"
 
+                  @click="getCode"
 
+                  round
 
+                >
 
+                  <span v-if="!codeLoading && !codeType">获取验证码</span>
 
+                  <span v-if="!codeLoading && codeType == 2">重新获取</span>
 
+                  <span v-if="codeLoading">重新获取</span>
 
+                  <span v-if="!codeLoading && codeType == 1">{{ codeEffectiveTime }}s后重新获取</span>
 
+                </el-button>
 
+              </div>
 
+            </el-form-item>
 
+          </div> 
+          <el-form-item style="width:100%;">
 
+              <el-button
 
+                :loading="loading"
 
+                size="medium"
 
+                type="primary"
 
+                style="width:100%;background: linear-gradient( 90deg, #34F8F3 0%, #1AA0F2 100%);"
 
+                @click.native.prevent="handleLogin"
 
+                round
 
+              >
 
+                <span v-if="!loading">登 录</span>
 
+                <span v-else>登 录 中...</span>
 
+              </el-button>
 
+              <div style="float: right;" v-if="register">
 
+                <router-link class="link-type" :to="'/register'">立即注册</router-link>
 
+              </div>
 
+            </el-form-item>
 
+        </el-form>
 
+      </div>
 
+    </div>
 
     <!--  底部  -->
 
     <div class="el-login-footer">
 
-      <span>Copyright © 2018-2023 ruoyi.vip All Rights Reserved.</span>
 
+      <span>Copyright © 2018-2023 达泽科技 All Rights Reserved.</span>
 
     </div>
 
   </div>
 
 </template>
 
 
 <script>
 
-import { getCodeImg } from "@/api/login";
 
+import { getCodeImg,getCodeNum } from "@/api/login";
 
 import Cookies from "js-cookie";
 
 import { encrypt, decrypt } from '@/utils/jsencrypt'
 
 
@@ -77,12 +143,19 @@ export default {
 
         password: "admin123",
 
         rememberMe: false,
 
         code: "",
 
-        uuid: ""
 
+        uuid: "",
 
+
 
+        loginType: 1,
 
+        phone: null,
 
       },
 
       loginRules: {
 
         username: [
 
           { required: true, trigger: ["change","blur"], message: "请输入您的账号" }
 
         ],
 
+        phone: [
 
+          { required: true, trigger: ["change","blur"], message: "请输入您的账号" },
 
+          { pattern: /^1[3-9]\d{9}$/, message: '手机号格式不正确', trigger: ["change","blur"] }
 
+        ],
 
         password: [
 
           { required: true, trigger: ["change","blur"], message: "请输入您的密码" }
 
         ],
 
@@ -94,7 +167,17 @@ export default {
 
       // 注册开关
 
       register: false,
 
       redirect: undefined,
 
-      processClass: ''
 
+      processClass: '',
 
+
 
+      // 登录类型
 
+      loginTypeList: [
 
+        { name: '密码登录', type: 1 },
 
+        { name: '验证码登录', type: 2 },
 
+      ],
 
+      codeLoading: false,// 加载获取验证码
 
+      codeTime: false, // 验证码失效时间
 
+      codeType: null, // 获取验证码是否成功的标识 0: 失败  1： 成功
 
+      codeEffectiveTime: 60,
 
     };
 
   },
 
   watch: {
 
@@ -123,15 +206,50 @@ export default {
 
   },
 
   methods: {
 
     getCode() {
 
-      getCodeImg().then(res => {
 
-        // this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled;
 
-        // if (this.captchaEnabled) {
 
-        //   this.codeUrl =  res.data.captchaImage;
 
-        //   this.loginForm.uuid = res.data.captchaKey;
 
-        // }
 
-        this.codeUrl =  res.data.captchaImage;
 
-        this.loginForm.uuid = res.data.captchaKey;
 
-      });
 
+      if(this.loginForm.loginType == 1) { // 密码登录
 
+        getCodeImg().then(res => {
 
+          this.codeUrl =  res.data.captchaImage;
 
+          this.loginForm.uuid = res.data.captchaKey;
 
+        }).catch(()=> {
 
+          this.codeUrl =  null;
 
+          this.loginForm.uuid = null;
 
+        })
 
+      }else if(this.loginForm.loginType == 2) { // 验证码登录
 
+        // 定义手机号格式的正则表达式
 
+        var regExp = /^1[3456789]\d{9}$/;
 
+        if( this.codeType == 1 || !regExp.test(this.loginForm.phone)) {
 
+          if(!regExp.test(this.loginForm.phone)) {
 
+            this.$refs.loginForm.validateField(['phone'])
 
+          }
 
+          return
 
+        }
 
+        if(this.codeLoading || this.codeEffectiveTime != 60 || this.codeType == 1) return
 
+        this.codeEffectiveTime = 60
 
+
 
+        if( this.codeTime ) {
 
+          clearInterval(this.codeTime)
 
+        }
 
+        this.codeLoading = true
 
+        getCodeNum({
 
+          "mobile": this.loginForm.phone
 
+        }).then(res => {
 
+          this.codeType = 1
 
+          this.codeLoading = false
 
+          this.codeEffectiveTime = 60
 
+          this.codeTime = setInterval(()=>{
 
+            this.codeEffectiveTime = this.codeEffectiveTime - 1
 
+            if( this.codeEffectiveTime <= 0 ) {
 
+              this.codeType = null
 
+              clearInterval(this.codeTime)
 
+              this.codeEffectiveTime = 60
 
+            }
 
+          },1000)
 
+        }).catch(()=> {
 
+          this.codeType = 2
 
+          this.codeLoading = false
 
+        })
 
+      }
 
+      
     },
 
     getCookie() {
 
       const username = Cookies.get("username");
 
@@ -140,23 +258,29 @@ export default {
 
       this.loginForm = {
 
         username: username === undefined ? this.loginForm.username : username,
 
         password: password === undefined ? this.loginForm.password : decrypt(password),
 
-        rememberMe: rememberMe === undefined ? false : Boolean(rememberMe)
 
+        rememberMe: rememberMe === undefined ? false : Boolean(rememberMe),
 
+        loginType: 1,
 
       };
 
     },
 
     handleLogin() {
 
       this.$refs.loginForm.validate(valid => {
 
         if (valid) {
 
           this.loading = true;
 
-          if (this.loginForm.rememberMe) {
 
-            Cookies.set("username", this.loginForm.username, { expires: 30 });
 
-            Cookies.set("password", encrypt(this.loginForm.password), { expires: 30 });
 
-            Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 });
 
-          } else {
 
-            Cookies.remove("username");
 
-            Cookies.remove("password");
 
-            Cookies.remove('rememberMe');
 
+          if(this.loginForm.loginType == 1){
 
+            if (this.loginForm.rememberMe) {
 
+              Cookies.set("username", this.loginForm.username, { expires: 30 });
 
+              Cookies.set("password", encrypt(this.loginForm.password), { expires: 30 });
 
+              Cookies.set('rememberMe', this.loginForm.rememberMe, { expires: 30 });
 
+            } else {
 
+              Cookies.remove("username");
 
+              Cookies.remove("password");
 
+              Cookies.remove('rememberMe');
 
+            }
 
           }
 
           this.$store.dispatch("Login", this.loginForm).then(() => {
 
+            if( this.codeTime ) {
 
+              clearInterval(this.codeTime)
 
+            }
 
             this.$router.push({ path: this.redirect || "/" }).catch(()=>{});
 
           }).catch(() => {
 
             this.loading = false;
 
@@ -166,6 +290,14 @@ export default {
 
           });
 
         }
 
       });
 
+    },
 
+    /**  选择登录方式  */
 
+    setLoginType(item) {
 
+      this.$set( this.loginForm, 'loginType', item.type)
 
+      this.$set( this.loginForm, 'code', null)
 
+      this.$nextTick(()=>{
 
+        this.$refs.loginForm.clearValidate()
 
+      })
 
     }
 
   }
 
 };
 
@@ -179,6 +311,95 @@ export default {
 
   height: 100%;
 
   background-size: cover;
 
 }
 
+
 
+.login-box {
 
+  display: flex;
 
+  height: 602px;
 
+  .login-from-bgm {
 
+    width: 872px;
 
+    height: 100%;
 
+    box-sizing: border-box;
 
+    img {
 
+      width: 100%;
 
+      height: 100%;
 
+    }
 
+  }
 
+  .login-from-box {
 
+    width: 602px;
 
+    height: 100%;
 
+    box-sizing: border-box;
 
+    background-image: url(../assets/login/from_right.png);
 
+    background-size: 100% 100%;
 
+    background-repeat: no-repeat;
 
+    display: flex;
 
+    flex-direction: column;
 
+    .login-from-title {
 
+      display: flex;
 
+      align-items: center;
 
+      padding: 34px 0 0 48px;
 
+      img {
 
+        width: 46px;
 
+        height: 42px;
 
+      }
 
+      span {
 
+        font-family: SourceHanSansCN, SourceHanSansCN;
 
+        font-weight: 500;
 
+        font-size: 30px;
 
+        color: #FFFFFF;
 
+        margin-left: 15px;
 
+      }
 
+    }
 
+
 
+    .login-from-tab {
 
+      width: 100%;
 
+      display: flex;
 
+      padding: 10px 20px 30px;
 
+      >div {
 
+        flex: 1;
 
+        display: flex;
 
+        flex-direction: column;
 
+        align-items: center;
 
+        justify-content: center;
 
+        box-sizing: border-box;
 
+        cursor: pointer;
 
+        >span:first-child {
 
+          color: #fff;
 
+          font-family: SourceHanSansCN, SourceHanSansCN;
 
+          font-weight: 400;
 
+          font-size: 22px;
 
+          color: #FFFFFF;
 
+        }
 
+        >span:last-child {
 
+          color: #fff;
 
+          width: 40px;
 
+          height: 4px;
 
+          margin-top: 5px;
 
+        }
 
+        
+      }
 
+
 
+      >div:first-child {
 
+        padding-right: 20px;
 
+      }
 
+
 
+      >div:last-child {
 
+        padding-left: 20px;
 
+      }
 
+      .login-from-tab-action {
 
+        >span:first-child {
 
+          font-family: SourceHanSansCN, SourceHanSansCN;
 
+          font-weight: bold;
 
+          font-size: 22px;
 
+        }
 
+        >span:last-child {
 
+          background: linear-gradient( 225deg, #FFFFFF 0%, #FFFFFF 100%);
 
+          border-radius: 3px;
 
+        }
 
+      }
 
+    }
 
+  }
 
+}
 
+
 
 .login-prod{
 
   background-image: url("../assets/images/login-bg-img.png") !important;
 
 }
 
@@ -196,10 +417,16 @@ export default {
 
 
 .login-form {
 
   border-radius: 6px;
 
-  background: rgba(255,255,255,0.62);
 
+  //background: rgba(255,255,255,0.62);
 
   backdrop-filter: blur(5px);
 
-  width: 400px;
 
-  padding: 25px 25px 5px 25px;
 
+  width: 100%;
 
+  height: calc( 100% - 100px );
 
+  display: flex;
 
+  flex-direction: column;
 
+  justify-content: center;
 
+  align-items: center;
 
+  padding: 25px 120px 25px;
 
+  box-sizing: border-box;
 
   .el-input {
 
     height: 38px;
 
     input {
 
@@ -211,6 +438,16 @@ export default {
 
     width: 14px;
 
     margin-left: 2px;
 
   }
 
+  .el-input__inner {
 
+    border-radius: 29px;
 
+    border: 1px solid #FFFFFF;
 
+    --color-bgm: 'none';
 
+    background-color: var(--color-bgm);
 
+    color: #fff;
 
+  }
 
+  .el-checkbox__input.is-checked + .el-checkbox__label {
 
+    color: #ffffff;
 
+  } 
 }
 
 .login-tip {
 
   font-size: 13px;

+ 2 - 2
src/views/register.vue
Файл харах 

@@ -61,7 +61,7 @@
 
     </el-form>
 
     <!--  底部  -->
 
     <div class="el-register-footer">
 
-      <span>Copyright © 2018-2024 ruoyi.vip All Rights Reserved.</span>
 
+      <span>Copyright © 2018-2024 达泽科技 All Rights Reserved.</span>
 
     </div>
 
   </div>
 
 </template>
 
@@ -152,7 +152,7 @@ export default {
 
   justify-content: center;
 
   align-items: center;
 
   height: 100%;
 
-  background-image: url("../assets/images/login-background.jpg");
 
+  background-image: url("../assets/images/login-background.png");
 
   background-size: cover;
 
 }
 
 .title {

+ 273 - 0
src/views/tourism/scenicAreaManagement/contentManagement/attractionInfo.vue
Файл харах 

@@ -0,0 +1,273 @@
 
+<template>
 
+    <div class="app-container">
 
+      <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
 
+        <el-form-item label="票务名称">
 
+          <el-input
 
+            v-model="queryParams.goodsName"
 
+            placeholder="请输入票务名称"
 
+            clearable
 
+            style="width: 240px;"
 
+            @keyup.enter.native="handleQuery"
 
+          />
 
+        </el-form-item>
 
+        <el-form-item>
 
+          <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
 
+          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
 
+        </el-form-item>
 
+      </el-form>
 
+  
+      <el-row :gutter="10" class="mb8">
 
+        <el-col :span="1.5">
 
+          <el-button
 
+                type="primary"
 
+                plain
 
+                icon="el-icon-plus"
 
+                size="mini"
 
+                @click="handleAdd"
 
+                v-hasPermi="['ticketMr:ticketMr:add']"
 
+              >新增</el-button>
 
+        </el-col>
 
+        <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
 
+      </el-row>
 
+  
+      <el-table ref="tables" v-loading="loading" :data="dataList" border>
 
+        <el-table-column label="序号" align="center" type="index" width="60"></el-table-column>
 
+        <el-table-column label="票务名称" align="center" prop="goodsName" />
 
+        <el-table-column label="销售价" align="center">
 
+          <template slot-scope="scope">
 
+            <span>￥{{ scope.row.salePrice }}</span>
 
+          </template>
 
+        </el-table-column>
 
+        <el-table-column label="是否限购" align="center">
 
+          <template slot-scope="scope">
 
+            <el-tag type="success" v-if="scope.row.goodsPerform.buyAstrict > -1">是</el-tag>
 
+            <el-tag type="danger" v-if="scope.row.goodsPerform.buyAstrict == -1">否</el-tag>
 
+          </template>
 
+        </el-table-column>
 
+        <el-table-column label="销售渠道" align="center">
 
+          <template slot-scope="scope">
 
+            <span>{{ 
+            (scope.row.goodsPerform.channelWx == 0 ? '小程序' : '') + 
+            ' ' + 
+            (scope.row.goodsPerform.channelWindow == 0 ? '窗口' : '') +
 
+            ' ' + 
+            (scope.row.goodsPerform.channelAutoSale == 0 ? '自助售/取票机' : '')}}</span>
 
+          </template>
 
+        </el-table-column>
 
+        <el-table-column label="是否可退" align="center">
 
+          <template slot-scope="scope">
 
+            <el-tag type="success" v-if="scope.row.goodsPerform.backStatus == 0">可退</el-tag>
 
+            <el-tag type="danger" v-if="scope.row.goodsPerform.backStatus == 1">不可退</el-tag>
 
+          </template>
 
+        </el-table-column>
 
+        <!-- <el-table-column label="销售有效期" align="center">
 
+          <template slot-scope="scope">
 
+            <span>{{ 
+              scope.row.goodsPerform && scope.row.goodsPerform.saleBeginTime && scope.row.goodsPerform.saleEndTime ? 
+              scope.row.goodsPerform.saleBeginTime +'--'+ scope.row.goodsPerform.saleEndTime :
 
+              '-'
 
+            }}</span>
 
+          </template>
 
+        </el-table-column> -->
 
+        <el-table-column label="状态" align="center">
 
+          <template slot-scope="scope">
 
+            <el-switch
 
+              @change="ionlineApi(scope.row)"
 
+              v-model="scope.row.switchValue"
 
+              :active-value="0"
 
+              active-color="#13ce66"
 
+              inactive-color="#ff4949">
 
+            </el-switch>
 
+          </template>
 
+        </el-table-column>
 
+  
+        <el-table-column label="添加时间" align="center" prop="createTime" width="160" >
 
+          <template slot-scope="scope">
 
+            <span>{{ parseTime(scope.row.createTime) }}</span>
 
+          </template>
 
+        </el-table-column>
 
+  
+        <el-table-column label="操作" align="center" width="200" class-name="small-padding fixed-width">
 
+          <template slot-scope="scope">
 
+            <el-button
 
+              size="mini"
 
+              type="text"
 
+              @click="openDetails(scope.row)"
 
+              v-hasPermi="['ticketMr:ticketMr:details']"
 
+            >详情</el-button>
 
+            <el-button
 
+              size="mini"
 
+              type="text"
 
+              @click="handleUpdate(scope.row)"
 
+              v-if="scope.row.status != 0"
 
+              v-hasPermi="['ticketMr:ticketMr:edit']"
 
+            >修改</el-button>
 
+            <el-button
 
+              size="mini"
 
+              type="text"
 
+              @click="handleDelete(scope.row,scope.index)"
 
+              v-hasPermi="['ticketMr:ticketMr:delete']"
 
+            >删除</el-button>
 
+          </template>
 
+        </el-table-column>
 
+      </el-table>
 
+  
+      <pagination
 
+        v-show="total>0"
 
+        :total="total"
 
+        :page.sync="queryParams.pageNum"
 
+        :limit.sync="queryParams.pageSize"
 
+        @pagination="getList"
 
+      />
 
+  
+      <!-- 新增/编辑弹框 -->
 
+      <add-and-edit
 
+        ref="addAndEdit"
 
+        @getList="getList"
 
+      />
 
+  
+      <!-- 详情 -->
 
+      <details-dia ref="detailsDia"></details-dia>
 
+  
+    </div>
 
+  </template>
 
+  
+  <script>
 
+  
+  import { pageList, deleteById, updateStatus } from '@/api/tourism/scenicAreaManagement/attractionInfo'
 
+  import addAndEdit from "./dialog/addAndEdit";
 
+  import detailsDia from "./dialog/details.vue";
 
+  
+  export default {
 
+    name: "agreement",
 
+    dicts: ['agreement_type'],
 
+    components: { addAndEdit, detailsDia },
 
+    data() {
 
+      return {
 
+        // 遮罩层
 
+        loading: true,
 
+        // 选中数组
 
+        ids: [],
 
+        // 非单个禁用
 
+        single: true,
 
+        // 非多个禁用
 
+        multiple: true,
 
+        // 显示搜索条件
 
+        showSearch: true,
 
+        // 总条数
 
+        total: 0,
 
+        // 用户表格数据
 
+        dataList: null,
 
+        // 弹出层标题
 
+        title: "",
 
+  
+        // 是否显示弹出层
 
+        open: false,
 
+        // 日期范围
 
+        dateRange: [],
 
+        // 查询参数
 
+        queryParams: {
 
+          pageNum: 1,
 
+          pageSize: 10,
 
+          type: undefined,
 
+          goodsType: 2,
 
+          classifyId: 1
 
+        },
 
+        statusList: [
 
+          {id: 1, name: '未发布', value: 0},
 
+          {id: 2, name: '发布', value: 1},
 
+          {id: 3, name: '下架', value: 2},
 
+        ],
 
+        visibleStatus: false,
 
+        newObj: {},
 
+        visibleType: ''
 
+      };
 
+    },
 
+    created() {
 
+      this.getList();
 
+    },
 
+    methods: {
 
+      /** 查询列表 */
 
+      getList() {
 
+        this.loading = true;
 
+        pageList(this.addDateRange(this.queryParams, this.dateRange))
 
+        .then(response => {
 
+            this.dataList = response.data.rows;
 
+            this.dataList.forEach(item =>{
 
+              item.switchValue = item.status;
 
+            })
 
+            this.total = response.data.total;
 
+            this.loading = false;
 
+          }
 
+        );
 
+      },
 
+      // 取消按钮
 
+      cancel() {
 
+        this.open = false;
 
+      },
 
+      /** 搜索按钮操作 */
 
+      handleQuery() {
 
+        this.queryParams.pageNum = 1;
 
+        this.getList();
 
+      },
 
+      /** 重置按钮操作 */
 
+      resetQuery() {
 
+        this.dateRange = [];
 
+        this.$set(this.queryParams, 'goodsName', '');
 
+        this.queryParams.pageNum = 1;
 
+        this.handleQuery();
 
+      },
 
+      /** 新增按钮操作 */
 
+      handleAdd() {
 
+        this.$refs["addAndEdit"].openDialog("新增数据", null);
 
+      },
 
+      /** 修改按钮操作 */
 
+      handleUpdate(row) {
 
+        this.$refs["addAndEdit"].openDialog("修改数据", row);
 
+      },
 
+      /** 详情按钮操作 */
 
+      openDetails(row) {
 
+        this.$refs["detailsDia"].openDialog("详情", row);
 
+      },
 
+  
+      /** 发布或者取消发布按钮操作 */
 
+      ionlineApi(row) {
 
+        try {
 
+          updateStatus({ id: row.id, status: row.status == 0 ? 1 : 0 }).then((res) => {
 
+            if (res.code == 200) {
 
+              this.$message({
 
+                type: 'success',
 
+                message: '操作成功!'
 
+              });
 
+              this.getList();
 
+            }
 
+          });
 
+        }catch (e) {
 
+          this.getList();
 
+        }
 
+      },
 
+  
+      // 修改是否启用
 
+      changeStatus(row) {
 
+        console.log(row)
 
+      },
 
+  
+      /** 删除按钮操作 */
 
+      handleDelete(row) {
 
+        this.$modal.confirm('是否确认删除数据票务名称为"' + row.goodsName + '"的数据项？').then(function() {
 
+          return deleteById(row.id);
 
+        }).then(() => {
 
+          this.getList();
 
+          this.$modal.msgSuccess("删除成功");
 
+        }).catch(() => {});
 
+      },
 
+      /** 查看按钮操作 */
 
+      seeCenter(obj, type) {
 
+        this.visibleStatus = true
 
+        this.visibleType = type;
 
+        this.newObj = obj;
 
+      }
 
+    }
 
+  };
 
+  </script>
 
+

+ 294 - 0
src/views/tourism/scenicAreaManagement/contentManagement/dialog/addAndEdit.vue
Файл харах 

@@ -0,0 +1,294 @@
 
+<template>
 
+  <el-dialog
 
+    :title="title"
 
+    :visible.sync="open"
 
+    width="800px"
 
+    append-to-body
 
+    :close-on-click-modal="false"
 
+    @close="cancel"
 
+  >
 
+    <div class="dialog">
 
+      <el-form v-if="open" :model="form" ref="form" :rules="rules" label-width="120px">
 
+        
+      </el-form>
 
+    </div>
 
+    <span slot="footer" class="dialog-footer">
 
+      <el-button @click="cancel">取消</el-button>
 
+      <el-button
 
+        type="primary"
 
+        @click="submitForm"
 
+        v-loading.fullscreen.lock="loading"
 
+        element-loading-text="提交中..."
 
+        element-loading-spinner="el-icon-loading"
 
+        element-loading-background="rgba(0, 0, 0, 0.8)"
 
+      >
 
+        <span v-if="loading">提交中...</span>
 
+        <span v-else>保存</span>
 
+      </el-button>
 
+    </span>
 
+    <!-- 添加或修改对话框 End -->
 
+  </el-dialog>
 
+</template>
 
+
 
+<script>
 
+import { saveAndEdit, getSelectById } from '@/api/tourism/scenicAreaManagement/attractionInfo'
 
+export default {
 
+  name: "addAndEdit",
 
+  dicts: [],
 
+  data() {
 
+    return {
 
+      title: "",
 
+      model: "EDIT", // 弹出模式   
+      open: false,
 
+      loading: false,
 
+      form: {
 
+        id: undefined,
 
+        type: "",
 
+        content: "",
 
+        isAuth: '1',
 
+        backTime: '1',
 
+        goodsPerform: {}
 
+      },
 
+      rules: {
 
+        xxx: [{ required: true, message: "请输入xxx", trigger: ["change","blur"] }]
 
+      }
 
+    };
 
+  },
 
+  methods: {
 
+    /**
 
+     * 打开弹框
 
+     * @date 2023-11-22
 
+     * @param {any} obj
 
+     * @returns {any}
 
+     */
 
+    openDialog(title, obj) {
 
+      this.open = true;
 
+      this.reset();
 
+      this.activeName = '01';
 
+      if (obj){
 
+        this.title = "编辑票务管理";
 
+        this.getSelectByIdApi(obj)
 
+      }else{
 
+        this.title = "添加票务管理";
 
+        this.$nextTick(() => {
 
+          this.$refs["form"].clearValidate();
 
+        });
 
+      }
 
+    },
 
+    /** 获取详情 */
 
+    getSelectByIdApi(row) {
 
+      const id = row.id
 
+      getSelectById(id).then(response => {
 
+        const obj = response.data;
 
+        this.$nextTick(() => {
 
+          this.form = {}
 
+        });
 
+      });
 
+    },
 
+    /** 价格输入事件 */
 
+    changePriceAmount(key) {
 
+      if(this.form[key] * 1 < 0){
 
+        this.$message.error("输入需大于或等于0!");
 
+        this.$set(this.form, key, '');
 
+        return false
 
+      }
 
+    },
 
+    /**
 
+     * 保存
 
+     * @date 2023-11-22
 
+     * @returns {any}
 
+     */
 
+    submitForm() {
 
+      this.$refs["form"].validate(async (valid) => {
 
+        if (valid) {
 
+          try {
 
+            let postMap = {
 
+              goodsPerform: {},
 
+              performRefundRule: {}
 
+            }
 
+            if(this.form.id){
 
+              postMap.id = this.form.id;
 
+            }
 
+            postMap.goodsName = this.form.goodsName;
 
+            postMap.isAuth = this.form.isAuth;
 
+            postMap.goodsPerform.verificationSpeaker = this.form.verificationSpeaker;
 
+            postMap.goodsPerform.beforeTime = this.form.beforeTime;
 
+            postMap.goodsPerform.detail = this.form.detail;
 
+
 
+
 
+            postMap.salePrice = this.form.salePrice;
 
+            postMap.goodsPerform.buyAstrict = this.form.buyAstrictType == '1' ? this.form.buyAstrict : '-1';
 
+            if(!(this.form.channelWx || this.form.channelWindow || this.form.channelAutoSale)){
 
+              this.$message.error("请选择销售渠道!");
 
+              return false;
 
+            }
 
+            postMap.taxRate = this.form.taxRate
 
+            postMap.goodsPerform.channelWx = this.form.channelWx ? 0 : 1;
 
+            postMap.goodsPerform.channelWindow = this.form.channelWindow  ? 0 : 1;
 
+            postMap.goodsPerform.channelAutoSale = this.form.channelAutoSale  ? 0 : 1;
 
+            postMap.goodsPerform.backStatus = this.form.backStatus;
 
+            if(this.form.backStatus == '0') {
 
+              postMap.performRefundRule.days = this.form.days;
 
+              postMap.performRefundRule.hour = this.form.hour;
 
+            }
 
+            postMap.goodsType = 2;
 
+            postMap.classifyId = 1;
 
+            postMap.classifyName = "门票类";
 
+            postMap.saleArea = this.form.saleArea&&this.form.saleArea.length>0?this.form.saleArea:[]
 
+            postMap.goodsPerform.stopSaleTime = this.form.stopSaleTime
 
+            if(this.form.saleTimeAll && this.form.saleTimeAll.length > 0) {
 
+              postMap.goodsPerform.saleBeginTime = this.form.saleTimeAll[0];
 
+              postMap.goodsPerform.saleEndTime = this.form.saleTimeAll[1];
 
+            }
 
+
 
+            this.loading = true;
 
+            const { code } = await saveAndEdit({ ...postMap });
 
+            if (code === 200) {
 
+              this.$message.success("操作成功!");
 
+              this.$emit("getList");
 
+              this.cancel();
 
+            }
 
+          } catch (error) {
 
+          } finally {
 
+            this.loading = false;
 
+          }
 
+        }
 
+      });
 
+    },
 
+    /**
 
+     * 重置
 
+     * @date 2023-11-22
 
+     * @returns {any}
 
+     */
 
+    reset() {
 
+      this.$set(this.form, 'id', '');
 
+      this.$set(this.form, 'goodsName', '');
 
+      this.$set(this.form, 'isAuth', '1');
 
+      this.$set(this.form, 'verificationSpeaker', '');
 
+      this.$set(this.form, 'detail', '');
 
+      this.$set(this.form, 'goodsPerform', {});
 
+      this.$set(this.form, 'salePrice', '');
 
+      this.$set(this.form, 'buyAstrictType', '1');
 
+      this.$set(this.form, 'buyAstrict', '');
 
+      this.$set(this.form, 'channelWx', '');
 
+      this.$set(this.form, 'channelWindow', '');
 
+      this.$set(this.form, 'beforeTime', '');
 
+
 
+      this.$set(this.form, 'backStatus', '');
 
+      this.$set(this.form, 'backTime', '1');
 
+      this.$set(this.form, 'taxRate', '');
 
+      this.$set(this.form, 'backStatus', '');
 
+      this.$set(this.form, 'days', '');
 
+      this.$set(this.form, 'hour', '');
 
+      this.$set(this.form, 'saleArea', '');
 
+      this.$set(this.form, 'stopSaleTime', '');
 
+      this.$set(this.form, 'saleTimeAll', '');
 
+    },
 
+    /**
 
+     * 关闭弹框
 
+     * @date 2023-11-22
 
+     * @returns {any}
 
+     */
 
+    cancel() {
 
+      // this.reset();
 
+      this.open = false;
 
+    },
 
+  },
 
+};
 
+</script>
 
+
 
+<style lang="scss" scoped>
 
+.dialog {
 
+  padding: 0 30px;
 
+  max-height: 65vh;
 
+  overflow-y: auto;
 
+}
 
+.dialog {
 
+  padding: 0 30px;
 
+  .upload-btn {
 
+    width: 100px;
 
+    height: 100px;
 
+    background-color: #fbfdff;
 
+    border: dashed 1px #c0ccda;
 
+    border-radius: 5px;
 
+    i {
 
+      font-size: 30px;
 
+      margin-top: 20px;
 
+    }
 
+    &-text {
 
+      margin-top: -10px;
 
+    }
 
+  }
 
+  .avatar {
 
+    cursor: pointer;
 
+  }
 
+}
 
+.el-table{
 
+  .upload-btn {
 
+    width: 100px;
 
+    height: 100px;
 
+    background-color: #fbfdff;
 
+    border: dashed 1px #c0ccda;
 
+    border-radius: 5px;
 
+    i {
 
+      font-size: 30px;
 
+      margin-top: 20px;
 
+    }
 
+    &-text {
 
+      margin-top: -10px;
 
+    }
 
+  }
 
+  .avatar {
 
+    cursor: pointer;
 
+  }
 
+}
 
+
 
+.area-container {
 
+  min-height: 400px;
 
+}
 
+
 
+::v-deep .area-wrap-city.el-cascader {
 
+  line-height: normal;
 
+  .el-input {
 
+    cursor: pointer;
 
+    width: 100% !important;
 
+    height: 28px !important;
 
+    .el-input__inner {
 
+      display: none !important;
 
+    }
 
+    span.el-input__suffix {
 
+      position: inherit !important;
 
+      i.el-input__icon {
 
+        line-height: inherit;
 
+        margin-left: 5px;
 
+      }
 
+    }
 
+
 
+    .el-input__wrapper {
 
+      box-shadow: none;
 
+      input {
 
+        display: none;
 
+      }
 
+    }
 
+  }
 
+
 
+  .el-cascader__tags {
 
+    display: none;
 
+  }
 
+}
 
+
 
+.area-city-popper {
 
+  .el-cascader-panel {
 
+    .el-scrollbar.el-cascader-menu {
 
+      .el-cascader-menu__wrap.el-scrollbar__wrap {
 
+        height: 315px;
 
+      }
 
+    }
 
+  }
 
+}
 
+</style>
 
+<style>
 
+.custom-class-box {
 
+  z-index: 999999 !important;
 
+}
 
+</style>

+ 114 - 0
src/views/tourism/scenicAreaManagement/contentManagement/dialog/details.vue
Файл харах 

@@ -0,0 +1,114 @@
 
+<!--
 
+ * @Description: 详情弹框
 
+ * @Author: Sugar.
 
+ * @Date: 2023-11-24 13:55:00
 
+ * @LastEditors: Sugar.
 
+ * @LastEditTime: 2023-11-24 13:55:00
 
+ * @FilePath: \cattle_webui\src\views\ticket\ticketMr\dialog\details.vue
 
+ * @Copyright: Copyright (c) 2016~2023 by Sugar., All Rights Reserved.
 
+-->
 
+<template>
 
+  <el-dialog
 
+    title="票务详情"
 
+    :visible.sync="open"
 
+    width="700px"
 
+    append-to-body
 
+    :close-on-click-modal="false"
 
+    @close="cancel"
 
+  >
 
+    <div class="dialog" v-if="form">
 
+      
+    </div>
 
+    <span slot="footer" class="dialog-footer">
 
+      <el-button type="primary" @click="cancel">关闭</el-button>
 
+    </span>
 
+
 
+  </el-dialog>
 
+</template>
 
+
 
+<script>
 
+import { getSelectById } from "@/api/tourism/scenicAreaManagement/attractionInfo";
 
+export default {
 
+  name: "detailsDia",
 
+  data() {
 
+    return {
 
+      title: "编辑",
 
+      model: "EDIT",
 
+      open: false,
 
+      loading: false,
 
+      form: {
 
+        id: undefined,
 
+      },
 
+      performerVisible: false,
 
+      performerList: []
 
+    };
 
+  },
 
+  methods: {
 
+    /**
 
+     * 打开弹框
 
+     * @date 2023-11-22
 
+     * @param {any} obj
 
+     * @returns {any}
 
+     */
 
+    openDialog(title, obj) {
 
+      this.open = true;
 
+      if (obj){
 
+        this.getSelectByIdApi(obj)
 
+      }
 
+    },
 
+    /** 获取详情 */
 
+    getSelectByIdApi(row) {
 
+      const id = row.id
 
+      getSelectById(id).then(response => {
 
+        this.form = response.data;
 
+      });
 
+    },
 
+    /**
 
+     * 关闭弹框
 
+     * @date 2023-11-22
 
+     * @returns {any}
 
+     */
 
+    cancel() {
 
+      this.open = false;
 
+    },
 
+  },
 
+};
 
+</script>
 
+
 
+<style lang="scss" scoped>
 
+.dialog {
 
+  padding: 0 30px;
 
+  max-height: 65vh;
 
+  overflow-y: auto;
 
+}
 
+.dialog {
 
+  padding: 0 30px;
 
+  .upload-btn {
 
+    width: 100px;
 
+    height: 100px;
 
+    background-color: #fbfdff;
 
+    border: dashed 1px #c0ccda;
 
+    border-radius: 5px;
 
+    i {
 
+      font-size: 30px;
 
+      margin-top: 20px;
 
+    }
 
+    &-text {
 
+      margin-top: -10px;
 
+    }
 
+  }
 
+  .avatar {
 
+    cursor: pointer;
 
+  }
 
+  .title-class{
 
+    font-size: 16px;
 
+    font-weight: bold;
 
+    color: black;
 
+    margin-bottom: 20px;
 
+    margin-top: 20px;
 
+  }
 
+  .item-class{
 
+    margin-bottom: 20px;
 
+  }
 
+}
 
+</style>

+ 5 - 0
src/views/tourism/scenicAreaManagement/contentManagement/navigationManagement.vue
Файл харах 

@@ -0,0 +1,5 @@
 
+<template>
 
+    <div>
 
+        这个是导览管理
 
+    </div>
 
+</template>