<template>
  <el-table border ref="multipleTable" :data="OrderList" style="width: 100%"
    :default-sort="{prop: 'null', order: 'null'}"
    :sort-by="['Money','Income','PreferTipAmount','PlatformTax','Refund','CostMoney','OrderProfit','DueInMoney']">
    <el-table-column width="200" prop="CreateTimeStr" :label="$t('objFill.v101.commissonBill.dindanid')" show-overflow-tooltip>
      <template slot-scope="scope">
        <div>
          <p class="cursor-pointer c059FF6 fz18 row-c" @click="goDetails(scope.row)">
            <el-tag style="margin-right: 5px;" size="mini">{{scope.row.OrderTypeName}}</el-tag>
            <span>{{scope.row.OrderId}}</span>
          </p>
          <p>{{scope.row.CreateTimeStr}}</p>
        </div>
      </template>
    </el-table-column>
    <el-table-column width="200" prop="CreateTimeStr" :label="$t('visa.v_tuanhao')" show-overflow-tooltip>
      <template slot-scope="scope">
        <div>
          <p class=" fz14" :class="{'cursor-pointer c059FF6':scope.row.OrderType==2}"
            @click="scope.row.OrderType==2?goTuanDetails(scope.row):''">{{scope.row.TCNUM}}</p>
          <p>{{$t('hotel.hotel_StarDate')}}：{{scope.row.StartDate}}</p>
        </div>
      </template>
    </el-table-column>
    <el-table-column :label="$t('objFill.keren')" 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="$t('visaT.sale')">
    </el-table-column>
    <el-table-column prop="LureEmpName" :label="$t('objFill.yingliu')">
    </el-table-column>
    <el-table-column :label="$t('MarketingActi.commName')" show-overflow-tooltip>
      <template slot-scope="scope">
        <div style="max-width: 100px;overflow: hidden;text-overflow: ellipsis">{{scope.row.Name}}</div>
      </template>
    </el-table-column>
    <el-table-column :label="$t('objFill.shangpingxq')" show-overflow-tooltip>
      <template slot-scope="scope">
        <div style="max-width: 100px;overflow: hidden;text-overflow: ellipsis">{{scope.row.Description}}</div>
      </template>
    </el-table-column>
    <el-table-column sortable prop="Money" :label="$t('fnc.a_zongjine')" min-width="100" 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="$t('fnc.shishou')">
    </el-table-column>
    <el-table-column sortable prop="PreferTipAmount" :label="$t('op.RTXF')" min-width="101">
    </el-table-column>
    <el-table-column sortable prop="PlatformTax" :label="$t('fnc.shouxufei')" min-width="100">
    </el-table-column>
    <el-table-column sortable prop="Refund" :label="$t('fnc.tuikuan')">
    </el-table-column>
    <el-table-column sortable prop="CostMoney" :label="$t('hotel.hotel_cost')" >
    </el-table-column>
    <el-table-column sortable prop="DueInMoney" :label="$t('op.Tocollected')">
      <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="$t('objFill.yuqilirun')" 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="$t('fnc.youhui')">
    </el-table-column>
    <el-table-column prop="StateName" :label="$t('admin.admin_status')" show-overflow-tooltip>
      <template slot-scope="scope">
        <span>{{scope.row.StateName}}</span>
      </template>
    </el-table-column>

    <!-- <el-table-column
            :label="$t('system.table_operation')">
            show-overflow-tooltip>
            <template slot-scope="scope">
              <el-button size="mini" type="primary" @click="goDetails(scope.row)">{{$t('fnc.chakan')}}</el-button>
            </template>
        </el-table-column> -->
  </el-table>
</template>
<script>
  export default {
    props: ["OrderList", "pagesTitle"],
    data() {
      return {
        S_CheckBranchOrder: false,
        S_CheckAllOrder: false,
        queryObj: null,
        cdState: false,
        copyId: 0,
        loading0: false,
        loading1: false,
        loading2: false,
        loading3: false,
        BillMakingMsg: {
          // PeroidsId: null,
          // Type: null,
          // EmpIds:'',
          OtherType: 61,
          ReFinanceId: "",
          ReFinanceId2: ""
        },
        userInfo: {},
        msg: {
          OrderId: "",
          LossMoney: 0,
          State: '', //状态 1确认 2已邮寄 3设置自提 4收损
          SelffetchAddress: ''
        },
        msgParameter: {
          IsUpdateMailing: 1,
          OrderId: 0,
          Money: 0.0,
          Remark: '',
          MailingState: '1', //邮寄状态 1自取 2邮寄
          MailingAddress: '', //MailingState =2 填写邮寄
          UseDate: '', //门票日期
          Name: '',
          EName: '',
          Sex: '1', //1男2女
          Birthday: '',
          Mobile: '',
          CouponsId: '', //景点id
          DetailList: [],
        },
        rules2: {
          Name: [{
            required: true,
            message: this.$t('rule.qsrzwm'),
            trigger: 'blur'
          }],
          EName: [{
            required: true,
            message: this.$t('rule.qsrywm'),
            trigger: 'blur'
          }],
          Mobile: [{
              required: true,
              message: this.$t('rule.EnterPNum'),
              trigger: "blur"
            },
            {
              pattern: this.$commonUtils.Regex.el_ISphone,
              message: this.$t('rule.EnterRightNum')
            }
          ],
          MailingAddress: [{
            required: true,
            message: this.$t('objFill.qinshuruyoujidz'),
            trigger: 'blur'
          }],
        },
        outerVisible: false,
        rules: {
          State: [{
            required: true,
            message: this.$t('objFill.qinxuanzhedindanzt'),
            trigger: "change"
          }],
          SelffetchAddress: [{
            required: true,
            message: this.$t('objFill.qinshuruzitidz'),
            trigger: "blur"
          }],
          LossMoney: [{
            required: true,
            message: this.$t('objFill.qinshurushoushunje'),
            trigger: "blur"
          }]
        },
        cancelOrderDialog: false,
        cancelRemark: "",
        cancelOrderId: 0,
        uploadOrderId: 0,
        loading: false,
        fileList: [],
        GuestFile: '',
        ChangeOrderDialog: false,
        OrderStatusType: [{
            Name: this.$t('OrderList.orderStatus.apply'),
            ID: '1'
          },
          {
            Name: this.$t('OrderList.orderStatus.check'),
            ID: '2'
          },
          {
            Name: this.$t('OrderList.orderStatus.cancel'),
            ID: '3'
          },
          {
            Name: this.$t('OrderList.orderStatus.sun'),
            ID: '4'
          },
        ],
        items: null,
        typeState: '',
        Title: ''
      };
    },
    watch: {
      pagesTitle(val, oldval) {
        this.Title = val
      },
      OrderList: {
        handler(val, oldVal) {

        }
      }
    },
    methods: {
      goTuanDetails(row) {
        let name = ''
        if (row.IsOneDayOrder == 1) {
          name = 'groupTourOrderByTuanOne'
        } else {
          name = 'groupTourOrderByTuan'
        }
        this.$router.push({
          name: name,
          query: {
            id: row.TCID,
            tcmun: row.TCNUM,
            blank: "y",
          }
        });
      },
      goDetails(row) {
        let data = [{
          path: "",
          OrderId: row.OrderId,
          Type: ''
        }]
        let href
        let url = this.domainManager().crmRoutingUrl;

        if (row.OrderType == 1) {

          if (this.pagesTitle == '销售' || (!this.S_CheckBranchOrder  && !this.S_CheckAllOrder)) {
            data[0].path = 'myCustomerOrderAllType'
          } else {
            data[0].path = 'customerOrderAllType'
          }
          href = url + 'automaticLogin?token=' + this.getLocalStorage().token + '&data=' + JSON.stringify(data)
          window.open(href);

        } else {
          let name = ''
          if (row.OrderType == 6) {
            if (this.pagesTitle == '销售' || (!this.S_CheckBranchOrder  && !this.S_CheckAllOrder)) {
              name = 'VisaProductEditOrder'
            } else {
              name = 'VisaProductEditOrderOP'
            }
            this.$router.push({
              name: name,
            });
          } else if (row.OrderType == 2) { //跟团 一日游
            if (this.pagesTitle == '销售' || (!this.S_CheckBranchOrder  && !this.S_CheckAllOrder)) {
              if (row.TravelType == 1) {
                name = 'groupTourOrder'
              } else {
                name = 'groupTourOrderOne'
              }
            } else {
              name = 'enrollTotal'
            }
          } else if (row.OrderType == 3) { //酒店
            if (this.pagesTitle == '销售' || (!this.S_CheckBranchOrder  && !this.S_CheckAllOrder)) {
              name = 'singleProductHotelOrder'
            } else {
              name = 'singleProductHotelOrderOP'
            }
          } else if (row.OrderType == 4) { //门票
            if (this.pagesTitle == '销售' || (!this.S_CheckBranchOrder  && !this.S_CheckAllOrder)) {
              name = 'SingleticketOrderList'
            } else {
              name = 'SingleticketOrderListOP'
            }
          } else if (row.OrderType == 5) { //包车
            if(row.CarType==''||row.CarType==null){
              this.GetAdminCarOrderPageList(row,url,href,data)
            }else{
              if(this.pagesTitle=='销售'){
                name = 'CharterOrderList'
              }else{
                name = 'CharterOrderListOP'
              }
              data[0].Type = row.CarType==null||!row.CarType?4:row.CarType
            }
          } else if (row.OrderType == 7) { //jalan酒店
            this.$message.info(this.$t('objfill.v101.financialmodule.zhanbzck'))
            // if(this.pagesTitle=='销售'){
            //   name = 'CharterOrderList'
            // }else{
            //   name = 'CharterOrderListOP'
            // }
          }
          if (name) {
            this.$router.push({
              name: name,
              query: {
                OrderId: row.OrderId,
                blank: "y",
              }
            });
          }

        }
      },
      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, //业务员
        }
        let name
        this.apipost('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
            }
            if (this.pagesTitle == '销售' || (!this.S_CheckBranchOrder  && !this.S_CheckAllOrder)) {
              name = 'CharterOrderList'
            } else {
              name = 'CharterOrderListOP'
            }
            this.$router.push({
              name: name,
              query: {
                OrderId: row.OrderId,
                OrderType: OrderType ? OrderType : 4,
                blank: "y",
              }
            });
          }
        })
      },

    },
    mounted() {
      let userInfo = this.getLocalStorage();
      let ActionMenuCode = userInfo.ActionMenuCode;
      this.userInfo = this.getLocalStorage();
      // 判断是否销售
      if (ActionMenuCode.indexOf('S_CheckBranchOrder') != -1) {
        this.S_CheckBranchOrder = true
      }
      if (ActionMenuCode.indexOf('S_CheckAllOrder') != -1) {
        this.S_CheckAllOrder = true
      }
    }
  };

</script>

<style scoped>
  .row {
    display: flex;
  }

  .row-c {
    display: flex;
    align-items: center;
  }

  .column {
    display: flex;
    flex-direction: column;
  }

  .column-jac {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  .column-ac {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .wrap {
    flex-wrap: wrap;
  }

  .justify-sb {
    justify-content: space-between;
  }

  .justify-c {
    justify-content: center;
  }

  .justify-e {
    justify-content: flex-end;
    align-items: flex-end;
  }

  .flex-g {
    flex-grow: 1;
  }

  .flex-s {
    flex-shrink: 0;
  }

  .align-c {
    align-items: center;
  }

  .cblack {
    color: black;
  }

  .cf {
    color: #ffffff;
  }

  .c9e {
    color: #9e9e9e;
  }

  .c20C997 {
    color: #20c997;
  }

  .c02C854 {
    color: #02c854;
  }

  .cff9800 {
    color: #ff9800;
  }

  .cF1416C {
    color: #f1416c;
  }

  .cF57A98 {
    color: #f57a98;
  }

  .c04C8C8 {
    color: #04c8c8;
  }

  .c059FF6 {
    color: #059ff6;
  }

  .c3FC4FF {
    color: #3fc4ff;
  }

  .fz10 {
    font-size: 10px;
  }

  .fz11 {
    font-size: 11px;
  }

  .fz12 {
    font-size: 12px;
  }

  .fz13 {
    font-size: 13px;
  }

  .fz14 {
    font-size: 14px;
  }

  .fz15 {
    font-size: 15px;
  }

  .fz16 {
    font-size: 16px;
  }

  .fz17 {
    font-size: 17px;
  }

  .fz18 {
    font-size: 18px;
  }

  .fbold {
    font-weight: bold;
  }

  .ml {
    margin-left: 10px;
  }

  .mr {
    margin-right: 10px;
  }

  .mt {
    margin-top: 10px;
  }

  .mt20 {
    margin-top: 20px;
  }

  .mb {
    margin-bottom: 10px;
  }

  .mb20 {
    margin-bottom: 20px;
  }

  .mx {
    margin-left: 10px;
    margin-right: 10px;
  }

  .mx5 {
    margin-left: 5px;
    margin-right: 5px;
  }

  .mb5 {
    margin-bottom: 5px;
  }

  .py {
    padding: 15px 0;
  }

  .py5 {
    padding: 5px 0;
  }

  .px5 {
    padding: 0 5px;
  }

  .px15 {
    padding: 0 15px;
  }

  .pa15 {
    padding: 15px;
  }

  .py20 {
    padding: 20px 0;
  }

  .pb5 {
    padding: 0 0 5px 0;
  }

  .pa {
    padding: 10px 20px;
  }

  .pa20 {
    padding: 20px;
  }

  .pt20 {
    padding: 20px 0;
  }

  .borderD {
    border-bottom: 1px dashed #dddddd;
  }

  .bgf {
    background: #ffffff;
  }

  .bgf5 {
    background: #f5f5f5;
  }

  .bgE8F5E9 {
    background: #e8f5e9;
  }

  .bgD9F3FF {
    background: #d9f3ff;
  }

  .bgFAEAED {
    background: #faeaed;
  }

  .bj {
    background: #ffffff;
  }

  .bjFFF3E0 {
    background: #FFF3E0;
  }

  .radius5 {
    border-radius: 5px;
  }

  .cursor-pointer {
    cursor: pointer;
  }

  .relative {
    position: relative;
  }

  .absolute {
    position: absolute;
  }

  .left0 {
    left: 0;
  }

  .right0 {
    right: 0;
  }

  .top0 {
    top: 0;
  }

  .bottom0 {
    bottom: 0;
  }

  .left20 {
    left: 020px;
  }

  .right20 {
    right: 20px;
  }

  .top20 {
    top: 20px;
  }

  .bottom20 {
    bottom: 20px;
  }

  .text-center {
    text-align: center;
  }

</style>