ldap-clients/doc/Organization.vue

<template>
  <div style="padding: 0px 100px;" class="flex">
    <div class="btn-group auto" style="margin-bottom: 30px">
      <button type="button" class="button_clear button_spacing" style="width: 70px" @click="removeData(ids)" v-if="hasbtn('批量删除')">批量删除</button>
      <button type="button" class="button_new button_spacing" style="width: 70px" @click='add("add-org")' v-if="hasbtn('添加组织')">添加组织</button>
      <button type="button" class="button_new button_spacing" style="width: 70px" @click='add("add-zone")' v-if="hasbtn('添加片区')">添加片区</button>
    </div>
      <div class="datapanel">
          <h3 class="txtline">&nbsp;&nbsp;【{{data.name}}】组织管理</h3>
        <data-grid class="list_area table_sy"  partial='list' v-ref:grid :model="model">
          <template partial='head'>
            <tr>
              <th>全选
                <input type="checkbox" class="all-checked" v-model="checked" @click="$parent.$parent.isAll(checked)">
              </th>
              <th></th>
              <th>资源名称</th>
              <th>修改</th>
              <th>删除</th>
            </tr>
          </template>
          <template partial='body'>
            <tr v-if="">
              <td style="text-align: center;">
              <input type="checkbox"  v-model="$parent.$parent.ids" :value="row">
              </td>
              <td style="text-align: center;"><img :src="$parent.$parent.imgsrc(row.f_icon)" alt=""></td>
              <td style="text-align: center;">{{row.name}}</td>
              <td style="text-align: center;" ><img height="15" width="15" v-if="row.resourcetype == 'organization' || row.resourcetype == 'zone'" src="../../../static/ldaplefticon/修改.png" @click="$parent.$parent.modify(row)"></img></td>
              <td style="text-align: center;"><img height="15" width="15" v-if="row.resourcetype == 'organization' || row.resourcetype == 'zone'" src="../../../static/ldaplefticon/删除.png" @click="$parent.$parent.removeData([row])"></img></td>
            </tr>
          </template>
        </data-grid>
      </div>

  </div>
</template>

<script>
import { PagedList } from 'vue-client'
import co from 'co'
import * as Util from '../Util'

let gen = function * (self) {
  //self.model = yield self.$post('rs/search', {source: `tool.getChildren($${self.data.id}$)`, userid: self.userid},{resolveMsg: null, rejectMsg: null})
  self.model = yield self.$http.post('rs/search',{source: `this.getRights().where(row.getAttributes().get($parentid$) == $${self.data.id}$)`, userid: self.userid})
  // console.log(self.model)
}
let deleteData = function * (self,data) {
  let msg = yield self.$http.post('rs/data/delete',{data: data})
  //yield self.$post('rs/data/delete', {data: data},{resolveMsg:null, rejectMsg:null})
  yield self.$showMessage(msg.bodyText)
  self.ids = []
  self.refresh()
  self.flush()
}
export default {
  title: '组织机构',
  props: ['data', 'userid'],
  ready() {
    this.$parent.setTitle(this.data.name)
    this.refresh()
  },
  data() {
    return {
      ids: [], // 处理全选和部分选择使用
      model: ''
    }
  },
  methods: {
    flush(){
      this.$parent.$parent.$parent.$parent.flush()
    },
    // 刷新数据
    refresh () {
      let g = gen(this)
      co(g)
    },
    add(name) {
      console.log(name)
      let parent = this.data
      delete parent.children
      this.$goto(name, {parent: parent}, 'self', this.isRefresh)
    },
    modify(row) {
      let type = row.resourcetype
      let name = ''
      if (type === 'organization') {
        name = 'add-org'
      }else if (type === 'zone') {
        name = 'add-zone'
      }
      let parent = this.data
      delete parent.children
      this.$goto(name, {parent: parent, data: row},'self', this.isRefresh)
      this.refresh()
    },
    isAll (checked) {
      this.ids = []
      if (!checked) {
        this.model.data.forEach((row) => {
          this.ids.push(row)
        })
      }
    },
    imgsrc (name) {
      return Util.getImgsrc(name)
    },
    hasbtn (val) {
      if(this.$login.f.lics&&this.$login.f.lics.includes(val)){
        return true
      }else {
        return false
      }
    },
    removeData (data) {
      var removeName = ''
      data.forEach((item) => {
        removeName = removeName + item.name + ';'
      })
      if(!removeName){
        this.$showMessage("请选择需要删除项！")
      } else {
        this.$showMessage('确定要删除【'+removeName+'】', ['confirm', 'cancel']).then((res) => {
          if (res === 'confirm') {
            let d = deleteData(this,data)
            co(d)
          }
        })
      }
    },
    isRefresh (param) {
      if (param === 'refresh') {
        this.refresh()
      }
    }
  }
}
</script>
<style>
  .all-checked {
    vertical-align: text-top;
    margin-left: 10px !important;
  }
  td > .glyphicon {
    cursor: pointer;
  }
  th > input[type="checkbox"], td > input[type="checkbox"] {
    cursor: pointer;
  }
  .btn-group>.btn {
    margin-right: 20px;
  }
  .datapanel {
    color: #333;
    background-color: white;
    box-shadow: darkgrey 0.5px 0.5px 0.5px 0.5px ;
    padding: 10px 30px 10px 30px;
    border-radius:15px;
  }
  .txtline {
    border-left-width:5px;
    border-left-style:solid;
    border-left-color:#4a7cae;
  }
  .form-fix-width{
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display:flex;
  }
  .form-fix-width>:first-child{
    width: 100px;
    -webkit-box-flex:none;
    -webkit-flex:none;
    -ms-flexbox-flex:none;
    flex:none;
  }
  .form-fix-width>:last-child{
    flex:1;
    -webkit-box-flex:1;
    -webkit-flex:1;
    -ms-flexbox-flex:1;
  }
</style>