From aba6f3ec29d877a63a80138729d796704f38a5a2 Mon Sep 17 00:00:00 2001
From: zhujida <zhujida@ldxinyong.com>
Date: Fri, 15 Jan 2021 18:12:41 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8C=87=E6=A0=87=E5=BA=93=EF=BC=9A=20?=
 =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E7=AD=9B=E9=80=89=E5=BC=B9=E7=AA=97=EF=BC=8C?=
 =?UTF-8?q?=E7=A7=BB=E5=8A=A8=E5=BC=B9=E7=AA=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/PopupRadio/index.vue     |  83 ++++++++++++
 src/components/TargetFiltrate/index.vue | 160 ++++++++++++++++++++++++
 src/icons/svg/radiodef.svg              |   7 ++
 src/icons/svg/radioselected.svg         |   7 ++
 src/style/common.less                   |  67 +++++-----
 src/utils/elementConfig.js              |   4 +-
 src/views/kpi/set/index.vue             |   4 +-
 src/views/kpi/set/target/index.vue      |  26 +++-
 src/views/kpi/workbench/home/index.vue  | 137 +++++++++++++-------
 9 files changed, 413 insertions(+), 82 deletions(-)
 create mode 100644 src/components/PopupRadio/index.vue
 create mode 100644 src/components/TargetFiltrate/index.vue
 create mode 100644 src/icons/svg/radiodef.svg
 create mode 100644 src/icons/svg/radioselected.svg

diff --git a/src/components/PopupRadio/index.vue b/src/components/PopupRadio/index.vue
new file mode 100644
index 0000000..a8619af
--- /dev/null
+++ b/src/components/PopupRadio/index.vue
@@ -0,0 +1,83 @@
+<template>
+  <popup-right
+    v-if="isShowPopupRadio"
+    @cancel="hundlePopupHide"
+    @submit="handleSubmitPopup"
+    :title="popupRightTitle"
+    :subumitText='subumitText'
+    class="popup commonFont"
+  >
+    <div slot="content">
+      <div
+        v-for="(item, index) in tableData"
+        :key="index"
+        class="row"
+        @click="radioSelectedId = item.id"
+      >
+        <svg-icon
+          :icon-class="radioSelectedId ===item.id?'radioselected':'radiodef'"
+          class-name='icon'
+        />{{item.name}}
+      </div>
+    </div>
+  </popup-right>
+</template>
+<script>
+import PopupRight from '@/components/PopupRight'
+export default {
+  methods: {
+    hundlePopupHide () {
+      this.$emit('update:isShowPopupRadio', false)
+    },
+    handleSubmitPopup () {
+      this.$emit('update:isShowPopupRadio', false)
+    }
+  },
+  components: {
+    PopupRight
+  },
+  props: {
+    isShowPopupRadio: {
+      type: Boolean,
+      default: false
+    },
+    popupRightTitle: {
+      default: '移动到',
+      type: String
+    },
+    subumitText: {
+      default: '确定',
+      type: String
+    },
+    dataList: {
+      type: Array,
+      default: () => {
+        return [{ id: 1, name: '全部指标' }, { id: 2, name: '全部指标' }]
+      }
+    }
+  },
+  data () {
+    return {
+      radioSelectedId: '',
+      tableData: this.dataList
+    }
+  }
+}
+</script>
+<style lang="less" scoped>
+.icon {
+  width: 20px !important;
+  height: 20px !important;
+  margin-right: 10px;
+}
+.row {
+  display: flex;
+  border-bottom: 0.5px solid @borderColor;
+  align-items: center;
+  padding: 10px 10px;
+  height: 50px;
+}
+.row:hover {
+  background-color: @mainBgColor;
+}
+</style>
diff --git a/src/components/TargetFiltrate/index.vue b/src/components/TargetFiltrate/index.vue
new file mode 100644
index 0000000..48bc2ac
--- /dev/null
+++ b/src/components/TargetFiltrate/index.vue
@@ -0,0 +1,160 @@
+<template>
+  <popup-right
+    v-if="isShowTargetFiltrate"
+    @cancel="hundlePopupHide"
+    @submit="handleSubmitPopup"
+    :title="popupRightTitle"
+    :subumitText='subumitText'
+    class="popup commonFont"
+  >
+    <div slot="content">
+      <div
+        class="area"
+        v-for="area in listData"
+        :key="area.id"
+      >
+        <div class="area-title">
+          <i></i>{{area.title}}
+        </div>
+        <div class="area-content">
+          <div
+            :class="area.selectedId === item.id? area.btnSelected:area.btnDef"
+            v-for="item in area.list"
+            :key="item.id"
+            @click="area.selectedId = item.id"
+          >
+            <span>爱福家拉法基拉法基酸辣粉司法局阿里</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  </popup-right>
+</template>
+<script>
+import PopupRight from '@/components/PopupRight'
+
+export default {
+  methods: {
+    hundlePopupHide () {
+      console.log('隐藏---------')
+      this.$emit('update:isShowTargetFiltrate', false)
+    },
+    handleSubmitPopup () {
+      let idList = this.listData.map(item => {
+        let key = item.id
+        let value = item.selectedId
+        let dic = {}
+        dic[key] = value
+        return dic
+      })
+      console.log(idList)
+      this.$emit('update:isShowTargetFiltrate', false)
+    }
+  },
+  data () {
+    return {
+      subumitText: '确定',
+      itemStyle: 'area-content-item btn-def',
+      itemSelectedStyle: 'area-content-item btn-def btn-def-selected',
+      itemBlueStyle: 'area-content-item btn-blue-def',
+      itemSelectedBlueStyle: 'area-content-item btn-blue-def btn-blue-selected',
+      radioClasse: 1,
+      radioTage: 1,
+      listData: [
+        {
+          title: '类型',
+          id: 'area1',
+          selectedId: 1,
+          btnDef: 'area-content-item btn-def',
+          btnSelected: 'area-content-item btn-def btn-def-selected',
+          list: [{ id: 1, title: '全部' }, { id: 2, title: '量化指标' }, { id: 3, title: '行为价值观指标' }, { id: 4, title: '加分项' }, { id: 5, title: '扣分项' }]
+        },
+        {
+          title: '标签',
+          id: 'area2',
+          selectedId: 1,
+          btnDef: 'area-content-item btn-blue-def',
+          btnSelected: 'area-content-item btn-blue-def btn-blue-selected',
+          list: [{ id: 1, title: '全部' }, { id: 2, title: '量化指标' }, { id: 3, title: '行为价值观指标' }, { id: 4, title: '加分项' }, { id: 5, title: '扣分项' }]
+        }
+      ],
+      areaSelectedDic: {}
+
+    }
+  },
+  props: {
+    isShowTargetFiltrate: {
+      type: Boolean,
+      default: false
+    },
+    popupRightTitle: {
+      default: '筛选',
+      type: String
+    }
+  },
+  components: {
+    PopupRight
+  }
+}
+</script>
+<style lang="less" scoped>
+.popup {
+  width: 440px;
+  .area {
+    &-title {
+      height: 40px;
+      display: flex;
+      align-items: center;
+      line-height: 40px;
+      i {
+        width: 10px;
+        height: 10px;
+        background-color: @mianBlue;
+        border-radius: 5px;
+        margin-right: 5px;
+      }
+    }
+    &-content {
+      display: flex;
+      flex-wrap: wrap;
+      justify-content: space-between;
+      padding: 0px 15px;
+      width: 438px;
+      &-item {
+        min-width: 48%;
+        max-width: 48%;
+        height: 50px;
+        border-radius: 8px;
+        line-height: 50px;
+        text-align: center;
+        margin-bottom: 10px;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        padding: 0px 10px;
+      }
+      .btn-def,
+      .btn-blue-def {
+        background-color: #f2f2f2;
+        color: #8e8e8e;
+      }
+      .btn-def:hover {
+        color: #ff904b;
+        cursor: pointer;
+      }
+      .btn-def-selected {
+        background-color: #ffe7d8;
+        color: #ff904b;
+      }
+      .btn-blue-def:hover {
+        color: @mianBlue;
+        cursor: pointer;
+      }
+      .btn-blue-selected {
+        background-color: #e1f0fb;
+        color: @mianBlue;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/icons/svg/radiodef.svg b/src/icons/svg/radiodef.svg
new file mode 100644
index 0000000..6a98b1f
--- /dev/null
+++ b/src/icons/svg/radiodef.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>默认</title>
+    <g id="默认" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <path d="M10,2 C14.418278,2 18,5.581722 18,10 C18,14.418278 14.418278,18 10,18 C5.581722,18 2,14.418278 2,10 C2,5.581722 5.581722,2 10,2 Z M10,3 C6.13400675,3 3,6.13400675 3,10 C3,13.8659932 6.13400675,17 10,17 C13.8659932,17 17,13.8659932 17,10 C17,6.13400675 13.8659932,3 10,3 Z" id="Rectangle-73" fill="#CCCCCC" fill-rule="nonzero"></path>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/icons/svg/radioselected.svg b/src/icons/svg/radioselected.svg
new file mode 100644
index 0000000..561fd9f
--- /dev/null
+++ b/src/icons/svg/radioselected.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="20px" height="20px" viewBox="0 0 20 20" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <title>选中</title>
+    <g id="选中" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <path d="M10,2 C14.418278,2 18,5.581722 18,10 C18,14.418278 14.418278,18 10,18 C5.581722,18 2,14.418278 2,10 C2,5.581722 5.581722,2 10,2 Z M13.9037489,7.29488927 C13.7072453,7.09838576 13.3918585,7.10028032 13.1961653,7.29597351 L13.1961653,7.29597351 L9.47367679,11.0183555 L7.18967233,8.73389877 C6.99459834,8.53882477 6.67803784,8.53857477 6.48294345,8.73366916 L6.48294345,8.73366916 L5.99045948,9.22615313 C5.79395597,9.42265664 5.7954679,9.73766081 5.99068909,9.93288201 L5.99068909,9.93288201 L8.97308843,12.9152592 L8.97308843,12.9152592 L8.97594092,12.9180455 L9.12070658,13.0628995 C9.31721009,13.259403 9.63259689,13.2575084 9.82829009,13.0618152 L9.82829009,13.0618152 L14.3951486,8.49495675 C14.5972856,8.29281971 14.5913272,7.98246763 14.3962328,7.78737324 L14.3962328,7.78737324 Z" id="形状结合" fill="#3995fb"></path>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/src/style/common.less b/src/style/common.less
index 1e7040c..ce5e15b 100644
--- a/src/style/common.less
+++ b/src/style/common.less
@@ -1,6 +1,8 @@
 @borderColor: #ebebeb;
 @fontBlue: #3ba1ff;
 @headerHeight: 60px;
+@mianBlue: #3995fb;
+@mainBgColor: #f2f2f2;
 
 .boderAndRadius {
   border: 1px solid @borderColor;
@@ -12,21 +14,29 @@
   font-size: 14px;
   color: #52575b;
 }
-.add{
+
+.add {
   cursor: pointer;
 }
-.pre{
+
+.pre {
   line-height: 20px;
-  pre{
-		overflow:hidden;
+
+  pre {
+    overflow: hidden;
     line-height: 20px;
     // white-space:pre-line;
     // word-wrap: break-word;
-    white-space: pre-line; /* css-3 */
-    white-space: -moz-pre-line; /* Mozilla, since 1999 */
-    white-space: -pre-line; /* Opera 4-6 */
-    white-space: -o-pre-line; /* Opera 7 */
-    word-wrap: break-word; /* Internet Explorer 5.5+ */
+    white-space: pre-line;
+    /* css-3 */
+    white-space: -moz-pre-line;
+    /* Mozilla, since 1999 */
+    white-space: -pre-line;
+    /* Opera 4-6 */
+    white-space: -o-pre-line;
+    /* Opera 7 */
+    word-wrap: break-word;
+    /* Internet Explorer 5.5+ */
     word-break: break-all;
   }
 }
@@ -73,25 +83,22 @@
 
 
 /*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
-::-webkit-scrollbar
-{
-	width: 2px;
-	height: 8px;
-	background: #409EFF;
-}
- 
-/*定义滚动条轨道 内阴影+圆角*/
-::-webkit-scrollbar-track
-{
-	-webkit-box-shadow: inset 0 0 2px rgba(231, 231, 231, 0.3);
-	border-radius: 1px;
-	background-color: #F5F5F5;
-}
- 
-/*定义滑块 内阴影+圆角*/
-::-webkit-scrollbar-thumb
-{
-  border-radius:4px;
-	-webkit-box-shadow: inset 0 0 2px #409EFF;
+::-webkit-scrollbar {
+  width: 2px;
+  height: 8px;
   background: #409EFF;
-}
\ No newline at end of file
+}
+
+/*定义滚动条轨道 内阴影+圆角*/
+::-webkit-scrollbar-track {
+  -webkit-box-shadow: inset 0 0 2px rgba(231, 231, 231, 0.3);
+  border-radius: 1px;
+  background-color: #F5F5F5;
+}
+
+/*定义滑块 内阴影+圆角*/
+::-webkit-scrollbar-thumb {
+  border-radius: 4px;
+  -webkit-box-shadow: inset 0 0 2px #409EFF;
+  background: #409EFF;
+}
diff --git a/src/utils/elementConfig.js b/src/utils/elementConfig.js
index 887d20d..7d1834b 100644
--- a/src/utils/elementConfig.js
+++ b/src/utils/elementConfig.js
@@ -41,7 +41,8 @@ import {
   Drawer,
   Slider,
   ButtonGroup,
-  Notification
+  Notification,
+  RadioButton
 } from 'element-ui'
 Vue.prototype.$notify = Notification
 Vue.prototype.$loading = Loading
@@ -80,6 +81,7 @@ Vue.use(Row)
 Vue.use(Col)
 Vue.use(Checkbox)
 Vue.use(Radio)
+Vue.use(RadioButton)
 Vue.use(Dropdown)
 Vue.use(DropdownMenu)
 Vue.use(DropdownItem)
diff --git a/src/views/kpi/set/index.vue b/src/views/kpi/set/index.vue
index 0203439..89e2f44 100644
--- a/src/views/kpi/set/index.vue
+++ b/src/views/kpi/set/index.vue
@@ -58,9 +58,9 @@ export default {
       this.activeIndex = ''
     }
     if (this.auth.evaluationSet && this.auth.roleSet) {
-      this.activeIndex = this.$route.query.activeIndex || '0'
-    } else {
       this.activeIndex = this.$route.query.activeIndex
+    } else {
+      this.activeIndex = this.$route.query.activeIndex || '0'
     }
   },
   beforeMount () { },
diff --git a/src/views/kpi/set/target/index.vue b/src/views/kpi/set/target/index.vue
index b567c7c..dcf1670 100644
--- a/src/views/kpi/set/target/index.vue
+++ b/src/views/kpi/set/target/index.vue
@@ -28,7 +28,7 @@
               size="small"
             >新增指标</el-button>
             <el-button
-              @click="handleMoving"
+              @click="dialogVisibleMoving = true"
               :disabled="!selectedRowList.length"
               size="small"
             >移动到</el-button>
@@ -93,6 +93,7 @@
             :data="tableData"
             height="400px"
             :header-cell-style="{background:'#f5f4f5'}"
+            @selection-change="handleSelectionChange"
           >
             <div
               slot="empty"
@@ -102,23 +103,32 @@
             <el-table-column
               label="名称"
               sortable
+              prop="name"
             ></el-table-column>
             <el-table-column
               label="指标类型"
               sortable
+              prop="type"
             ></el-table-column>
             <el-table-column label="考核标准"></el-table-column>
             <el-table-column
               label="权重"
               sortable
+              prop="quanzhong"
             ></el-table-column>
           </el-table>
         </div>
       </div>
     </div>
+
+    <target-filtrate :isShowTargetFiltrate.sync="dialogVisibleFilter" />
+    <popup-radio :isShowPopupRadio="dialogVisibleMoving" />
   </div>
 </template>
 <script>
+import TargetFiltrate from '@/components/TargetFiltrate'
+import PopupRadio from '@/components/PopupRadio'
+
 export default {
   methods: {
     handleHeaderSearch (val) {
@@ -129,10 +139,6 @@ export default {
       this.$router.push({ name: 'workbench-target-add' })
       console.log('新增指标')
     },
-    handleMoving () {
-      // 移动
-      console.log('指标移动')
-    },
     handleRemove () {
       console.log('删除指标')
       this.$confirm('确认删除选中指标', '提示').then(() => {
@@ -165,14 +171,22 @@ export default {
         })
         console.log('移除指标')
       }
+    },
+    handleSelectionChange (val) {
+      this.selectedRowList = val
     }
   },
+  components: {
+    TargetFiltrate,
+    PopupRadio
+  },
   data () {
     return {
       headerSearchValue: '',
       dialogVisibleFilter: false,
+      dialogVisibleMoving: false,
       tableMenuData: [{ name: '收代理费建安费啦k咳咳咳书法家阿李师傅', id: '1' }],
-      tableData: [],
+      tableData: [{ name: '收快递费可是', type: '水电费', quanzhong: '40%' }, { name: '收快递费可是', type: '水电费', quanzhong: '40%' }],
       menuDataClasseHide: false,
       selectedRowList: [],
       selectedMenuRowIndex: -1,
diff --git a/src/views/kpi/workbench/home/index.vue b/src/views/kpi/workbench/home/index.vue
index 9791881..810882c 100644
--- a/src/views/kpi/workbench/home/index.vue
+++ b/src/views/kpi/workbench/home/index.vue
@@ -1,36 +1,88 @@
 <!--  -->
 <template>
-    <div>
-      <div class="home boderAndRadius" >
-            <div class='home-left'>
-                <div class="home-left-todo " :class="{borderBottom:selectedTableList.length===0}">
-                  <div class="home-left-todo-top">
-                    <div  class="commonFont">待办事项<span style="margin:0 4px" class="blueColor">{{pageProcessedInfo.totalCount || 0}}</span>条</div>
-                    <div  class="blueColor noSelect commonFont" style="cursor: pointer;" @click="handleGetMoreToDo('workbench-todo')">查看更多<i class="el-icon-arrow-right"></i></div>
-                  </div>
-                  <div class="home-left-todo-center">
-                    <tableItem v-if="selectedTableList.length!==0" :selectedTableList='selectedTableList' />
-                    <!-- <div style="height:300px">
+  <div>
+    <div class="home boderAndRadius">
+      <div class='home-left'>
+        <div
+          class="home-left-todo "
+          :class="{borderBottom:selectedTableList.length===0}"
+        >
+          <div class="home-left-todo-top">
+            <div class="commonFont">待办事项<span
+                style="margin:0 4px"
+                class="blueColor"
+              >{{pageProcessedInfo.totalCount || 0}}</span>条</div>
+            <div
+              class="blueColor noSelect commonFont"
+              style="cursor: pointer;"
+              @click="handleGetMoreToDo('workbench-todo')"
+            >查看更多<i class="el-icon-arrow-right"></i></div>
+          </div>
+          <div class="home-left-todo-center">
+            <tableItem
+              v-if="selectedTableList.length!==0"
+              :selectedTableList='selectedTableList'
+            />
+            <!-- <div style="height:300px">
                       sassa
                     </div> -->
-                  </div>
-                </div>
-              <div v-if="auth.assessment && auth.indexData && auth.launchEvaluation && auth.evaluationGroupManager" class="home-left-enter">
-                <div class="home-left-enter-title commonFont">快捷入口</div>
-                <div class="home-left-enter-content">
-                  <div class="boderAndRadius commonFont noSelect" v-if="auth.assessment"  @click="handleGetMoreToDo('assessment')"><svg-icon icon-class="kaohe" class-name='icon'/>考核管理</div>
-                  <div class="boderAndRadius commonFont noSelect"  v-if="auth.launchEvaluation" @click="handleGetMoreToDo('initiate')"><svg-icon icon-class="faqi" class-name='icon'/>发起考核</div>
-                  <div class="boderAndRadius commonFont noSelect" v-if="auth.evaluationGroupManager" @click="handleGetMoreToDo('workbench-group')" ><svg-icon icon-class="kaoping" class-name='icon'/>考评组</div>
-                  <div class="boderAndRadius commonFont noSelect"  v-if="auth.indexData" @click="handleGetMoreToDo('workbench-target')"><svg-icon icon-class="zhibiao" class-name='icon'/>指标库</div>
-                </div>
-              </div>
+          </div>
+        </div>
+        <div
+          v-if="auth.assessment && auth.indexData && auth.launchEvaluation && auth.evaluationGroupManager"
+          class="home-left-enter"
+        >
+          <div class="home-left-enter-title commonFont">快捷入口</div>
+          <div class="home-left-enter-content">
+            <div
+              class="boderAndRadius commonFont noSelect"
+              v-if="auth.assessment"
+              @click="handleGetMoreToDo('assessment')"
+            >
+              <svg-icon
+                icon-class="kaohe"
+                class-name='icon'
+              />考核管理
             </div>
-            <!-- <div class="home-right boderAndRadius">
+            <div
+              class="boderAndRadius commonFont noSelect"
+              v-if="auth.launchEvaluation"
+              @click="handleGetMoreToDo('initiate')"
+            >
+              <svg-icon
+                icon-class=""
+                class-name='icon'
+              />发起考核
+            </div>
+            <div
+              class="boderAndRadius commonFont noSelect"
+              v-if="auth.evaluationGroupManager"
+              @click="handleGetMoreToDo('workbench-group')"
+            >
+              <svg-icon
+                icon-class="kaoping"
+                class-name='icon'
+              />考评组
+            </div>
+            <div
+              class="boderAndRadius commonFont noSelect"
+              v-if="auth.indexData"
+              @click="handleGetMoreToDo('workbench-target')"
+            >
+              <svg-icon
+                icon-class="zhibiao"
+                class-name='icon'
+              />指标库
+            </div>
+          </div>
+        </div>
+      </div>
+      <!-- <div class="home-right boderAndRadius">
               <report />
             </div> -->
-        </div>
-        <performance :isNoRouter='true'/>
     </div>
+    <performance :isNoRouter='true' />
+  </div>
 </template>
 
 <script>
@@ -60,7 +112,7 @@ export default {
     performance
   },
   computed: {},
-  beforeMount () {},
+  beforeMount () { },
   mounted () {
     let obj = getUrlParams()
     if (obj.id) {
@@ -109,15 +161,14 @@ export default {
 
 </script>
 <style lang="less">
-  .icon{
+.icon {
   width: 25px !important;
   height: 25px !important;
   margin-right: 10px;
 }
 </style>
 <style lang='less' scoped>
-
-.home{
+.home {
   background: #fff;
   margin: 0 auto;
   display: flex;
@@ -126,42 +177,42 @@ export default {
   justify-content: space-between;
   align-items: flex-start;
   overflow: hidden;
-  &-left{
+  &-left {
     flex: 1;
     overflow: auto;
-    padding: 0 30px 0  0;
-    .borderBottom{
+    padding: 0 30px 0 0;
+    .borderBottom {
       border-bottom: 1px solid @borderColor;
     }
-    &-todo{
+    &-todo {
       width: 100%;
 
       padding-top: 18px;
-      &-top{
+      &-top {
         display: flex;
         justify-content: space-between;
       }
-      &-center{
+      &-center {
         padding: 10px 0;
         box-sizing: content-box;
         max-height: 200px;
         overflow: auto;
       }
-      .blueColor{
+      .blueColor {
         color: @fontBlue;
       }
     }
-    &-enter{
+    &-enter {
       width: 100%;
       height: 180px;
-      &-title{
+      &-title {
         margin: 22px 0;
       }
-      &-content{
+      &-content {
         display: flex;
         align-items: center;
         // justify-content: space-between;
-        >div{
+        > div {
           margin-right: 20px;
           width: 186px;
           height: 76px;
@@ -170,18 +221,18 @@ export default {
           justify-content: center;
           cursor: pointer;
         }
-        >div:hover{
+        > div:hover {
           box-shadow: 2px 2px 5px #e6e6e6;
         }
       }
     }
   }
-  &-right{
+  &-right {
     box-sizing: border-box;
     width: 520px;
     min-height: 100px;
     padding: 25px 20px;
-    &-content{
+    &-content {
       width: 100%;
       height: 364px;
     }