apply-clients 3.0.4 → 3.0.5-4

package/src/components/product/Process/MaterialUseList.vue

@@ -0,0 +1,159 @@
+<template>
+  <div id='app'class="flex bg-white p-10 datapanel" >
+    <criteria-paged :model="model" :pager='false'>
+      <criteria partial='criteria' @condition-changed='search'>
+        <div novalidate class="form-inline auto" partial>
+          <div class="form-group">
+            <div class="form-group">
+            <label class="control-label">分公司:</label>
+            <!--<right-tree :userid.sync='$parent.$parent.userid' :source.sync='$parent.$parent.source' @re-res="$parent.$parent.getRes" ></right-tree>
+            -->  <v-select :value.sync="model.f_filiale" v-model="model.f_filiale"
+                        :options='$parent.$parent.filiale' placeholder='请选择'
+                        close-on-select>
+              </v-select>
+            </div>
+            <div class="form-group">
+              <label class="control-label">报建编号:</label>
+              <!--<right-tree :userid.sync='$parent.$parent.userid' :source.sync='$parent.$parent.source' @re-res="$parent.$parent.getRes" ></right-tree>
+              -->  <v-select :value.sync="model.f_apply_num" v-model="model.f_apply_num"
+                           :options='$parent.$parent.appnum' placeholder='请选择'
+                           close-on-select search="">
+            </v-select>
+            </div>
+            <div class="form-group">
+              <label for="startDate" class="control-label">开始日期:</label>
+            <datepicker id="startDate" placeholder="开始日期"
+                        v-model="model.startDate"
+                        :value.sync="model.startDate"
+                        :disabled-days-of-Week="[]"
+                        :format="'yyyy-MM-dd'"
+                        :show-reset-button="reset">
+            </datepicker></div>
+            <div class="form-group" class="control-label">
+            <label for="endDate">结束日期:</label>
+            <datepicker id="endDate" placeholder="结束日期"
+                        v-model="model.endDate"
+                        :value.sync="model.endDate"
+                        :disabled-days-of-Week="[]"
+                        :format="'yyyy-MM-dd'"
+                        :show-reset-button="reset">
+            </datepicker></div>
+            <div class="form-group">
+              <button class="button_search button_spacing" @click="search()">查询</button>
+            <report-print class="button_new button_spacing"  id='shexian' top='1cm' left='1cm' width='100%' height='100%'></report-print>
+            <report-excel class="button_export button_spacing"  id='shexian'></report-excel></div>
+          </div>
+        </div>
+      </criteria>
+      <div partial='list' id='shexian'>
+        <table class='tableprint' style="margin: 0px auto">
+          <thead>
+          <tr>
+            <th colspan='5' style="font-weight: normal; text-align: left;">
+              <h3 style="text-align: center">报建实用材料报表</h3>
+            </th>
+          </tr>
+          <tr>
+            <th colspan='5' style="font-weight: normal; text-align: center;">
+              开始时间：{{model.model.startDate}}&nbsp;&nbsp;&nbsp;
+              结束时间：{{ model.model.endDate }}
+              报建编号：{{ model.applynum }}
+            </th>
+          </tr>
+          </thead>
+          <tr>
+            <th  colspan='5' style="font-weight: normal;">
+              {{{ model.data.substring(26,model.data.length-8) }}}
+            </th>
+          </tr>
+        </table>
+      </div>
+    </criteria-paged>
+  </div>
+
+</template>
+
+<script>
+  import { DataModel } from 'vue-client'
+
+  export default {
+    title: '报表',
+    data () {
+
+      let model =  new DataModel('rs/report/materialReport',{startDate: 'this.model.startDate', endDate: 'this.model.endDate',f_filiale: 'this.fengongsi',f_apply_num:'this.applynum'})
+      model.f_subcompany = '',
+        model.fengongsi = '',
+        model.applynum = ''
+      return {
+        filialeNameStr:'',
+        filialeCodeStr:'',
+        userid: this.$login.f.id,
+        source: `tool.getFullTree(this.getRights().where(row.getType() != $zone$).where(row.getType() == $organization$))`,
+        model:model,
+        filiale:[],
+        appnum:[]
+
+      }
+    },
+    methods: {
+      // 获取组织结构
+      getRes(obj) {
+        console.log(obj,'se')
+        let fengongsi=obj.res.toString().split('.')
+        console.log(fengongsi,'se')
+        console.log(fengongsi[fengongsi.length-1],'se')
+        this.model.f_subcompany = obj.res
+        console.log(this.model,'se')
+        // this.model.filialeCodeStr = obj.resids
+        // this.model.filialeCodeStr = this.model.filialeCodeStr.replace(/\./g, '')
+      },
+      gethuman(){
+        console.log('获取人员')
+        this.$resetpost('rs/logic/getMaterialItem', {data: {condition: `1=1`}}, {resolveMsg: null, rejectMsg: null}).then((res) => {
+          // this.params.rows.splice(index, 1)
+          console.log('获取成功',res)
+
+          let house2 = []
+          for (let row of res.data.f){
+            house2.push({label: row.f_filiale,value: row.f_filiale})
+          }
+          this.filiale = house2
+          let house3 = [
+            {label:'全部',value:''}
+          ]
+          for (let row of res.data.appnum){
+            house3.push({label: row.f_apply_num,value: row.f_apply_num})
+          }
+          this.appnum = house3
+        })
+
+      },
+    },
+    ready(){
+      this.gethuman()
+    },
+    computed: {
+      selected() {
+        return this.$refs.grid.selected
+      },
+      // outlets () {
+      //   return [{label: '全部', value: ''}, ...AppData.getParam('营业网点')]
+      // },
+      // operator () {
+      //   return [{label: '全部', value: ''}, ...AppData.getParam('操作员')]
+      // }
+    },
+    watch :{
+      'model.model.f_filiale[0]'(val){
+
+          this.model.fengongsi = val
+
+
+      },
+      'model.model.f_apply_num[0]'(val){
+          this.model.applynum = val
+
+      },
+    }
+  }
+</script>

package/src/components/product/Process/ModifyUserFiles.vue

@@ -95,7 +95,7 @@
               <td style="text-align: center;">
                 <!-- <td style="text-align: center;" v-show= "$parent.$parent.$parent.jurisdiction.includes('档案修正权限')"> -->
                 <button type="button" name="button" class="btn btn-link" v-if="row.f_user_state === '正常'"
-                        @click.stop="$parent.$parent.$parent.modifyinfo(row)">改装</button>
+                        @click.stop="$parent.$parent.$parent.modifyinfo(row)">登记</button>
               </td>
             </template>
           </data-grid>
@@ -137,8 +137,9 @@
 
 <script>
 
-  import { PagedList } from 'vue-client'
+  import {HttpResetClass, PagedList} from 'vue-client'
   import Vue from 'vue'
+  import * as Util from "../../Util";
 
   let loadParamGem = async function (self) {
     console.log('获取登录信息，', self.$login, self.$appdata, self.$appdata.getParam('用户类型'), Vue.$login.f.name)
@@ -153,7 +154,7 @@
     'title': '用户档案',
     data () {
       return {
-        model: new PagedList('rs/sql/singleTable_OrderBy', 30, {items: '"*"', tablename: '"t_userinfo"', orderitem: '"CONVERT(int,f_userinfo_id)  desc"'}),
+        model: new PagedList('rs/sql/singleTable_OrderBy', 30, {items: '"*"', tablename: '"t_userinfo"', orderitem: '"f_userinfo_id desc"'}),
         row: null, // 选择一条用户信息，对其进行修改
         arearow: null, // 新建修改小区使用的数据小区使用
         areainfo: null, // 小区批量建档使用的数据
@@ -194,7 +195,15 @@
       search () {
         this.$refs.paged.$refs.criteria.search()
       },
-      modifyinfo (row) {
+      async modifyinfo (row) {
+        console.log('row:',row)
+        let http = new HttpResetClass()
+        let res = await http.load('POST','rs/logic/ApplyGetProcessID',{data:{filename:this.$workflow_vue.workflow_xmlfilename,start_activity:this.$workflow_vue.start_activity}}, {resolveMsg: null, rejectMsg: '获取流程ID失败，请联系开发人员'})
+        row.f_process_id = res.data.f_process_id
+        row.defname= this.$workflow_vue.start_activity
+        row.f_apply_date=Util.toStandardTimeString()
+        // row.f_apply_num= this.generateUUID()
+        row.f_apply_operator_telephone= this.$login.f.f_fgsdianhua
         this.$parent.show = true
         this.$parent.$refs.queryuser.addactive(row)
       },
@@ -280,7 +289,8 @@
         this.model.rows.unshift(data)
       },
       selfSearch (args) {
-        args.condition = `${args.condition} and f_filialeids  = '${this.$login.f.f_orgids}'`
+        // args.condition = `${args.condition} and f_filialeids  = '${this.$login.f.f_orgids}'`
+        args.condition = `${args.condition}`
         this.model.search(args.condition, args.model)
       },
       bulkOperations (name, type) {

package/src/components/product/Process/ProcessInfo/history_control.vue

@@ -1,16 +1,16 @@
 <template>
-  <div class="auto" style="padding-right:5px; padding-top: 10px;">
+  <div class="auto" style="padding-right:5px; padding-top: 10px;" v-if="refreshed">
     <validator name="v">
 
       <div v-for="(index,item) in data" class="panel" v-bind:class="{'panel-default': showpanl[index].showdef, ' panel-info ' : showpanl[index].showinfo}">
         <div :class="{'panel-heading  background-default':showpanl[index].show,'panel-heading':!showpanl[index].show}" @click ="hello(index)">
-          <h3 class="panel-title">{{item.title}}信息:{{item.person}}<span class="pull-right  glyphicon" v-bind:class="{'glyphicon-chevron-right': showpanl[index].show, 'glyphicon-chevron-down' : showpanl[index].hasError}"></span></h3>
+          <h3 class="panel-title">{{item.title}}信息<span class="pull-right  glyphicon" v-bind:class="{'glyphicon-chevron-right': showpanl[index].show, 'glyphicon-chevron-down' : showpanl[index].hasError}"></span></h3>
         </div>
         <div class="panel-body" v-if="showpanl[index].hasError">
           <div class="col-sm-12">
             <div v-for="(index2,row) in item.fields">
-              <span v-if="row.hasOwnProperty('field')" class="col-sm-6">{{item.fields[index2].label}}：{{item.fields[index2].value}}</span>
-              <span v-else class="col-sm-6" v-for="(index3,arr) in row.items">{{arr.label}}：{{arr.value?'是':'否'}}</span>
+              <span v-if="row.hasOwnProperty('field')" class="col-sm-12">{{item.fields[index2].label}}：{{item.fields[index2].value}}</span>
+              <span v-else class="col-sm-12" v-for="(index3,arr) in row.items">{{arr.label}}：{{arr.value?'是':'否'}}</span>
             </div>
           </div>
         </div>
@@ -27,6 +27,7 @@
       return {
         data:null,
         defnames:null,
+        refreshed:true,
         showpanl:[]
       }
     },
@@ -40,7 +41,7 @@
           // 配置文件title循环
           for(let j = 0;j<this.$workflow_vue.activitys.length;j++){
             if(this.defnames[i].defname===this.$workflow_vue.activitys[j].title){
-              let temp = this.$workflow_vue.activitys[j]
+              let temp = JSON.parse(JSON.stringify(this.$workflow_vue.activitys[j]))
               if(this.defnames[i].hasOwnProperty('person')){
                 temp.person = this.defnames[i].person
               }
@@ -53,20 +54,48 @@
         for(let i=0;i<tempArray.length;i++){
           for(let j = 0;j<tempArray[i].fields.length;j++){
             if(tempArray[i].fields[j].hasOwnProperty('field')){
-              tempArray[i].fields[j].value = this.selectdata[tempArray[i].fields[j].field]
+              if((tempArray[i].fields[j].label=='项目预算金额' ||
+                tempArray[i].fields[j].label=='设计费成本' ||
+                tempArray[i].fields[j].label=='材料预算成本' ||
+                tempArray[i].fields[j].label=='施工预算成本' ||
+                tempArray[i].fields[j].label=='探伤预算成本' ||
+                tempArray[i].fields[j].label=='检测预算成本' ||
+                tempArray[i].fields[j].label=='其他预算成本' ||
+                tempArray[i].fields[j].label=='首付'||
+                tempArray[i].fields[j].label=='进度款'||
+                tempArray[i].fields[j].label=='尾款' ) && this.$login.f.f_parentname !== '市场部'){
+                tempArray[i].fields[j].value = '隐藏数据'
+              }else{
+                tempArray[i].fields[j].value = this.selectdata[tempArray[i].fields[j].field]
+              }
+
             }else if(tempArray[i].fields[j].hasOwnProperty('items')){
               for(let k = 0;k<tempArray[i].fields[j].items.length;k++){
                 tempArray[i].fields[j].items[k].value = this.selectdata[tempArray[i].fields[j].items[k].field]
               }
             }
+            if(tempArray[i].fields[j].value&&typeof tempArray[i].fields[j].value =='string'&&tempArray[i].fields[j].value.startsWith('{')&&tempArray[i].fields[j].value.endsWith('}')){
+              let temp = JSON.parse(tempArray[i].fields[j].value)
+              tempArray[i].fields[j].value = temp.name
+            }
           }
         }
         this.data = tempArray
+        this.refreshed =false
+        this.$nextTick(()=>{
+          this.refreshed =true
+          this.hello(9999999)
+        })
       },
       hello (index) {
         if (!this.selectdata.defname) {
           return
         }
+        if(index==9999999){
+          console.log("this.showpanl:"+this.showpanl)
+          this.showpanl[0].hasError = true
+          return
+        }
         if (this.showpanl[index].show) {
           this.showpanl[index].show = false
           this.showpanl[index].hasError = true

package/src/components/product/Process/Processes/ApplyUpload.vue

@@ -0,0 +1,287 @@
+<template>
+  <div class="col-sm-12" style="background-color: #FFFFFF">
+    <div class="col-sm-12" style="padding:50px 100px;height: 25%">
+      <div class="form-group col-sm-5" v-if="issearch">
+        <v-select
+          class="select select_list"
+          :value.sync="useType"
+          width="90%"
+          v-model="useType"
+          :options='typeOfUse'
+          :valueSingle="true"></v-select>
+      </div>
+      <div class="form-group col-sm-2" style="text-align: center" v-if="issearch">
+        <button type="button" class="btn btn-primary item_btn" @click="load">搜索</button>
+      </div>
+      <div class="form-group col-sm-2" style="text-align: center" v-if="isupload">
+        <button type="button" class="btn btn-primary item_btn" @click="showUpload = !showUpload">本地上传</button>
+      </div>
+<!--      <div class="form-group col-sm-2" style="text-align: center" v-if="takeimg">-->
+<!--        <button type="button" class="btn btn-primary item_btn" @click="upload()">拍照</button>-->
+<!--      </div>-->
+    </div>
+    <hr style="width: 90%;margin: 0px auto;border: #999999 1px solid;"/>
+    <div class="col-sm-12" style="overflow: scroll;height: 75%">
+      <div :class="bootstraped ? bootstraped + ' showData' : 'col-sm-6 showData'" v-for="row in fileInfoData">
+        <div class="col-sm-12 item">
+          <div class="left col-sm-5">
+            <a href="#" class="thumbnail" style="width: 100%;height: 100%">
+              <img v-if="row.f_filetype === 'jpg'||row.f_filetype === 'png'||row.f_filetype === 'gif'||row.f_filetype === 'bmp'" :src="row.f_downloadURL" alt="..."/>
+              <img v-if="row.f_filetype === 'pdf'" src="../../../image/pdf.jpg" alt="" />
+              <img v-if="row.f_filetype === 'xls'||row.f_filetype === 'xlsx'" src="../../../image/excel.jpg" alt=""  />
+              <img v-if="row.f_filetype === 'doc'||row.f_filetype === 'docx'" src="../../../image/doc.jpg" alt=""  />
+            </a>
+          </div>
+          <div class="right col-sm-7">
+            <p :title="row.f_filename" class="clears"><strong>文件名：</strong>{{row.f_filename}}</p>
+            <p :title="row.f_username" class="clears"><strong>操作员：</strong><span>{{row.f_username}}</span></p>
+            <p :title="row.fusetype" class="clears"><strong>使用类型：</strong><span>{{row.fusetype}}</span></p>
+            <p :title="row.f_uploaddate" class="clears"><strong>上传时间：</strong><span>{{row.f_uploaddate}}</span></p>
+            <p :title="row.fremarks" class="clears"><strong>文件说明：</strong>{{row.fremarks}}</p>
+            <p class="clears">
+              <a v-if="row.f_filetype === 'jpg' || row.f_filetype==='png' || row.f_filetype==='gif' || row.f_filetype==='bmp'" :href="row.f_downloadURL" style="background:#6aa6e2" class="btn btn-primary" target="_blank" role="button">预览</a>
+              <a v-else  @click="downloadfile(row.f_downloadURL)" style="background:#6aa6e2" class="btn btn-primary" role="button">下载</a>
+              <a v-if="isdelete && $login.f.f_parentname !== '客服部'" @click="delet($index, row)" href="#" class="btn btn-default" role="button" role="button">删除</a>
+            </p>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <apply-high-meter v-if="showhighmeter" :show.sync="showhighmeter" @photo-finish="newPhoto" v-ref:ltgao ></apply-high-meter>
+  <modal  :show.sync="showUpload" v-ref:modal backdrop="false">
+    <header slot="modal-header" class="modal-header">
+      <button type="button" class="close" @click="close"><span class="glyphicon glyphicon-remove"></span></button>
+      <h4 class="modal-title" style="text-align: center">文件上传</h4>
+    </header>
+    <article slot="modal-body" class="modal-body form-horizontal">
+      <div class="form-group" style="text-align: center">
+        <file-upload class="my-file-uploader" :name="'myFile' + blodid"
+                     action="rs/file/uploadFile" tagname="文件上传" :headers="headers" multiple v-ref:file></file-upload>
+      </div>
+      <div class="form-group" v-if="isusetype">
+        <label class="col-sm-2 control-label">文件类型：</label>
+        <div class="col-sm-10">
+          <input-select
+            class="select select_list"
+            :value.sync="headers.fusetype"
+            v-model="headers.fusetype"
+            :options="$appdata.getParam('使用类型')"
+            :valueSingle="true"></input-select>
+        </div>
+      </div>
+      <div class="form-group" v-if="isremark">
+        <label class="col-sm-2 control-label">文件说明：</label>
+        <div class="col-sm-10">
+          <input class="form-control input_view" style=""
+                 v-model="headers.fremarks"
+                 :value="headers.fremarks"/>
+        </div>
+      </div>
+    </article>
+    <footer slot="modal-footer" class="modal-footer">
+    </footer>
+  </modal>
+</template>
+
+<script>
+import {HttpResetClass} from 'vue-client'
+import {isEmpty} from "../../../Util";
+export default {
+  title: '附件',
+  props: ['blodid', 'businessid', 'isremark', 'isusetype', 'takeimg', 'defname', 'isupload', 'isdelete', 'bootstraped', 'issearch'],
+  data () {
+    return {
+      fileInfoData: [], // 数据库存储的文件记录对象数组
+      headers: {'username': this.$login.f.name, 'blodid': '','businessid':'', 'fremarks': '','defname':'','fusetype':''}, // 调用rs/file/uploadFile 的参数
+      showUpload: false, // 上传模态框控制
+      showhighmeter: false, // 高拍仪组件控制
+      useType: null
+    }
+  },
+  ready () {
+    this.headers.blodid = this.blodid
+    this.headers.businessid = this.businessid
+    this.headers.defname = this.defname
+    console.log("流程id--：" + this.blodid)
+    if (this.blodid || this.businessid) {
+      this.load()
+    }
+  },
+  methods: {
+    delet(index, row) {
+      this.$resetdelete('rs/entity/t_files', {id: row.id}, {resolveMsg: '删除成功', rejectMsg: '删除失败'}).then((res) => {
+        this.$dispatch("delResid",row.id)
+        this.load()
+      })
+    },
+    // 下载
+    downloadfile(filepath){
+      var link = document.createElement('a');
+      link.href = filepath;
+      link.target='_blank'
+      link.dispatchEvent(new MouseEvent('click'));
+    },
+    // 关闭文件上传对话框
+    close () {
+      this.showUpload = false
+      // 将选的文件清空
+      this.$refs.file.$el.querySelector('input').value = ''
+      this.headers.fusetype = ''
+      this.headers.fremarks = ''
+      this.load()
+    },
+    // 查询
+    async load() {
+      let condition = ''
+      if(this.businessid){
+        condition = `f_businessid= '${this.headers.businessid}' `
+      }else{
+        condition = `f_blobid= '${this.headers.blodid}' `
+        console.log("f_process_id--:" + condition)
+      }
+      if (!isEmpty(this.useType)) {
+        condition += `and fusetype like '${this.useType}'`
+      }
+      let http = new HttpResetClass()
+      if (this.$login.f.rolesnames.includes('部长')){
+        var data = {
+          tablename: 't_files',
+          condition: condition  +` order by f_uploaddate desc `
+        }
+      }else {
+         data = {
+          tablename: 't_files',
+          condition: condition + ` and f_username = '${this.headers.username}'` +` order by f_uploaddate desc `
+        }
+      }
+
+      let getFile = await http.load('POST', 'rs/sql/singleTable', {data: data}, {
+        warnMsg: null,
+        resolveMsg: null
+      })
+
+      for (var i = 0; i < getFile.data.length; i++) {
+        // 如果使用类型包含导入字样,则是execl文件导入的,不做显示
+        if(getFile.data[i].fusetype&&(getFile.data[i].fusetype.includes('execl导入'))){
+          getFile.data.splice(i,1)
+          i--
+          continue
+        }
+        let temp = getFile.data[i].f_downloadpath
+        let URL = temp.substring(temp.lastIndexOf(":\\") + 2)
+        getFile.data[i].f_downloadURL = "http://" + location.host + "/" + URL
+      }
+      this.fileInfoData = []
+      this.fileInfoData = getFile.data
+    },
+    // 打开高拍仪
+    upload () {
+      if(this.showhighmeter){
+        this.$refs.ltgao.closeVideo()
+      }
+      this.showhighmeter = !this.showhighmeter
+    },
+    // 高拍仪回调
+    newPhoto(Imgbase64) {
+      let form = new FormData()
+      let xhr = new XMLHttpRequest()
+      let formDataBoundary = "----WebkitFormBoundary" + "GaoPaiYi";
+      form.append('Content-Type', 'multipart/form-data;boundary=' + formDataBoundary)
+      form.append('file', this.convertBase64ToBlob(Imgbase64), "GaoPaiYi.jpg")
+      xhr.open("POST", "rs/file/uploadFile")
+
+      if (this.headers) {
+        for (var header in this.headers) {
+          xhr.setRequestHeader(header, encodeURIComponent(this.headers[header]))
+        }
+      }
+      xhr.send(form)
+      setTimeout(() => {
+        this.load()
+      }, 5000)
+    },
+    convertBase64ToBlob(base64String) {
+      // 将base64解码
+      var bytes = atob(base64String);
+      //var bytes = base64;
+      var bytesCode = new ArrayBuffer(bytes.length);
+      // 转换为类型化数组
+      var byteArray = new Uint8Array(bytesCode);
+
+      // 将base64转换为ascii码
+      for (var i = 0; i < bytes.length; i++) {
+        byteArray[i] = bytes.charCodeAt(i);
+      }
+      // 生成Blob对象（文件对象）
+      return new Blob([bytesCode], {type: 'image/jpeg'});
+    },
+  },
+  computed: {
+    typeOfUse () {
+      return [{label: '全部', value: ''}, ...this.$appdata.getParam('使用类型')]
+    }
+  },
+  events: {
+    onFileUpload: function (file, res) {
+      this.$dispatch("resid",res.id)
+      this.headers.fremarks=''
+      this.close()
+    }
+  },
+  watch: {
+    'blodid'(val) {
+      if (val) {
+        console.log('观察blodid', val)
+        this.headers.blodid = this.blodid
+        this.load(this)
+      }
+    },
+    'useType'() {
+      this.headers.fusetype = this.useType[0] ? this.useType[0] : ''
+    },
+    'defname'() {
+      this.headers.defname=this.defname
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .clears{
+    overflow:hidden;
+    text-overflow:ellipsis;
+    white-space:nowrap;
+  }
+  .showData {
+    padding: 15px 10px 0px 10px;
+    box-sizing: border-box;
+    height: 230px;
+    font-family: "微软雅黑";
+  }
+  .showData .item{
+    padding-bottom: 10px;
+    border-bottom: solid 1px #c1c1c1;
+  }
+  .left {
+    padding-right: 10px;
+  }
+  .left img{
+    height: 100%;
+    width: 100%;
+  }
+  .right{
+    height: 100%;
+    /*display: -webkit-flex;*/
+    /*display: flex;*/
+    /*flex-direction: column;*/
+    /*justify-content: space-around;*/
+  }
+  .item_btn{
+    width: 80%;
+    background-color: #6aa6e2;
+    border-radius: 4px;
+    color: #FFFFFF;
+    font-family: PingFang;
+  }
+</style>