<style>
.user_time_picker .el-date-editor--date > .el-input__inner {
  padding: 0 10px;
  font-size: 13px;
}
.user_time_picker .el-date-editor--date > span.el-input__prefix {
  display: none;
}
.user_time_picker .el-date-editor--date > span.el-input__suffix {
  top: -4px;
  right: 2px;
}
.zidingyiFz i {
  font-size: 14px !important;
}
</style>
<template>
  <div class="flexOne">
    <div class="query-box">
      <ul class="user_time_picker">
        <li><span><em>{{$t('advmanager.v_line')}}</em>
            <el-select class='w200' v-model="msg.LineId" filterable :placeholder="$t('pub.pleaseSel')">
              <el-option :label="$t('pub.unlimitedSel')" value='-1'></el-option>
              <el-option v-for="item in LineList" :label='item.LineName' :value='item.LineID' :key='item.LineID'>
              </el-option>
            </el-select>
          </span>
        </li>
        <li>
          <span
            ><em>{{ $t("system.table_company") }}</em
            ><el-select class="w150"
              filterable
              v-model="msg.RB_Branch_Id"
              @change="linkageDepartment()"
            >
              <el-option :label="$t('pub.unlimitedSel')" :value="-1"></el-option>
              <el-option
                v-for="item in companyList"
                :label="item.BName"
                :value="item.Id"
                :key="item.Id"
              >
              </el-option>
            </el-select>
          </span>
        </li>
        <li>
          <span
            ><em>{{ $t("admin.admin_Department") }}</em
            ><el-select class="w150"
              filterable
              v-model="msg.DepartmentId"
              @change="linkagePost()"
            >
              <el-option :label="$t('pub.unlimitedSel')" :value="0"></el-option>
              <el-option
                v-for="item in departMentList"
                :label="item.DepartmentName"
                :value="item.DepartmentID"
                :key="item.DepartmentID"
              >
              </el-option>
            </el-select>
          </span>
        </li>
        <li>
          <span
            ><em>{{$t('objFill.v101.dmc.faburen')}}</em
            ><el-select class="w150" filterable v-model="msg.CreateBy">
              <el-option :label="$t('pub.unlimitedSel')" value="0"></el-option>
              <el-option v-for='item in employeeList'
                    :label='item.name'
                    :value='item.empId'
                    :key='item.empId'>
                </el-option>
            </el-select>
          </span>
        </li>
        <li>
          <span
            ><em>{{$t('salesModule.Time')}}</em>
            <el-date-picker
            v-model="dateList"
            type="daterange"
            :range-separator="$t('OrderList.zhi')"
            value-format="yyyy-MM-dd"
            :start-placeholder="$t('OrderList.star')"
            :end-placeholder="$t('OrderList.end')">
            </el-date-picker>
          </span>
        </li>

        <li>
          <input
            type="button"
            class="hollowFixedBtn"
            :value="$t('pub.searchBtn')"
            @click="resetPageIndex(), getList()"
          />

        </li>
      </ul>
    </div>
    <div class="clearfix"></div>

    <table class="singeRowTable" border="0" cellspacing="0" cellpadding="0" v-loading="loading">
      <tr>

        <th width="250">{{$t('objFill.biaoti')}}</th>
        <th>{{$t('advmanager.v_type')}}</th>
        <th>{{$t('objFill.v101.Rest.guankancis')}}</th>
        <th>{{$t('advmanager.v_line')}}</th>
        <th>{{$t('objFill.v101.Rest.shipinztai')}}</th>
        <th>{{$t('system.query_name')}}</th>
        <th>{{$t('salesModule.Time')}}</th>
      </tr>
      <tr v-for="(item, index) in DataList" :key="index" >

        <td>{{ item.Name }}</td>
        <td>
            <span v-if="item.Type==1">{{$t('objFill.v101.Rest.neibuship')}}</span>
            <span v-if="item.Type==2">{{$t('objFill.v101.Rest.waibuship')}}</span>
        </td>
        <td>{{ item.WatchNum }}</td>
        <td>{{ item.LineName }}</td>
        <td>
            <span v-if="item.VideoStatus==1">{{$t('objFill.v101.header.fabu')}}</span>
            <span v-if="item.VideoStatus==2">{{$t('objFill.caogao')}}</span>
            <span v-if="item.VideoStatus==3">{{$t('adm.adm_chehui')}}</span>
        </td>
        <td>{{ item.EmName }}</td>
        <td>{{ item.UpdateDate }}</td>

      </tr>
      <tr v-show="DataList.length==0">
          <td colspan="15" align="center">{{$t('system.content_noData')}}</td>
      </tr>
    </table>

    <el-pagination
      background
      @current-change="handleCurrentChange"
      :current-page.sync="currentPage"
      layout="total,prev, pager, next, jumper"
      :page-size="msg.pageSize"
      :total="total"
    >
    </el-pagination>


  </div>
</template>
<script>
import moment from 'moment'
export default {
  data() {
    return {
      loading: false,
      isleaveBtn: false,
      total: 0,
      pageSize: "",
      currentPage: 1,
      dateList:[],
      //请求
      msg: {
        pageIndex: 1,
        pageSize: 15,
        CreateBy:'',
        StartTime:'',
        EndTime:'',
        RB_Branch_Id:-1,
        DepartmentId:'',
        LineId:'',
      },


      getGroupMsg: {
        Status: "0",
        GroupName: "",
        Domain: "",
        Versions_Id: ""
      },
      getCompanyMsg: {
        RB_Group_Id: "0",
        Status: "0"
      },
      getDepartmentMsg: {
        RB_Group_Id: "0",
        RB_Branch_Id: "-1",
        Status: "0"
      },
      companyList:[],
      departMentList:[],
      employeeMsg: {
            RB_Group_id:'0',
            RB_Branch_id:'-1',
            departmentId:'0',
            IsLeave:'-1',
        },
        DataList:[],
        employeeList:[],
        LineList:[],

    };
  },
    mounted() {
        let userInfo = this.getLocalStorage();
        this.getCompanyMsg.RB_Group_Id = userInfo.RB_Group_id; //集团ID

        if(this.$route.query.CreateBy){
            this.msg.CreateBy=Number(this.$route.query.CreateBy)
        }
        let StartTime='';
        let EndTime='';
        if(this.$route.query.StartTime){
            StartTime=this.$route.query.StartTime;
        }
        if(this.$route.query.EndTime){
            EndTime=this.$route.query.EndTime;
        }
        this.getDepartmentMsg.RB_Branch_Id = this.msg.RB_Branch_Id;
        this.employeeMsg.RB_Branch_id = this.msg.RB_Branch_Id;
        this.employeeMsg.departmentId = this.msg.DepartmentId;

        this.dateList=[];
        this.dateList.push(StartTime)
        this.dateList.push(EndTime)
        this.getList();
        this.getCompany();
        this.getDerpartMent();
        this.getLineList();
        this.getEmployee();
    },
    filters:{
        YMD(date){
            if(date!=''){
                return moment(date).format("YYYY-MM-DD");
            }else{
                return date;
            }

        }
    },

  methods: {
    getLineList() {
        this.apipost("line_post_GetAllList", {}, res => {
            if (res.data.resultCode == 1) {
            this.LineList = res.data.data;
            } else {
            this.$message.error(res.data.message);
            }
        });
    },
    linkagePost() {
      //联动岗位
      this.msg.CreateBy='0';
      this.employeeMsg.RB_Branch_id = this.msg.RB_Branch_Id;
      this.employeeMsg.departmentId = this.msg.DepartmentId;
      this.getEmployee();
    },
    getEmployee() {
        this.apipost('app_get_company_employee', this.employeeMsg, res => {
            if(res.data.resultCode == 1) {
                this.employeeList = res.data.data;
            }
        }, err => {})
    },
    getCompany() {
      this.apipost(
        "admin_get_BranchGetList",
        this.getCompanyMsg,
        res => {
          if (res.data.resultCode == 1) {
              this.companyList = res.data.data;
          } else {
          }
        },
        err => {}
      );
    },
    getDerpartMent() {
      //获取部门
      this.apipost(
        "admin_get_DepartmentGetList",
        this.getDepartmentMsg,
        res => {
          if (res.data.resultCode == 1) {
              this.departMentList = res.data.data;
          } else {
          }
        },
        err => {}
      );
    },

    getList() {
      //获取数据
      this.loading = true;
      if(this.dateList && this.dateList.length>0){
          this.msg.StartTime=this.dateList[0];
          this.msg.EndTime=this.dateList[1];
      }else{
          this.msg.StartTime='';
          this.msg.EndTime='';
      }
        this.apipost(
          "Video_get_GetVideoStatisticsPageList",
          this.msg,
          res => {
            if (res.data.resultCode == 1) {
              this.loading = false;
              this.DataList = res.data.data.pageData;
              this.total = res.data.data.count;
            } else {
            }
          },
          err => {}
        );
    },

    linkageDepartment() {
      //联动部门
      this.msg.DepartmentId = "0";
      this.msg.CreateBy='0';
      this.getDepartmentMsg.RB_Branch_Id = this.msg.RB_Branch_Id;
      this.getDerpartMent();
    },

    handleCurrentChange(val) {
      this.msg.pageIndex = val;
      this.getList();
    },
    resetPageIndex() {
      this.msg.pageIndex = 1;
      this.currentPage = 1;
    },

    goUrl(name, id) {
      this.$router.push({
        name: name,
        query: { id: id, type: 9, blank: "y", tab: this.$t('adm.adm_bindaccountinfo') }
      });
    },
  }
};
</script>
