<style>
</style>
<template>
  <div class="page-body">
    <div class="page-search row items-center">
      <div class="col row wrap q-mr-lg q-col-gutter-md">
        <div class="col-3">
          <q-input @change="resetSearch" clearable standout="bg-primary text-white" v-model="msg.OrderId" label="订单id"
            @clear="resetSearch" maxlength="30" />
        </div>
        <div class="col-3">
          <q-select @input="resetSearch" standout="bg-primary text-white" option-value="Id" option-label="Name"
            v-model="msg.CType" :options="CTypeList" emit-value map-options label="类型" />
        </div>
        <div class="col-3">
          <q-select @input="resetSearch" standout="bg-primary text-white" v-model="msg.Status" :options="StatusOpts"
            option-value="Id" option-label="Name" label="状态" emit-value map-options />
        </div>
        <div class="col-3">
          <q-input @change="resetSearch" clearable standout="bg-primary text-white" v-model="msg.ContractNo"
            label="合同编号" @clear="resetSearch" maxlength="30" />
        </div>
        <div class="col-3">
          <q-input @change="resetSearch" clearable standout="bg-primary text-white" v-model="msg.StudentName"
            label="学生姓名" @clear="resetSearch" maxlength="30" />
        </div>
        <div class="col-3">
          <q-select @input="resetSearch" standout="bg-primary text-white" option-value="Id" option-label="EmployeeName"
            v-model="msg.QCreateBy" :options="EmployeeList" emit-value map-options label="业务员" use-input
            @filter="filterFn2" clearable />
        </div>
      </div>
    </div>
    <div class="page-content">
      <q-table :pagination="msg" :loading="loading" no-data-label="暂无相关数据" flat class="sticky-column-table"
        separator="none" title="合同信息" :data="dataList" :columns="columns" row-key="name">
        <template v-slot:top>
          <div class="col-2 q-table__title">合同信息</div>
          <q-space />
          <div class="page-option"></div>
        </template>
        <template v-slot:body-cell-CreateByName="props">
          <q-td :props="props">
            <q-avatar rounded size="sm" v-if="props.row.CreateByPhoto">
              <img :src="props.row.CreateByPhoto" />
            </q-avatar>
            <q-avatar rounded size="sm" color="teal-10" text-color="white" v-if="!props.row.CreateByPhoto">
              {{ props.value.substring(0, 1) }}</q-avatar>
            {{ props.row.CreateByName }}
          </q-td>
        </template>
        <template v-slot:body-cell-StudentName="props">
          <q-td auto-width :props="props">
            <span v-if="props.row.Sign" style="color: #67c23a">【已签字】</span>
            <span v-else style="color: #e95252">【未签字】</span>
            {{ props.row.StudentName }}
          </q-td>
        </template>

        <template v-slot:body-cell-Status="props">
          <q-td auto-width :props="props">
            <span v-if="props.row.Status == 0" style="color: #e6a23c">草稿</span>
            <span v-if="props.row.Status == 1" style="color: #409eff">提交审核</span>
            <span v-if="props.row.Status == 2" style="color: #67c23a">审合通过</span>
            <span v-if="props.row.Status == 3" style="color: #f56c6c">驳回</span>
            <span v-if="props.row.Status == 4" style="color: #e95252">取消</span>
          </q-td>
        </template>
        <template v-slot:body-cell-IsCompanySeal="props">
          <q-td auto-width :props="props">
            <span v-if="props.row.IsCompanySeal == 0" style="color: #e95252">未盖章</span>
            <span v-if="props.row.IsCompanySeal == 1" style="color: #67c23a">已盖章</span>
          </q-td>
        </template>
        <template v-slot:bottom>
          <q-pagination class="full-width justify-end" v-model="msg.pageIndex" color="primary" :max="pageCount"
            :input="true" @input="changePage" />
        </template>
        <template v-slot:body-cell-optioned="props">
          <q-td :props="props">
            <q-btn flat size="xs" icon="iconfont icon-View" color="accent" @click="goContract(props.row)"
              style="font-weight: 400" label="查看" />
          </q-td>
        </template>
      </q-table>
    </div>

  </div>
</template>
<script>
  import {
    GetEducationContractPageCodeList,
    GetMyEducationContractPageList,
    SetEducationContractAudit,
    GetDownLoadEducationContract,
    SetEducationContractCopy,
  } from "../../api/sale/contract";

  import {
    downloadLocalFile
  } from "../../api/common/common";
  import {
    queryEmployee
  } from '../../api/users/user';
  export default {
    meta: {
      title: "报名合同查询",
    },
    components: {
    },
    data() {
      return {
        columns: [{
            name: "ContractNo",
            label: "合同编号",
            align: "left",
            field: "ContractNo",
          },
          {
            name: "CTypeName",
            label: "类型",
            align: "left",
            field: "CTypeName",
          },
          {
            name: "StudentName",
            label: "学生名称",
            field: "StudentName",
            align: "left",
          },
          {
            name: "CourseName",
            label: "课程名称",
            align: "left",
            field: "CourseName",
          },
          {
            name: "CreateByName",
            label: "创建人",
            align: "left",
            field: "CreateByName",
          },
          {
            name: "CreateTime",
            label: "创建时间",
            align: "left",
            field: "CreateTime",
          },
          {
            name: "SchoolStatusStr",
            label: "学管部审核状态",
            align: "left",
            field: "SchoolStatusStr",
          },
          {
            name: "AdminStatusStr",
            label: "行政审核状态",
            align: "left",
            field: "AdminStatusStr",
          },
          {
            name: "IsCompanySeal",
            label: "是否盖章",
            align: "left",
            field: "Status",
          },
          {
            name: "optioned",
            label: "操作",
            field: "RoomId",
          },
        ],
        loading: true,
        msg: {
          pageIndex: 1,
          pageSize: 12,
          rowsPerPage: 12,
          OrderId: "", //订单id
          CType: 0, //1培训 2留学
          Status: -1, //0草稿 1提交审核 2审核通过 3驳回 4取消
          ContractNo: "", //合同编号
          StudentName: "", //学生姓名
          IsQueryAll: 1,
          QCreateBy: "",
        },
        pageCount: 0,
        dataList: [],
        //类型下拉
        CTypeList: [{
            Id: 0,
            Name: "不限",
          },
          {
            Id: 1,
            Name: "培训",
          },
          {
            Id: 2,
            Name: "留学",
          },
        ],
        //状态下拉
        StatusOpts: [{
            Id: -1,
            Name: "不限",
          },
          {
            Id: 0,
            Name: "草稿",
          },
          {
            Id: 1,
            Name: "提交审核",
          },
          {
            Id: 2,
            Name: "审核通过(行政)",
          },
          {
            Id: 5,
            Name: "审核通过(学管)",
          },
          {
            Id: 3,
            Name: "驳回",
          },
          {
            Id: 4,
            Name: "取消",
          },
        ],
        EmployeeList: [], //业务员
        AllemployeeList: [],
      };
    },
    created() {
      if(this.$route.query.no){
        let no=decodeURIComponent(this.$route.query.no);
        this.msg.ContractNo=no
      }
      this.getEmployee()
    },
    mounted() {
      if (this.$route.query && this.$route.query.Name) {
        //从订单完成统计跳转过来的带的参数
        this.msg.ContractNo = decodeURI(this.$route.query.Name);
      }
      this.getList();
    },
    methods: {
      //业务员
      getEmployee() {
        var qMsg = {
          Dept_Id: 0
        }
        queryEmployee(qMsg).then(res => {
          if (res.Code == 1) {
            this.EmployeeList = res.Data;
            this.AllemployeeList = JSON.parse(JSON.stringify(this.EmployeeList));
          }
        }).catch(() => {

        })
      },
      //筛选业务员
      filterFn2(val, update) {
        update(() => {
          if (val === '') {
            this.EmployeeList = JSON.parse(JSON.stringify(this.AllemployeeList))
          } else {
            const needle = val.toLowerCase()
            this.EmployeeList = this.AllemployeeList.filter(v => v.EmployeeName.toLowerCase().indexOf(needle) > -1)
          }
        })
      },
      //获取校区列表
      getList() {
        this.loading = true;
        GetMyEducationContractPageList(this.msg).then((res) => {
          this.loading = false;
          if (res.Code == 1) {
            this.dataList = res.Data.PageData;
            this.pageCount = res.Data.PageCount;
          }
        });
      },
      //重新查询
      resetSearch() {
        this.msg.pageIndex = 1;
        this.getList();
      },
      //分页改变
      changePage(val) {
        this.msg.pageIndex = val;
        this.getList();
      },
      //跳转至编辑
      goContract(item) {
        let routeUrl = this.$router.resolve({
          path: "/contractView",
          query: {
            ContractId: item.Id,
          },
        });
        window.open(routeUrl.href, "_blank");
      },
    },
  };

</script>
<style lang="sass">
  @import url('~assets/css/table.sass')

</style>
