no message

src/style/common.less

@@ -18,6 +18,16 @@
   color: #b1b1b1;
 }
 
+.comonTitle {
+  font-size: 20px;
+  color: #52575b;
+}
+
+.comonPrompt {
+  font-size: 14px;
+  color: #9b9b9b;
+}
+
 .common-main {
   background-color: white;
   padding: 40px 20px;

src/utils/elementConfig.js

@@ -32,7 +32,8 @@ import {
   TabPane,
   Menu,
   MenuItem,
-  Loading
+  Loading,
+  Image
 } from 'element-ui'
 
 Vue.prototype.$loading = Loading
@@ -71,3 +72,4 @@ Vue.use(DropdownItem)
 Vue.use(Cascader)
 Vue.use(Menu)
 Vue.use(MenuItem)
+Vue.use(Image)

src/views/kpi/set/authority/index.vue

@@ -0,0 +1,147 @@
+<template>
+  <div class="authority commonFont">
+    <div>
+      <div class="authority-main line-space">
+        <div class="authority-main-header">
+          <div class="comonTitle">智能绩效主管理员</div>
+          <el-button
+            type="primary"
+            size="small"
+            @click="handleChangeDirector"
+          >更换智能绩效主管理员</el-button>
+        </div>
+        <div class="comonPrompt">绩效应用的主管理员，可由钉钉主管理员设置，绩效主管理员具有应用所有权限，且可以设置智能绩效应用子管理员</div>
+        <div class="authority-main-info">
+          <el-image :src="url"></el-image>
+          <div class="authority-main-info-name">阿三来了</div>
+        </div>
+      </div>
+      <div class="authority-sub line-space">
+        <div class="authority-sub-header">
+          <div class="comonTitle">智能绩效子管理员</div>
+          <el-button
+            type="primary"
+            size="small"
+            @click="handleSubAdd"
+            icon="el-icon-plus"
+            plain
+          >添加</el-button>
+        </div>
+        <div class="comonPrompt line-space">可把绩效应用的日常管理工作交给绩效子管理员，绩效子管理员可由绩效主管理员设置</div>
+        <el-table
+          :data="tableDataList"
+          :header-cell-style="handleSubGetTableStyle"
+        >
+          <el-table-column label="姓名"></el-table-column>
+          <el-table-column label="功能模块"></el-table-column>
+          <el-table-column label="管理范围"></el-table-column>
+          <el-table-column label="是否可见考核结果"></el-table-column>
+          <el-table-column label="菜单权限"></el-table-column>
+          <el-table-column label="管理考评组"></el-table-column>
+          <el-table-column label="操作"></el-table-column>
+        </el-table>
+      </div>
+      <div class="authority-ceo line-space">
+        <div class="comonTitle line-space">企业负责人</div>
+        <div class="comonPrompt">企业负责人可以看到全公司的绩效数据，可由钉钉主管理员在通讯录设置</div>
+      </div>
+      <div class="authority-department line-space">
+        <div class="comonTitle line-space">部门主管</div>
+        <div class="comonPrompt">部门主管可看到管理部门的绩效数据，可由钉钉管理员在钉钉通讯录设置</div>
+      </div>
+      <div class="authority-employee line-space">
+        <div class="comonTitle line-space">员工</div>
+        <div class="comonPrompt">员工仅可见自己的绩效数据</div>
+      </div>
+    </div>
+
+    <dialog-depart
+      v-if="showDialogDepart"
+      :value.sync='depIds'
+      :isShow.sync='showDialogDepart'
+      :showDataList.sync='showData'
+    />
+    <popup-right
+      v-if="showPopupAddSub"
+      @cancel="hundlePopupAddSubHide"
+      @submit="handlePopupAddSubSubmit"
+      title="智能绩效子管理员设置"
+      class="popup"
+    ></popup-right>
+  </div>
+</template>
+
+<script>
+import dialogDepart from '@/components/getDepart'
+import popupRight from '@/components/PopupRight'
+
+export default {
+  components: {
+    dialogDepart,
+    popupRight
+  },
+  data () {
+    return {
+      url: '',
+      showDialogDepart: false,
+      tableDataList: [],
+      showData: {},
+      depIds: '22',
+      showPopupAddSub: false // 显示添加子管理员
+
+    }
+  },
+  methods: {
+    handleSubGetTableStyle () {
+      return { 'background-color': '#f5f4f5', 'text-align': 'center' }
+    },
+    handleChangeDirector () {
+      // 更换主管
+      this.showDialogDepart = true
+    },
+    handleSubAdd () {
+
+    }
+  }
+}
+</script>
+<style lang="less" scoped>
+.authority {
+  background-color: white;
+  padding-top: 40px;
+  .line-space {
+    margin-bottom: 18px;
+  }
+  .el-image {
+    width: 40px;
+    height: 40px;
+    border-radius: 20px;
+    overflow: hidden;
+  }
+  &-main {
+    &-header {
+      display: flex;
+      width: 100%;
+      justify-content: space-between;
+    }
+    &-info {
+      display: flex;
+      justify-content: flex-start;
+      align-items: center;
+      height: 72px;
+      width: 100%;
+      line-height: 72px;
+      &-name {
+        margin-left: 10px;
+      }
+    }
+  }
+  &-sub {
+    &-header {
+      display: flex;
+      width: 100%;
+      justify-content: space-between;
+    }
+  }
+}
+</style>

src/views/kpi/set/index.vue

@@ -13,14 +13,14 @@
     </el-menu>
     <ground-table v-if="activeIndex==='0'"></ground-table>
     <div v-else-if="activeIndex==='1'">
-      <span>默认值设置</span>
+      <try-authority></try-authority>
     </div>
   </div>
 </template>
 
 <script>
 import groundTable from '../workbench/assessmentGroup/groundTable'
-
+import tryAuthority from './authority'
 export default {
   data () {
     return {
@@ -28,7 +28,8 @@ export default {
     }
   },
   components: {
-    groundTable
+    groundTable,
+    tryAuthority
   },
   beforeMount () { },
   mounted () { },
@@ -48,6 +49,6 @@ export default {
 <style lang='less' scoped>
 .set-mian {
   padding-top: 0px;
-  min-height: 600px;
+  // min-height: 600px;
 }
 </style>