<template>
  <div class="app-actionbar">
    <div class="app-actionbar-item" v-for="(item,index) in items" :key="index">
      <Badge v-if="item.counterService&&item.counterService.counterData" v-show="item.visabled" :count="item.counterService.counterData[item.counterId]" type="primary">
         <i-button :disabled="item.disabled" @click="handleClick(item, $event)"><i v-if="item.icon" style="margin-right: 5px;" :class="item.icon"></i>{{item.actionName}}</i-button>
    </Badge>
    <i-button v-show="item.visabled" :disabled="item.disabled" v-else @click="handleClick(item, $event)">{{item.actionName}}</i-button>
    </div>
  </div>
</template>

<script lang="ts">
import { Vue, Component, Prop, Model, Emit,Inject, Watch } from "vue-property-decorator";
import { Subject,Subscription } from "rxjs";
import { Environment } from '@/environments/environment';

@Component({})
export default class AppActionBar extends Vue {

  /**
   * 传入操作栏模型数据
   * 
   * @type {any}
   * @memberof AppActionBar
   */
  @Prop() public items!:any;

  /**
   * 注入的UI服务
   *
   * @type {*}
   * @memberof AppActionBar
   */
  @Prop() public uiService!: any;

  /**
   * 视图通讯对象
   *
   * @type {Subject<ViewState>}
   * @memberof AppActionBar
   */
  @Prop() public viewState!: Subject<ViewState>;

  /**
   * 视图状态事件
   *
   * @public
   * @type {(Subscription | undefined)}
   * @memberof ActionlinetestBase
   */
  public viewStateEvent: Subscription | undefined;

  /**
   * 部件数据
   *
   * @type {*}
   * @memberof AppActionBar
   */
  public data: any;

  /**
   * 组件初始化
   *
   * @memberof AppActionBar
   */
  public created(){
    if (this.viewState) {
        this.viewStateEvent = this.viewState.subscribe(({ tag, action, data }) => {
            if (!Object.is(tag, "all-portlet")) {
                return;
            }
            if(Object.is(action,'loadmodel')){
              this.data = data;
              this.calcActionItemAuthState(data,this.items,this.uiService);
            }
        });
    }
  }

  /**
   * 触发界面行为
   * 
   * @memberof AppActionBar
   */
  public handleClick(item: any, $event:any){
    let _data = {
      tag : item.viewlogicname,
      params : this.data,
      event : $event
    };
    this.$emit('itemClick',_data);
  }

  /**
   * 计算界面行为项权限状态
   *
   * @param {*} [data] 传入数据
   * @param {*} [ActionModel] 界面行为模型
   * @param {*} [UIService] 界面行为服务
   * @memberof AppActionBar
   */
  public calcActionItemAuthState(data:any,ActionModel:any,UIService:any){
    if(!UIService.isEnableDEMainState)
      return;    
    for (const key in ActionModel) {
        if (!ActionModel.hasOwnProperty(key)) {
            return;
        }
        const _item = ActionModel[key];
        if(_item && _item['dataaccaction'] && UIService){
            let dataActionResult:any;
            if(Object.is(_item['actiontarget'],"NONE") || Object.is(_item['actiontarget'],"")){
                dataActionResult = UIService.getResourceOPPrivs(_item['dataaccaction']);
            }else{
                if(data && Object.keys(data).length >0){
                    dataActionResult = UIService.getAllOPPrivs(data)[_item['dataaccaction']];
                }
            }
            // 无权限:0;有权限:1
            if(dataActionResult === 0){
                // 禁用:1;隐藏:2;隐藏且默认隐藏:6
                if(_item.noprivdisplaymode === 1){
                    _item.disabled = true;
                }
                if((_item.noprivdisplaymode === 2) || (_item.noprivdisplaymode === 6)){
                    _item.visabled = false;
                }else{
                    _item.visabled = true;
                }
            }
            if(dataActionResult === 1){
                _item.visabled = true;
                _item.disabled = false;
            }
        }
    }
  } 

  /**
   * 组件销毁
   * 
   * @memberof AppActionBar
   */
  public destory(){
    if (this.viewStateEvent) {
      this.viewStateEvent.unsubscribe();
    }
  }

}
</script>

<style lang='scss'>
@import "./app-actionbar.scss";
</style>