<!--订单列表-->
<template>
  <div>
    <el-table
        v-loading="loading"
        stripe
        ref="multipleTable"
        :data="dataList"
        tooltip-effect="dark"
        style="width: 100%"
        row-class-name="font-size-12"
        border
        :default-sort = "{prop: 'null', order: 'null'}"
        :sort-by="['Money','Income','PreferTipAmount','PlatformTax','Refund','CostMoney','OrderProfit','DueInMoney']">
        <el-table-column 
            width="200"
            prop="CreateTimeStr"
            label="订单Id"
            show-overflow-tooltip fixed="left">
            <template slot-scope="scope">
              <div @click="goDetails(scope.row)">
                <p style="font-size: 18px;display: flex;align-items: center;">
                  <el-tag style="margin-right: 5px;" size="mini">{{scope.row.OrderTypeName}}</el-tag>
                  <span class="cp blue">{{scope.row.OrderId}}</span> 
                </p>
                <p>{{scope.row.CreateTimeStr}}</p>
              </div>
            </template>
        </el-table-column>
        <el-table-column 
            width="200"
            prop="CreateTimeStr"
            label="团号"
            show-overflow-tooltip>
            <template slot-scope="scope">
              <div>
                <p style="font-size: 14px;">{{scope.row.TCNUM}}</p>
                <p>出发日期：{{scope.row.StartDate}}</p>
              </div>
            </template>
        </el-table-column>
        <el-table-column
            label="客人"
            show-overflow-tooltip>
            <template slot-scope="scope">
              <span :class="{'colorblue font-color-link':pagesTitle!='详情'}"  @click="pagesTitle!='详情'?openNameDetails(scope.row):''">
                {{scope.row.GuestName}}
              </span>
            </template>
        </el-table-column>
        <el-table-column 
            prop="SaleName"
            label="销售"
            show-overflow-tooltip>
        </el-table-column>
        <el-table-column 
            prop="LureEmpName"
            label="引流"
            show-overflow-tooltip>
        </el-table-column>
        <el-table-column
            label="提成"
            show-overflow-tooltip>
            <template slot-scope="scope">
              <span :class="{'red font-color-link':pagesTitle!='详情'&&scope.row.Commission>0}"  
                @click="pagesTitle!='详情'&&scope.row.Commission>0?commissionDetails(scope.row):''">
                {{scope.row.Commission>0?scope.row.Commission:'-'}}
              </span>
            </template>
        </el-table-column>
        <el-table-column 
            label="商品名称"
            show-overflow-tooltip>
            <template slot-scope="scope">
              <div style="overflow: hidden;">{{scope.row.Name}}</div>
            </template>
        </el-table-column>
        <el-table-column 
            label="商品详情"
            show-overflow-tooltip>
            <template slot-scope="scope">
              <div style="overflow: hidden;">{{scope.row.Description}}</div>
            </template>
        </el-table-column>
        <el-table-column 
            sortable
            prop="Money"
            label="总金额"
            show-overflow-tooltip>
            <template slot-scope="scope">
              {{scope.row.Money}}&ensp;({{scope.row.CurrencyName}})
            </template>
        </el-table-column>
        <el-table-column 
            sortable
            prop="Income"
            label="实收"
            show-overflow-tooltip>
        </el-table-column>
        <el-table-column sortable prop="PreferTipAmount" label="人头小费" min-width="101">
        </el-table-column>
        <el-table-column 
            sortable
            prop="PlatformTax"
            label="手续费"
            show-overflow-tooltip>
        </el-table-column>
        <el-table-column 
            sortable
            prop="Refund"
            label="退款"
            show-overflow-tooltip>
        </el-table-column>
        <el-table-column 
            sortable
            prop="CostMoney"
            label="成本"
            show-overflow-tooltip>
        </el-table-column>
        <el-table-column
            sortable
            prop="DueInMoney"
            label="待收"
            show-overflow-tooltip>
            <template slot-scope="scope">
              <span :class="{'red':scope.row.DueInMoney>0}">{{scope.row.DueInMoney}}</span>
            </template>
        </el-table-column>
        <el-table-column sortable prop="OrderProfit" label="预期利润" min-width="100">
          <template slot-scope="scope">
            <span :class="{'red':scope.row.OrderProfit>0}">{{scope.row.OrderProfit}}</span>
          </template>
        </el-table-column>
        <el-table-column 
            sortable
            prop="DiscountsMoney"
            label="优惠"
            show-overflow-tooltip>
        </el-table-column>
        <el-table-column 
            prop="StateName"
            label="状态"
            show-overflow-tooltip>
            <template slot-scope="scope">
              <span>{{scope.row.StateName}}</span>
            </template>
        </el-table-column>
        <el-table-column 
            label="操作"
            show-overflow-tooltip fixed="right" v-if="isPermission">
            <template slot-scope="scope">
              <!-- <el-button size="mini" type="primary" @click="goDetails(scope.row)">查看</el-button> -->
              <el-button size="mini" type="primary" @click="goTurn(scope.row)">转交</el-button>
            </template>
        </el-table-column>
      </el-table>
      <el-drawer :with-header="false" size='70%' :visible.sync="drawer" direction="rtl" :before-close="handleClose">
        <customerInfoBox :CustomerId="CustomerId" :activeNameNum="activeNameNum" :receiptType="receiptType"/>
    </el-drawer>
    <!-- 单号抽屉 -->
    <el-drawer @closed="closeOrderDrawerHandler" :with-header="false" size='70%' :visible.sync="orderDrawer" direction="rtl" :before-close="handleClose">
      <orderDetailsDrawer v-if="currentOrder" :orderId="currentOrder.OrderId" :activeNameNum="activeNameNum" />
    </el-drawer>
    <!-- 提成详情 -->
    <commissionPopUp v-if="commissionPopUpVisible" :parameters="parameters"></commissionPopUp>
   <!-- 转交引流人 -->
    <el-dialog :visible.sync="dialogTableVisible" 
      :close-on-click-modal="false" 
      width="400px">
      <div class="add-tit" slot="title">
        <p><span></span>引流人转交</p>
        <span icon="el-icon-close"></span>
      </div>
      <el-form>
        <el-row :model="form" ref="form" class="MyEditForm" :rules="rules">
          <el-col>
             <div class="MyEditForm-item">
                 <el-form-item label="" prop="LureEmpId">
                   <el-select 
                     size="mini"
                     filterable
                     v-model="form.LureEmpId" 
                     clearable
                     placeholder="请选择引流人">
                         <el-option 
                             v-for="item in EmployeeList"
                             :label='item.EmName'
                             :value='item.EmployeeId'
                             :key='item.EmployeeId'>
                         </el-option>
                     </el-select>
                 </el-form-item>
             </div>
         </el-col>
       </el-row>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" class="add-box-btn" @click="submitForm('form')" :loading="clickShow">确 定</el-button>
        <el-button class="add-box-btn add-box-cancel" @click="resetForm('form')">取 消</el-button>
     </div>
    </el-dialog>
    

</div>
</template>

<script>
export default {
  components: {
    customerInfoBox:() => import('../../guestManagement/customerInfoBox'),
    orderDetailsDrawer:() => import('../../customerManage/orderDetailsDrawer'),
    commissionPopUp:() => import('../../dialogModel/commissionPopUp')
  },
  props: {
    pagesTitle: {
      type: String,
      default: "",
    },
    //订单
    dataList: {
      type: Array,
      default: null,
    },
    loading: {
      type: Boolean,
      default: false,
    },
    superManage: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
      CustomerId: "",
      CustomerName: "",
      currentOrder: null,
      parameters:{},
      receiptType:{},
      drawer: false,
      orderDrawer: false,
      commissionPopUpVisible: false,
      activeNameNum:"1",
      form: {
        OrderId: null,
        LureEmpId: null,
        OrderType: null
      },
      dialogTableVisible: false,
      rules: {
        LureEmpId: [{
          required: true,
          message: "请选择转交引流人",
          trigger: "change"
      },],},
      EmployeeList: [],
      clickShow: false,
      isPermission: false
    };
  },
  created() {},
  watch: {
    loading: {
      handler(val, oldVal) {
        this.loading = val;
      },
      deep: true,
    },
    pagesTitle: {
        handler(val, oldVal) {
            this.pagesTitle = val
        },
        immediate: true
    },
  },
  mounted() {
    let $this = this;
    let userInfo = this.getLocalStorage();
    if(userInfo.PostName=='总经理'  || 
      userInfo.PostName=='副总经理' ||
      userInfo.PostName=='技术开发'  || 
      userInfo.PostName=='开发经理'  || 
      userInfo.PostName=='票务经理'){
      this.isPermission = true
    }else{
      this.isPermission = false
    }
    this.MsgBus.$on("closeaddContacts", function() {
      $this.commissionPopUpVisible = false;
      $this.emptyMore()
    });
    
  },
  methods: {
    // 获取业务员
    Employee() {
        let userInfo = this.getLocalStorage();
        let msg = {
            RB_Group_id: userInfo.RB_Group_id,
            BranchId: -1,
            DepartmentId: 0,
            PostId: 0,
            IsLeave: 0,
        };
        this.apipost2(
            "admin_get_EmployeeGetList",
            msg,
            (res) => {
                if (res.data.resultCode == 1) {
                    this.EmployeeList = res.data.data;
                } else {}
            },
            (err) => {}
        );
    },
    submitForm(form) {
      if(!this.form.LureEmpId){
        this.Error('请选择需要转交的引流人！')
        return
      }
      let msg = {
        OrderId:this.form.OrderId,
        LureEmpId:this.form.LureEmpId,
        OrderType:this.form.OrderType
      }
      this.clickShow = true
      this.apipost2('CarSingle_post_UpdateLureEmpId', msg, res => {
        this.clickShow = false
        if (res.data.resultCode == 1) {
          this.dialogTableVisible = false
          this.Success('操作成功！')
          this.$emit('success')
        }else{
          this.Error(res.data.message)
        }
      });
    },
    goTurn(row){
      this.Employee()
      this.form = {
        OrderId: row.OrderId,
        LureEmpId: null,
        OrderType: row.OrderType
      }
      this.dialogTableVisible = true
    },
    resetForm(form) {
      this.clickShow = false
      this.dialogTableVisible = false;
    },
    goDetails(row){
      let data = [{
          path: "",
          OrderId: row.OrderId,
          Type: ''
        }]
        let href
        let url = this.domainManager().erpRoutingUrl;
        
      if (row.OrderType == 1) {
        let name = ''
        if(this.pagesTitle=='销售'||this.pagesTitle=='详情'){
          name = 'myCustomerOrder'
        }else{
          name = 'customerOrder'
        }
        this.$router.push({
          name: name,
          query: {
            OrderId: row.OrderId,
            blank: "y",
          }
        });
      }else{
        if (row.OrderType == 6) {
          if(this.pagesTitle=='销售'||this.pagesTitle=='详情'){
            data[0].path = 'VisaProductEditOrder'
          }else{
            data[0].path = 'VisaProductEditOrderOP'
          }
          href =url +"automaticLogin?token=" +this.getLocalStorage().token +"&data=" + JSON.stringify(data);
        }else if (row.OrderType == 2) {//跟团 一日游
          if(this.pagesTitle=='销售'||this.pagesTitle=='详情'){
            if(row.IsOneDayOrder==1){
              data[0].path = 'groupTourOrderOne'
            }else{
              data[0].path = 'groupTourOrder'
            }
            href =url +"automaticLogin?token=" +this.getLocalStorage().token +"&data=" +JSON.stringify(data);
          }else{
            data[0].path = 'enrollTotal'
            href =url +"automaticLogin?token=" +this.getLocalStorage().token +"&data=" +JSON.stringify(data);
          }
        }
        else if (row.OrderType == 3) {//酒店
          if(this.pagesTitle=='销售'||this.pagesTitle=='详情'){
            data[0].path = 'singleProductHotelOrder'
          }else{
            data[0].path = 'singleProductHotelOrderOP'
          }
          href =url +"automaticLogin?token=" +this.getLocalStorage().token +"&data=" +JSON.stringify(data);
        }
        else if (row.OrderType == 4) {//门票
          if(this.pagesTitle=='销售'||this.pagesTitle=='详情'){
            data[0].path = 'SingleticketOrderList'
          }else{
            data[0].path = 'SingleticketOrderListOP'
          }
          href =url +"automaticLogin?token=" +this.getLocalStorage().token +"&data=" +JSON.stringify(data);
        }
        else if (row.OrderType == 5) {//包车 1接机   2送机   3包车
          if(row.CarType==''||row.CarType==null){
            this.GetAdminCarOrderPageList(row,url,href,data)
          }else{
            if(this.pagesTitle=='销售'||this.pagesTitle=='详情'){
              data[0].path = 'CharterOrderList'
            }else{
              data[0].path = 'CharterOrderListOP'
            }
            data[0].Type = row.CarType==null||!row.CarType?4:row.CarType
            href =url +"automaticLogin?token=" +this.getLocalStorage().token +"&data=" +JSON.stringify(data);
          }
            
        }
        else if (row.OrderType == 7) {//jalan酒店
          this.$message.info('jalan酒店暂不支持查看')
          // if(this.pagesTitle=='销售'){
          //   data[0].path = 'CharterOrderList'
          // }else{
          //   data[0].path = 'CharterOrderListOP'
          // }
          // href =url +"automaticLogin?token=" +this.getLocalStorage().token +"&data=" +JSON.stringify(data);
        }
        if(href){window.open(href);}
        
      }
    },
    GetAdminCarOrderPageList(row,url,href,data){
      let msg = {
              pageIndex: 1,
              pageSize: 5,
              OrderType: '',
              OrderId: row.OrderId,
              OrderNo: '',
              SurName: '',
              Name: '',
              OrderStatus: 0,
              StartTime: '',
              EndTime: '',
              OrderSTime: '',
              OrderETime: '',
              ProductName: '',
              Mobile: '',//电话
              IsSelectSale: 1,
              EnterID: 0,//业务员
          }
          this.apipost2('CarSingle_post_GetAdminCarOrderPageList', msg, res => {
              if (res.data.resultCode == 1) {
                let pageData = res.data.data.pageData
                let OrderType
                if(pageData&&pageData.length>0){
                    OrderType = pageData[0].OrderType
                }
                data[0].Type = OrderType?OrderType:4
                if(this.pagesTitle=='销售'||this.pagesTitle=='详情'){
                  data[0].path = 'CharterOrderList'
                }else{
                  data[0].path = 'CharterOrderListOP'
                }
                href =url +"automaticLogin?token=" +this.getLocalStorage().token +"&data=" +JSON.stringify(data);
                window.open(href)
              }
          })
    },
    // 提成列表
    commissionDetails(item){
      this.parameters = item
      this.commissionPopUpVisible = true
    },
    openNameDetails(item) {
      this.drawer = true;
      this.CustomerId = item.GuestId;
      this.CustomerName = item.GuestName;
    },
    handleClose(done) {
      done();
    },
    closeOrderDrawerHandler() {
      this.currentOrder = null;
      this.orderDrawer = false;
    },
  },
};
</script>
<style scoped>
  @import "../../../assets/css/allorder.css";
</style>
