system-clients 3.2.1-9 → 3.2.1-aodeToV4

package/src/components/Main.vue

@@ -1,622 +1,515 @@
-<template>
-  <div @click="hindsetting1()" :class="{'with-watermark':showwatermakeflag}">
-    <!--    <div class="system-main" id="box" v-el:box v-if="!isManger">-->
-    <!--      <div class="system-logo" style="height: auto">-->
-    <!--        <img :src="imgs.logoimg" alt=""/>-->
-    <!--        <label>{{systemname}}</label>-->
-    <!--        <div class="system-logo-chi" >-->
-    <!--          <div  v-if="userpane"  class="auto system-logo-prompt" style="float: right">-->
-    <!--            <span>{{orgpathnames}}</span>-->
-    <!--          </div>-->
-    <!--          &lt;!&ndash;<div class="system-logo-chi-img1" style="float: right" @mouseenter="mouseenteruser()"  @mouseleave="mouseleaveuser()"></div>&ndash;&gt;-->
-    <!--          <span  style="float: right; padding-top: 2px"  @mouseenter="mouseenteruser()"  @mouseleave="mouseleaveuser()"  class="system-logo-chi-span-1">{{$login.f.name}}</span>-->
-    <!--          <span style="border-left: 1px solid;float: right;padding-top: 2px" class="system-logo-chi-span-1"> <img src="../../static/newStyle/login-f.png" height="20" width="20"> </span>-->
-    <!--          <a href="index.html" onclick="return confirm('您确定要退出系统吗？');" style="float: right;padding-top: 2px">-->
-    <!--            <img src="../../static/newStyle/system-off.png" alt="" >-->
-    <!--            <span class="system-logo-chi-span-1">退出系统</span>-->
-    <!--          </a>-->
-    <!--          <div style="float: right"  :class="{'dropstyle':setting,'dropstyle-1':!setting}">-->
-    <!--            <dropdown class="auto" >-->
-    <!--                      <span data-toggle="dropdown" @click="hindsetting()"  >-->
-    <!--                        <img :src="srcsetting" alt=""><span>系统设置</span>-->
-    <!--                      </span>-->
-    <!--              <ul slot="dropdown-menu" class="dropdown-menu dropdown-menu-up dropstyle-chi" >-->
-    <!--                &lt;!&ndash;                <li>系统信息及设置</li>&ndash;&gt;-->
-    <!--                <li style="color: #ffffff;white-space: nowrap"  @click="show=true">修改密码</li>-->
-    <!--                <li style="color: #ffffff;white-space: nowrap"  @click="AddChangeMsgShow=true">系统版本</li>-->
-    <!--              </ul>-->
-    <!--            </dropdown>-->
-    <!--          </div>-->
-
-    <!--        </div>-->
-    <!--      </div>-->
-    <!--      <div class="system-left tree-flex" :class="{'system-left-1': !treeOrIcon}" id="top" v-el:top >-->
-    <!--        <div class="system-left-chi" :class="{'system-left-icon': !treeOrIcon}"  >-->
-    <!--          <div class="span system-left-tree" >-->
-    <!--            <left-tree :functions='functions.functions' :userid='userid' @isnodo="isnodo" :treeOrIcon="treeOrIcon"  :tabs="tabs" v-ref:tree></left-tree>-->
-    <!--            &lt;!&ndash;            <icon-tree :functions='functions.functions' :userid='userid' v-show="!treeOrIcon"></icon-tree>&ndash;&gt;-->
-    <!--          </div>-->
-    <!--        </div>-->
-    <!--        <div class="system-foot-stretch" >-->
-    <!--          <a @click="changeShow()"><img src="../../static/images/lefticon/菜单伸缩.png" alt=""></a>-->
-    <!--        </div>-->
-    <!--      </div>-->
-
-
-    <!--      <div class="system-right" :class="{'system-right-1': !treeOrIcon}" id="bottom" v-el:bottom>-->
-    <!--        <div class="span">-->
-    <!--          <echarts-box v-if="$refs.mic.tabs.length === 0"></echarts-box>-->
-    <!--          <dynamic :comps='[]' :showup="true" :showhide="false" name='main' :selecttab.sync="selecttab" @tab-changed="tabChange" @tabscg="tabcg" v-ref:mic v-show="!($refs.mic.tabs.length === 0)"></dynamic>-->
-    <!--        </div>-->
-    <!--      </div>-->
-    <!--            <div class="system-foot"  v-el:bottom>-->
-
-    <!--              <div class="system-foot-box">-->
-
-    <!--              </div>-->
-    <!--            </div>-->
-    <!--    </div>-->
-    <div class='flex-row  system-main' id="box" v-el:box v-if="!isManger">
-      <div class="auto login-operator1" v-if="$refs.mic.tabs.length === 0">
-            <span>
-               <img
-                 src="../assets/people.png" height="15" width="15">
-              登录人：</span>
-        <label>{{ orgpathnames }}</label>
-      </div>
-      <div class="system-left tree-flex" :class="{'tree-flex-icon': !treeOrIcon}" id="top" v-el:top>
-        <div class="system-left-chi" :class="{'system-left-icon': !treeOrIcon}">
-          <div class="span system-left-tree " style="height:85%">
-            <h3>{{ systemname }}</h3>
-            <!--            <div class="span" style="margin-bottom:10px;padding-bottom:5px;padding-top:5px;flex: 1;border-top: 1px solid #e5e5e5;border-bottom: 1px solid #e5e5e5;">-->
-            <left-tree :functions='functions.functions' :userid='userid' @isnodo="isnodo" v-show="treeOrIcon"
-                       :tabs="tabs" v-ref:tree></left-tree>
-            <!--&lt;!&ndash;              <icon-tree :functions='functions.functions' :userid='userid' v-show="!treeOrIcon"></icon-tree>&ndash;&gt;-->
-          </div>
-
-          <div class="tree-flex-footer">
-            <!--            <a @click="changeShow()"><img :src="imgs.open" alt=""><span v-if="treeOrIcon">菜单伸缩</span></a>-->
-            <!-- <a><img src="../../../static/treeset.png" alt="">系统设置</a> -->
-            <dropdown class="auto">
-              <button type="button" data-toggle="dropdown">
-                <img :src="imgs.set" alt=""><span v-if="treeOrIcon">系统设置</span>
-              </button>
-              <ul slot="dropdown-menu" class="dropdown-menu dropdown-menu-up">
-                <li>系统信息及设置</li>
-                <!-- <li>{{name}}</li> -->
-                <li>{{ date }}</li>
-                <li @click="show=true">修改密码</li>
-                <li @click="AddChangeMsgShow=true">系统版本:1.0.0</li>
-              </ul>
-
-            </dropdown>
-            <a href="index.html" @click.prevent="logOut">
-              <img :src="imgs.out" alt=""><span v-if="treeOrIcon">退出系统</span>
-            </a>
-          </div>
-        </div>
-      </div>
-      <!-- <div class="line" id="line" v-show="treeOrIcon" v-el:line></div> -->
-
-      <div class="flex right-bg  system-right" id="bottom" v-el:bottom>
-        <!-- <operator-badge></operator-badge> -->
-        <div class="span">
-          <echarts-box v-if="$refs.mic.tabs.length === 0"></echarts-box>
-          <dynamic :comps='[]' name='main' :selecttab.sync="selecttab" :orgpathnames="orgpathnames"
-                   @tab-changed="tabChange" @tabscg="tabcg" v-ref:mic v-show="!($refs.mic.tabs.length === 0)"></dynamic>
-        </div>
-      </div>
-    </div>
-    <div v-show="isManger">
-      <route v-ref:route></route>
-    </div>
-
-    <!-- 变更录入 模态框 -->
-    <add-changemsg :show="AddChangeMsgShow" v-on:toggle="AddChangeMsgShow = false"></add-changemsg>
-    <!-- 修改密码组件 -->
-    <modify-pw :show.sync="show" v-if="show"></modify-pw>
-    <!-- 修改密码模态框 -->
-  </div>
-</template>
-
-<script>
-import vue from 'vue'
-import co from 'co'
-
-let getwartermakr = async function (self) {
-  let param = {
-    tablename: 't_singlevalue',
-    condition: " 1=1 and name=\'水印内容\'"
-  };
-  let result = await self.$resetpost('rs/sql/saleSingleTable', {data: param}, {resolveMsg: null, rejectMsg: null});
-  if (result && result.data.length > 0) {
-    self.showwatermakeflag = true;
-    createWaterMark(result.data[0].value);
-  } else {
-    self.showwatermakeflag = false;
-  }
-}
-
-let createWaterMark = function (userName) {
-  let style;
-  if (style) style.remove();
-  let width = window.parseInt(document.body.clientWidth);
-  let canvasWidth = width / window.parseInt(width / 320);
-  let fontFamily = window.getComputedStyle(document.body)["font-family"];
-  let canvas = document.createElement("canvas");
-  canvas.width = canvasWidth;
-  canvas.height = 200;
-  let ctx = canvas.getContext("2d");
-  ctx.rotate((-20 * Math.PI) / 180);
-  ctx.font = `20px ${fontFamily}`;
-  ctx.fillStyle = "rgba(8,8,8,.1)";
-  ctx.fillText(userName, 50, 200);
-  let imgSrc = canvas.toDataURL("image/png");
-  style = document.createElement("style");
-  style.innerHTML = `.with-watermark:before{
-        content: "";
-        width: 100%;
-        height: 100%;
-        display: block;
-        position: absolute;
-        background-image: url("${imgSrc}");
-    }`;
-  (document.head.append || document.head.appendChild).apply(document.head, [style]);
-}
-
-window.onunload = () => {
-  vue.http({url: `rs/user/update/${this.$login.f.ename}`, method: 'GET'})
-}
-window.onbeforeunload = () => {
-  vue.http({url: `rs/user/update/${this.$login.f.ename}`, method: 'GET'})
-}
-export default {
-  title: '主界面',
-  props: ['functions', 'userid'],
-  data() {
-    return {
-      // 左侧树下部三个小图标
-      imgs: {
-        open: '/images/lefticon/菜单伸缩.png',
-        set: '/images/lefticon/系统设置.png',
-        out: '/images/lefticon/退出系统.png',
-        img1: '/images/newStyle/login-user.png',
-        logoimg: '/static/newStyle/fife.png'
-        // img2: '/images/lefticon/退出系统.png',
-      },
-      treeOrIcon: false,
-      isManger: false,
-      show: false,
-      orgpathnames: `${this.$login.f.orgs}-${this.$login.f.deps}-${this.$login.f.name}`,
-      systemname: '客服系统',
-      date: this.$login.toStandardDateString(),
-      tabs: [],       //已初始化页签数组
-      selecttab: '',
-      setting: true,
-      srcsetting: '../../static/newStyle/setting.png',
-      showwatermakeflag: false,
-      // headerHint: true, // 右侧顶部提示信息
-      // value: 25645.26,
-      // AddChangeMsgShow: false,
-      // showsum: false
-    }
-  },
-  ready() {
-    getwartermakr(this);
-    let component = this.$login.getUrlCompileParames('component')
-    if (component) {
-      this.isManger = true
-      this.$refs.route.init(component, {data: this.functions.functions})
-    }
-    if (this.$login.f.password == '1') {
-      this.$showMessage('本地登录系统为此账户的初始密码，请确认修改密码！！！', ['confirm', 'cancel']).then((res) => {
-        if (res == 'confirm')
-          this.show = true
-      })
-    }
-    console.log("系统名称", this.$appdata.getSingleValue("系统名称"))
-    this.systemname = this.$appdata.getSingleValue("系统名称") ? this.$appdata.getSingleValue("系统名称") : '客服系统'
-    //   let oBox = this.getElement("box")
-    // 	let	oTop = this.getElement("top")
-    // 	let	oBottom = this.getElement("bottom")
-    // 	let oLine = this.getElement("line")
-    //   let that = this
-    // 			oLine.onmousedown = function(e) {
-    // 				let disX = (e || event).clientX
-    // 				oLine.left = oLine.offsetLeft
-    // 				document.onmousemove = function(e) {
-    // 					let iT = oLine.left + ((e || event).clientX - disX)
-    //           var e = e || window.event
-    // 					let tarnameb = e.target || e.srcElement
-    // 					let maxT = oBox.clientWight - oLine.offsetWidth
-    // 					oLine.style.margin = 0
-    // 					iT < 0 && (iT = 0)
-    // 					iT > maxT && (iT = maxT)
-    // 					oLine.style.left = oTop.style.width = iT + "px"
-    // 					oBottom.style.width = oBox.clientWidth - iT + "px"
-    //           that.$set('treeWidth', iT)
-    // 					return false
-    // 				}
-    // 				document.onmouseup = function() {
-    // 					document.onmousemove = null
-    // 					document.onmouseup = null
-    // 					oLine.releaseCapture && oLine.releaseCapture()
-    // 				}
-    // 				oLine.setCapture && oLine.setCapture()
-    // 				return false
-    // 			}
-    this.changeShow()
-  },
-  methods: {
-    hindsetting() {
-
-      this.setting = !this.setting
-      if (this.setting) {
-        this.srcsetting = '../../static/newStyle/setting.png'
-      } else {
-        this.srcsetting = '../../static/newStyle/setting1.png'
-      }
-
-    },
-    hindsetting1() {
-
-      if (!this.setting) {
-        this.srcsetting = '../../static/newStyle/setting.png'
-        this.setting = true
-      }
-
-    },
-    isnodo(val) {
-      console.log(val, 'ss')
-      this.selecttab = val
-    },
-    unfurl() {
-      if (this.showsum) {
-        this.showsum = false
-      } else {
-        this.showsum = true
-      }
-    },
-    // getElement(id) {
-    //   return document.getElementById(id)
-    // },
-    changeShow() {
-      //   this.treeOrIcon = !this.treeOrIcon
-      //   let oBox = this.getElement("box")
-      // 	let	oTop = this.getElement("top")
-      // 	let	oBottom = this.getElement("bottom")
-      // 	let oLine = this.getElement("line")
-      //   if (this.treeOrIcon) {
-      //     // oLine.style.left = oTop.style.width = 300 + "px"
-      //     oTop.style.width = 150 + "px"
-      //     oBottom.style.width = oBox.clientWidth - 150 + "px"
-      //   }else {
-      //     oLine.style.left = oTop.style.width = 50 + "px"
-      //     oBottom.style.width = oBox.clientWidth - 50 + "px"
-      //   }
-      // }
-      this.treeOrIcon = !this.treeOrIcon
-      // if (this.treeOrIcon) {
-      //   this.$els.top.style.width = 14 + "%"
-      //   this.$els.bottom.style.width = this.$els.box.clientWidth - 14 + "%"
-      // }else {
-      //   this.$els.top.style.width = 8 + "%"
-      //   this.$els.bottom.style.width = this.$els.box.clientWidth - 8 + "%"
-      // }
-    },
-    changeMain(userid) {
-      this.$goto('res-main', {userid: this.userid}, 'self')
-    },
-    tabChange(name) {
-      console.log(name, 'tabchanage')
-      this.selecttab = name
-      this.$refs.tree.changeSelect(name)
-    },
-    tabcg(val) {
-      console.log(val)
-      this.tabs = val
-    },
-    logOut() {
-      console.log(this.$login.f)
-      this.$showMessage('您确定要退出系统吗？', ['confirm', 'cancel']).then(async (res) => {
-        if (res == 'confirm') {
-          let data = {
-            userid: this.$login.f.id,
-            username: this.$login.f.name,
-            usertelephone: this.$login.f.f_user_telephone
-          }
-          await this.$resetpost('rs/logic/logOut', data, {resolveMsg: '退出成功', rejectMsg: null})
-          window.location.reload()
-        }
-      })
-    }
-  },
-  computed: {
-    nowDate() {
-      return this.$login.getNowDate()
-    }
-  }
-}
-</script>
-<style lang="less">
-/* 组件内通用样式 */
-.select-error {
-  button {
-    border-bottom: 1px solid #a94442 !important;
-  }
-}
-
-// input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{
-//       -webkit-appearance:textfield;
-// }
-/* 表单输入框组 */
-.form-input-group {
-  display: flex;
-
-  label {
-    width: 100px;
-    text-align: right;
-
-    + * {
-      flex: 1;
-    }
-  }
-}
-
-// 日期组件在表单中沾满
-.form-horizontal .datepicker {
-  width: 100%;
-}
-
-// 下拉选择框占据剩余全部空间
-.select-overspread {
-  .form-group {
-    // margin: 0px 5px 10px 0px;
-    .form-control {
-      margin-right: 0px;
-    }
-  }
-
-  .btn-group, .btn-group-vertical {
-    width: 100%;
-    // padding-right: 5px;
-    button {
-      width: 100%;
-      display: flex;
-      justify-content: space-between;
-      align-items: center;
-    }
-  }
-
-  .dropdown-menu {
-    width: 100%
-  }
-}
-
-// 需要特定宽度的的样式
-.width-60 {
-  width: 60px;
-}
-
-.userpanel {
-  font-weight: 300;
-  color: #333;
-  position: fixed;
-  right: 30px;
-  top: 45px;
-  background-color: white;
-  box-shadow: darkgrey 0.5px 0.5px 0.5px 0.5px;
-  padding: 4px 10px 4px 10px;
-  border-radius: 2px;
-}
-
-.width-80 {
-  width: 80px;
-}
-
-.width-100 {
-  width: 100px;
-}
-
-
-/*右侧区域的背景*/
-.right-bg {
-  width: 100%;
-  flex: 1;
-  color: #304A66;
-}
-
-.tree-flex {
-  height: 100%;
-  // width: 150px;
-  /*width: 60px;*/
-  background: #4a7cae;
-  color: #fff;
-
-}
-
-.tree-flex-icon {
-  width: 50px;
-  /*transition: 0.5s;*/
-
-  > .span {
-    overflow-x: visible;
-  }
-}
-
-.tree-flex h3 {
-  text-align: center;
-  margin: 1em 0;
-}
-
-.tree-flex-footer {
-  height: 50px;
-  display: flex;
-  flex-direction: column;
-  color: #fff;
-}
-
-.tree-flex-footer a, .tree-flex-footer button {
-  flex: 1;
-  padding: 8px 5px;
-  font-size: 1.2em;
-  // border-top: 1px solid #697D93;
-  border-top: 1px solid #4a7cae;
-  text-decoration: none;
-  color: #fff;
-  cursor: pointer;
-}
-
-.tree-flex-footer button {
-  height: auto;
-  width: 100%;
-  border-radius: 0px;
-  background-color: rgba(255, 255, 255, 0);
-  border: none;
-  border-top: 1px solid #4a7cae;
-  // border-top: 1px solid #697D93;
-  text-align: left;
-}
-
-.tree-flex-footer button:hover {
-  outline: none;
-  background-color: rgba(255, 255, 255, 0.2);
-}
-
-.tree-flex-footer button:focus {
-  outline: none;
-  background-color: rgba(255, 255, 255, 0.5);
-}
-
-.tree-flex-footer a:hover {
-  color: #FFF;
-  background-color: rgba(255, 255, 255, 0.2);
-}
-
-.tree-flex .btn-group {
-  height: 50px !important;
-}
-
-.tree-flex .dropdown-menu {
-  /* 控制显示列表的样式 */
-  background: #4a7cae;
-  border-radius: 0px;
-  color: #fff;
-  width: auto;
-  margin: 0px;
-  padding: 0px;
-}
-
-.tree-flex .dropdown-menu-up {
-  /* bottom，top控制上下，left和right控制左右*/
-  left: 100% !important;
-  top: auto !important;
-  bottom: 0;
-}
-
-.tree-flex .dropdown-menu-down {
-  /* bottom，top控制上下，left和right控制左右*/
-  left: 100% !important;
-  top: 0 !important;
-}
-
-.tree-flex .dropdown-menu li {
-  text-align: center;
-  line-height: 50px;
-  border-bottom: 1px solid #697D93;
-  font-size: 1.2em;
-  width: auto;
-  white-space: nowrap;
-  cursor: default;
-
-}
-
-.tree-flex .dropdown-menu li + li {
-  text-align: left;
-  border: 0;
-  line-height: 40px;
-  padding-left: 15px;
-  padding-right: 15px;
-  font-size: 1em;
-  cursor: pointer;
-}
-
-.tree-flex .dropdown-menu li + li:hover {
-  background-color: rgba(255, 255, 255, 0.2);
-}
-
-.tree-flex .dropdown-menu li a {
-  border: none;
-  color: #fff;
-  height: 40px;
-  line-height: 40px;
-  font-size: 1em;
-  padding: 0px;
-}
-
-.tree-flex .dropdown-menu li a:hover {
-  color: #fff;
-  background-color: rgba(255, 255, 255, 0);
-}
-
-.tree-flex img {
-  height: 1.2em;
-  width: 1.2em;
-  margin-right: 15px;
-  margin-left: 5px;
-}
-
-.line {
-  height: 100%;
-  width: 5px;
-  background: #4C637B;
-  cursor: e-resize;
-}
-
-/*为树（tree）组件写的样式*/
-.tree-img {
-  font-size: 1.2em;
-}
-
-/*将较长信息截断显示，鼠标悬停显示全部信息*/
-.cutout50 {
-  max-width: 50px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-/* 滚动条样式 */
-/*---滚动条默认显示样式--*/
-::-webkit-scrollbar-thumb {
-  //  display: none;
-  background-color: rgba(0, 0, 0, 0.4);
-  /*background-color:red;*/
-  height: 50px;
-  outline-offset: -2px;
-  /*outline:2px solid #fff;*/
-  -webkit-border-radius: 4px;
-  /*border: 2px solid #fff;*/
-}
-
-/*---鼠标点击滚动条显示样式--*/
-::-webkit-scrollbar-thumb:hover {
-  //  display: inherit;
-  background-color: rgba(0, 0, 0, 0.4);
-  height: 50px;
-  -webkit-border-radius: 4px;
-}
-
-/*---滚动条大小--*/
-::-webkit-scrollbar {
-  width: 8px;
-  height: 8px;
-}
-
-/*---滚动框背景样式--*/
-::-webkit-scrollbar-track-piece {
-  /* 全透明，不显示 */
-  background-color: rgba(255, 255, 255, 0);
-  -webkit-border-radius: 0;
-}
-</style>
+<template>
+  <div @click="hindsetting1()">
+
+    <div class='flex-row  system-main' id="box" v-el:box v-if="!isManger">
+
+      <div class="auto "  :class="{'login-operator1':$refs.mic.tabs.length === 0,'login-operator':$refs.mic.tabs.length != 0}">
+          <span class="glyphicon glyphicon-asterisk" style="color:#a1d0f5"></span>
+          <span>组织编码:</span>
+         <label style="margin-right:14px;">{{$login.f.number}}</label>
+          <span class="glyphicon glyphicon-user"  style="color:#a1d0f5"></span>
+          <span>登录人：</span>
+          <label>{{orgpathnames}}</label>
+      </div>
+      <div class="system-left tree-flex" :class="{'tree-flex-icon': !treeOrIcon}" id="top" v-el:top >
+        <div class="system-left-chi" :class="{'system-left-icon': !treeOrIcon}"  >
+          <div class="span system-left-tree " style="height:85%">
+            <div class="logopicaode"  >
+              <div  class="aodeloginedlogo"></div>
+            </div>
+            <h3 style="margin-bottom: 12px;height: 35px;">&nbsp;&nbsp;</h3>
+            <!--            <div class="span" style="margin-bottom:10px;padding-bottom:5px;padding-top:5px;flex: 1;border-top: 1px solid #e5e5e5;border-bottom: 1px solid #e5e5e5;">-->
+            <left-tree :functions='functions.functions' :userid='userid' @isnodo="isnodo" v-show="treeOrIcon" :tabs="tabs" v-ref:tree></left-tree>
+          </div>
+
+          <div class="tree-flex-footer">
+            <!--            <a @click="changeShow()"><img :src="imgs.open" alt=""><span v-if="treeOrIcon">菜单伸缩</span></a>-->
+            <!-- <a><img src="../../../static/treeset.png" alt="">系统设置</a> -->
+            <dropdown class="auto">
+              <button type="button" data-toggle="dropdown">
+                <img :src="imgs.set" alt=""><span v-if="treeOrIcon">系统设置</span>
+              </button>
+              <ul slot="dropdown-menu" class="dropdown-menu dropdown-menu-up">
+                <li>系统信息及设置</li>
+                <!-- <li>{{name}}</li> -->
+                <li>{{date}}</li>
+                <li @click="show=true">修改密码</li>
+                <li @click="clearCache">清除缓存</li>
+                <li @click="AddChangeMsgShow=true">系统版本:1.0.0</li>
+              </ul>
+
+            </dropdown>
+            <a href="index.html" @click.prevent="logOut">
+              <img :src="imgs.out" alt="" ><span v-if="treeOrIcon">退出系统</span>
+            </a>
+          </div>
+        </div>
+      </div>
+      <!-- <div class="line" id="line" v-show="treeOrIcon" v-el:line></div> -->
+
+      <div class="flex right-bg  system-right" id="bottom" v-el:bottom>
+        <!-- <operator-badge></operator-badge> -->
+        <div class="span">
+          <echarts-box v-if="$refs.mic.tabs.length === 0"></echarts-box>
+          <dynamic :comps='[]' name='main' :selecttab.sync="selecttab" @tab-changed="tabChange" @tabscg="tabcg" v-ref:mic v-show="!($refs.mic.tabs.length === 0)"></dynamic>
+        </div>
+      </div>
+    </div>
+    <div v-show="isManger">
+      <route  v-ref:route></route>
+    </div>
+
+    <!-- 变更录入 模态框 -->
+    <add-changemsg :show="AddChangeMsgShow" v-on:toggle = "AddChangeMsgShow = false"></add-changemsg>
+    <!-- 修改密码组件 -->
+    <modify-pw :show.sync="show" v-if="show"></modify-pw>
+    <!-- 修改密码模态框 -->
+  </div>
+</template>
+
+<script>
+  import vue from 'vue'
+  import co from 'co'
+
+  window.onunload = () => {
+    vue.http({url: `rs/user/update/${this.$login.f.ename}`, method: 'GET'})
+  }
+  window.onbeforeunload = () => {
+    vue.http({url: `rs/user/update/${this.$login.f.ename}`, method: 'GET'})
+  }
+  export default {
+    title: '主界面',
+    props: ['functions', 'userid'],
+    data () {
+      return {
+        // 左侧树下部三个小图标
+        imgs: {
+          open: '/images/lefticon/菜单伸缩.png',
+          set: '/images/lefticon/系统设置.png',
+          out: '/images/lefticon/退出系统.png',
+          img1: '/images/newStyle/login-user.png',
+          logoimg: '/static/newStyle/fife.png'
+          // img2: '/images/lefticon/退出系统.png',
+        },
+        treeOrIcon: false,
+        isManger: false,
+        show: false,
+        orgpathnames: `${this.$login.f.orgs}-${this.$login.f.deps}-${this.$login.f.name}`,
+        systemname: '客服系统',
+        date: this.$login.toStandardDateString(),
+        tabs:[],       //已初始化页签数组
+        selecttab:'',
+        setting:true,
+        srcsetting:'../../static/newStyle/setting.png'
+
+        // headerHint: true, // 右侧顶部提示信息
+        // value: 25645.26,
+        // AddChangeMsgShow: false,
+        // showsum: false
+      }
+    },
+    ready () {
+      let component = this.$login.getUrlCompileParames('component')
+      if (component) {
+        this.isManger = true
+        this.$refs.route.init(component, {data: this.functions.functions})
+      }
+      if(this.$login.f.password == '1'){
+        this.$showMessage('本地登录系统为此账户的初始密码，请确认修改密码！！！', ['confirm', 'cancel']).then((res) => {
+          if(res == 'confirm')
+            this.show = true
+        })
+      }
+      console.log("系统名称",this.$appdata.getSingleValue("系统名称"))
+      this.systemname = this.$appdata.getSingleValue("系统名称")? this.$appdata.getSingleValue("系统名称"):'客服系统'
+      //   let oBox = this.getElement("box")
+      // 	let	oTop = this.getElement("top")
+      // 	let	oBottom = this.getElement("bottom")
+      // 	let oLine = this.getElement("line")
+      //   let that = this
+      // 			oLine.onmousedown = function(e) {
+      // 				let disX = (e || event).clientX
+      // 				oLine.left = oLine.offsetLeft
+      // 				document.onmousemove = function(e) {
+      // 					let iT = oLine.left + ((e || event).clientX - disX)
+      //           var e = e || window.event
+      // 					let tarnameb = e.target || e.srcElement
+      // 					let maxT = oBox.clientWight - oLine.offsetWidth
+      // 					oLine.style.margin = 0
+      // 					iT < 0 && (iT = 0)
+      // 					iT > maxT && (iT = maxT)
+      // 					oLine.style.left = oTop.style.width = iT + "px"
+      // 					oBottom.style.width = oBox.clientWidth - iT + "px"
+      //           that.$set('treeWidth', iT)
+      // 					return false
+      // 				}
+      // 				document.onmouseup = function() {
+      // 					document.onmousemove = null
+      // 					document.onmouseup = null
+      // 					oLine.releaseCapture && oLine.releaseCapture()
+      // 				}
+      // 				oLine.setCapture && oLine.setCapture()
+      // 				return false
+      // 			}
+      this.changeShow()
+    },
+    methods: {
+      hindsetting(){
+
+        this.setting=!this.setting
+        if(this.setting){
+          this.srcsetting='../../static/newStyle/setting.png'
+        }else {
+          this.srcsetting='../../static/newStyle/setting1.png'
+        }
+
+      },
+      hindsetting1(){
+
+        if(!this.setting){
+          this.srcsetting='../../static/newStyle/setting.png'
+          this.setting=true
+        }
+
+      },
+      isnodo(val){
+        console.log(val,'ss')
+        this.selecttab = val
+      },
+      unfurl () {
+        if(this.showsum){
+          this.showsum = false
+        } else {
+          this.showsum = true
+        }
+      },
+      // getElement(id) {
+      //   return document.getElementById(id)
+      // },
+      changeShow () {
+        //   this.treeOrIcon = !this.treeOrIcon
+        //   let oBox = this.getElement("box")
+        // 	let	oTop = this.getElement("top")
+        // 	let	oBottom = this.getElement("bottom")
+        // 	let oLine = this.getElement("line")
+        //   if (this.treeOrIcon) {
+        //     // oLine.style.left = oTop.style.width = 300 + "px"
+        //     oTop.style.width = 150 + "px"
+        //     oBottom.style.width = oBox.clientWidth - 150 + "px"
+        //   }else {
+        //     oLine.style.left = oTop.style.width = 50 + "px"
+        //     oBottom.style.width = oBox.clientWidth - 50 + "px"
+        //   }
+        // }
+        this.treeOrIcon = !this.treeOrIcon
+        // if (this.treeOrIcon) {
+        //   this.$els.top.style.width = 14 + "%"
+        //   this.$els.bottom.style.width = this.$els.box.clientWidth - 14 + "%"
+        // }else {
+        //   this.$els.top.style.width = 8 + "%"
+        //   this.$els.bottom.style.width = this.$els.box.clientWidth - 8 + "%"
+        // }
+      },
+      changeMain(userid) {
+        this.$goto('res-main', {userid: this.userid}, 'self')
+      },
+      tabChange (name) {
+        console.log(name,'tabchanage')
+        this.selecttab = name
+        this.$refs.tree.changeSelect(name)
+      },
+      tabcg(val){
+        console.log(val)
+        this.tabs = val
+      },
+      logOut () {
+        console.log(this.$login.f)
+        this.$showMessage('您确定要退出系统吗？', ['confirm', 'cancel']).then(async (res) => {
+          if (res == 'confirm') {
+            let data = {
+              userid: this.$login.f.id,
+              username: this.$login.f.name,
+              usertelephone: this.$login.f.f_user_telephone
+            }
+            try {
+              await this.$resetget('api/af-system/user/logout', {resolveMsg: '退出成功', rejectMsg: null})
+            }catch(e){
+            }
+            window.location.reload()
+          }
+        })
+      },
+      clearCache() {
+        this.$resetpost('/rs/search/clearCache', { userid: this.$login.f.id }, { resolveMsg: '清除缓存成功', rejectMsg: '清除缓存失败，请重试' })
+      }
+    },
+    computed: {
+      nowDate () {
+        return this.$login.getNowDate()
+      }
+    }
+  }
+</script>
+<style lang="less">
+  /* 组件内通用样式 */
+  .select-error {
+    button {
+      border-bottom: 1px solid #a94442!important;
+    }
+  }
+  // input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{
+  //       -webkit-appearance:textfield;
+  // }
+  /* 表单输入框组 */
+  .form-input-group {
+    display: flex;
+
+    label {
+      width: 100px;
+      text-align: right;
+      + * {
+        flex: 1;
+      }
+    }
+  }
+  // 日期组件在表单中沾满
+  .form-horizontal .datepicker {
+    width: 100%;
+  }
+  // 下拉选择框占据剩余全部空间
+  .select-overspread {
+    .form-group {
+      // margin: 0px 5px 10px 0px;
+      .form-control {
+        margin-right: 0px;
+      }
+    }
+    .btn-group, .btn-group-vertical {
+      width: 100%;
+      // padding-right: 5px;
+      button {
+        width: 100%;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+      }
+    }
+    .dropdown-menu {
+      width: 100%
+    }
+  }
+  // 需要特定宽度的的样式
+  .width-60 {
+    width: 60px;
+  }
+  .userpanel {
+    font-weight: 300;
+    color: #333;
+    position: fixed;
+    right: 30px;
+    top: 45px;
+    background-color: white;
+    box-shadow: darkgrey 0.5px 0.5px 0.5px 0.5px ;
+    padding: 4px 10px 4px 10px;
+    border-radius:2px;
+  }
+  .width-80 {
+    width: 80px;
+  }
+  .width-100 {
+    width: 100px;
+  }
+
+
+
+  /*右侧区域的背景*/
+  .right-bg {
+    width: 100%;
+    flex: 1;
+    color: #304A66;
+  }
+  .tree-flex {
+    height: 100%;
+    // width: 150px;
+    /*width: 60px;*/
+    background: #4a7cae;
+    color: #fff;
+
+  }
+  .tree-flex-icon {
+    width: 50px;
+    /*transition: 0.5s;*/
+    > .span {
+      overflow-x: visible;
+    }
+  }
+  .tree-flex h3 {
+    text-align: center;
+    margin: 1em 0;
+  }
+
+  .tree-flex-footer {
+    height: 50px;
+    display: flex;
+    flex-direction:column;
+    color: #fff;
+  }
+  .tree-flex-footer a,.tree-flex-footer button{
+    flex: 1;
+    padding: 8px 5px;
+    font-size: 1.2em;
+    // border-top: 1px solid #697D93;
+    border-top: 1px solid #4a7cae;
+    text-decoration: none;
+    color: #fff;
+    cursor: pointer;
+  }
+  .tree-flex-footer button {
+    height: auto;
+    width: 100%;
+    border-radius: 0px;
+    background-color: rgba(255,255,255,0);
+    border: none;
+    border-top: 1px solid #4a7cae;
+    // border-top: 1px solid #697D93;
+    text-align: left;
+  }
+  .tree-flex-footer button:hover{
+    outline: none;
+    background-color: rgba(255,255,255,0.2);
+  }
+  .tree-flex-footer button:focus {
+    outline: none;
+    background-color: rgba(255,255,255,0.5);
+  }
+  .tree-flex-footer a:hover {
+    color: #FFF;
+    background-color: rgba(255,255,255,0.2);
+  }
+  .tree-flex  .btn-group {
+    height: 50px!important;
+  }
+
+  .tree-flex .dropdown-menu {
+    /* 控制显示列表的样式 */
+    background: #4a7cae;
+    border-radius: 0px;
+    color: #fff;
+    width: auto;
+    margin: 0px;
+    padding: 0px;
+  }
+  .tree-flex .dropdown-menu-up {
+    /* bottom，top控制上下，left和right控制左右*/
+    left: 100%!important;
+    top: auto!important;
+    bottom: 0;
+  }
+  .tree-flex .dropdown-menu-down {
+    /* bottom，top控制上下，left和right控制左右*/
+    left: 100%!important;
+    top: 0!important;
+  }
+  .tree-flex .dropdown-menu li{
+    text-align: center;
+    line-height: 50px;
+    border-bottom: 1px solid #697D93;
+    font-size: 1.2em;
+    width: auto;
+    white-space: nowrap;
+    cursor: default;
+
+  }
+  .tree-flex .dropdown-menu li + li {
+    text-align: left;
+    border: 0;
+    line-height: 40px;
+    padding-left: 15px;
+    padding-right: 15px;
+    font-size: 1em;
+    cursor: pointer;
+  }
+  .tree-flex .dropdown-menu li + li:hover {
+    background-color: rgba(255,255,255,0.2);
+  }
+  .tree-flex .dropdown-menu li a {
+    border: none;
+    color: #fff;
+    height: 40px;
+    line-height: 40px;
+    font-size: 1em;
+    padding: 0px;
+  }
+  .tree-flex .dropdown-menu li a:hover {
+    color: #fff;
+    background-color: rgba(255,255,255,0);
+  }
+  .tree-flex img{
+    height: 1.2em;
+    width: 1.2em;
+    margin-right: 15px;
+    margin-left: 5px;
+  }
+  .line {
+    height: 100%;
+    width: 5px;
+    background: #4C637B;
+    cursor: e-resize;
+  }
+  /*为树（tree）组件写的样式*/
+  .tree-img {
+    font-size: 1.2em;
+  }
+  .aodeloginedlogo {
+    background:url(../../static/aodenewlogo.png);
+    background-size:80%;
+    background-repeat: no-repeat;
+  }
+  .logopicaode{
+    width: 100%;
+    height: 61px;
+    float: left;
+    margin-left: 2.5%;
+    margin-top: 10px;
+  }
+
+  /*将较长信息截断显示，鼠标悬停显示全部信息*/
+  .cutout50 {
+    max-width: 50px;
+    overflow:hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  /* 滚动条样式 */
+  /*---滚动条默认显示样式--*/
+  ::-webkit-scrollbar-thumb{
+    //  display: none;
+    background-color:rgba(0,0,0,0.4);
+    /*background-color:red;*/
+    height:50px;
+    outline-offset:-2px;
+    /*outline:2px solid #fff;*/
+    -webkit-border-radius:4px;
+    /*border: 2px solid #fff;*/
+  }
+
+  /*---鼠标点击滚动条显示样式--*/
+  ::-webkit-scrollbar-thumb:hover{
+    //  display: inherit;
+    background-color:rgba(0,0,0,0.4);
+    height:50px;
+    -webkit-border-radius:4px;
+  }
+  /*---滚动条大小--*/
+  ::-webkit-scrollbar{
+    width:8px;
+    height:8px;
+  }
+  /*---滚动框背景样式--*/
+  ::-webkit-scrollbar-track-piece{
+    /* 全透明，不显示 */
+    background-color:rgba(255,255,255,0);
+    -webkit-border-radius:0;
+  }
+</style>