<template>
  <div class="flexOne groupts">
    <div class="enrollTotalSearch">
      <ul>
        <li>
          <span
            ><em>{{ $t("advmanager.v_line") }}</em>
            <el-select
              class="w200"
              v-model="msg.LineId"
              filterable
              :placeholder="$t('pub.pleaseSel')"
              @change="getLineTeamList(msg.LineId)"
            >
              <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("advmanager.v_xilie") }}</em>
            <el-select
              class="w200"
              v-model="msg.LineteamId"
              filterable
              :placeholder="$t('pub.pleaseSel')"
            >
              <el-option :label="$t('pub.unlimitedSel')" :value="0"></el-option>
              <el-option
                v-for="item in LineTeamList"
                :label="item.LtName"
                :value="item.LtID"
                :key="item.LtID"
              >
              </el-option>
            </el-select>
          </span>
        </li>
        <li>
          <span
            ><em>{{ $t("system.table_company") }}</em>
            <el-select
              class="w200"
              v-model="msg.BranchId"
              filterable
              :placeholder="$t('pub.pleaseSel')"
              @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 v-show="!isOwn">
          <span
            ><em class="fl" style="margin-top: 10px !important">{{
              $t("fnc.bmxuanze")
            }}</em>
            <treeselect
              class="w200 fl"
              :options="departmentList"
              v-model="msg.RB_Department_Id"
              :label="$t('pub.unlimitedSel')"
              :normalizer="normalizer"
              @select="linkageEmployeeMsg"
            />
          </span>
        </li>
        <li>
          <span
            ><em>{{ $t("fnc.ctleixing") }}</em>
            <el-select
              class="w200"
              v-model="msg.GroupType"
              filterable
              :placeholder="$t('pub.pleaseSel')"
            >
              <el-option :label="$t('pub.unlimitedSel')" value="-1"></el-option>
              <el-option
                v-for="item in ctlxList"
                :key="item.Id"
                :label="item.Name"
                :value="item.Id"
              ></el-option>
            </el-select>
          </span>
        </li>
        <li>
          <span
            ><em>{{ $t("visa.v_tuanhao") }}</em></span
          >
          <el-input class="w200" v-model="msg.TCNUM"></el-input>
        </li>
        <li v-show="!isOwn">
          <span
            ><em>{{ $t("fnc.ryxuanze") }}</em></span
          >
          <el-select
            class="w200"
            v-model="msg.CreateBy"
            filterable
            :placeholder="$t('pub.pleaseSel')"
          >
            <el-option :label="$t('pub.unlimitedSel')" value="-1"></el-option>
            <el-option
              v-for="item in employeeList"
              :key="item.empId"
              :label="item.name"
              :value="item.empId"
            >
              <span style="float: left"
                >{{ item.name }}
                <template v-if="item.isLeave == 1">
                  <span style="color: red">(已离职)</span>
                </template>
              </span>
            </el-option>
          </el-select>
        </li>
        <li>
          <span
            ><em>{{ $t("hotel.order_Number") }}</em></span
          >
          <el-input class="w200" v-model="msg.tempOrderId"></el-input>
        </li>
        <li>
          <span
            ><em>{{ $t("hotel.hotel_OrderStates") }}</em></span
          >
          <el-select
            class="w200"
            v-model="msg.OrderState"
            filterable
            :placeholder="$t('pub.pleaseSel')"
            style="width: 180px"
          >
            <el-option :label="$t('pub.unlimitedSel')" value="-1"></el-option>
            <el-option
              v-for="item in ddztList"
              :label="item.Name"
              :value="item.Id"
              :key="item.Id"
            >
            </el-option>
          </el-select>
        </li>
        <li>
          <span
            ><em>{{ $t("active.cl_orderType") }}</em></span
          >
          <el-select
            class="w200"
            v-model="msg.IsOneDay"
            filterable
            :placeholder="$t('pub.pleaseSel')"
            style="width: 180px"
          >
            <el-option :label="$t('pub.unlimitedSel')" value="-1"></el-option>
            <el-option
              :label="$t('salesModule.TourOrder')"
              :value="0"
            ></el-option>
            <el-option
              :label="$t('salesModule.OneDayOrder')"
              :value="1"
            ></el-option>
          </el-select>
        </li>
        <li>
          <span
            ><em>{{ $t("salesModule.PaymentStatus") }}</em></span
          >
          <el-select
            class="w200"
            v-model="msg.IsCollectMoney"
            filterable
            :placeholder="$t('pub.pleaseSel')"
            style="width: 180px"
          >
            <el-option :label="$t('pub.unlimitedSel')" :value="0"></el-option>
            <el-option
              :label="$t('salesModule.Collect')"
              :value="1"
            ></el-option>
            <el-option
              :label="$t('salesModule.NoCollect')"
              :value="2"
            ></el-option>
          </el-select>
        </li>
        <li>
          <span
            ><em>优惠券</em>
            <el-select
              class="w200"
              v-model="msg.IsUseCoupon"
              filterable
              :placeholder="$t('pub.pleaseSel')"
            >
              <el-option :label="$t('pub.unlimitedSel')" value="0"></el-option>
              <el-option label="是" :value="1" :key="1"></el-option>
              <el-option label="否" :value="2" :key="2"></el-option>
            </el-select>
          </span>
        </li>
        <li>
          <span
            ><em>幸福存折</em>
            <el-select
              class="w200"
              v-model="msg.IsUseRedEnvelopeMoney"
              filterable
              :placeholder="$t('pub.pleaseSel')"
            >
              <el-option :label="$t('pub.unlimitedSel')" value="0"></el-option>
              <el-option label="是" :value="1" :key="1"></el-option>
              <el-option label="否" :value="2" :key="2"></el-option>
            </el-select>
          </span>
        </li>
        <li>
          <span
            ><em>{{ $t("scen.sc_ftTime") }}</em>
            <el-date-picker
              v-model="msg.QStartDate"
              @change="dataDuiQ()"
              class="w135"
              value-format="yyyy-MM-dd"
              type="date"
            ></el-date-picker>
            -
            <el-date-picker
              v-model="msg.QEndDate"
              @change="dataDuiQ()"
              class="w135"
              value-format="yyyy-MM-dd"
              type="date"
            ></el-date-picker>
          </span>
        </li>
        <li>
          <span
            ><em>{{ $t("fnc.bmriqi") }}</em>
            <el-date-picker
              v-model="msg.CStartDate"
              @change="dataDui()"
              class="w135"
              value-format="yyyy-MM-dd"
              type="date"
            ></el-date-picker>
            -
            <el-date-picker
              v-model="msg.CEndDate"
              @change="dataDui()"
              class="w135"
              value-format="yyyy-MM-dd"
              type="date"
            ></el-date-picker>
          </span>
        </li>

        <li>
          <input
            type="button"
            class="hollowFixedBtn"
            :value="$t('pub.searchBtn')"
            @click="
              getList();
              resetPageIndex();
            "
          />
        </li>
      </ul>
    </div>
    <!-- 统计版块 -->
    <div class="groupTourOrder_count">
      <el-row :gutter="20">
        <el-col :span="5" class="groupTourOrder_count_col">
          <div class="groupTourOrder_count_item">
            <div>
              <i class="iconfont icon-qian groupTourOrder_count_green"></i>
              <span>{{ $t("Operation.Op_salesTotal") }}</span>
            </div>
            <p>
              <span
                >{{ $t("salesModule.Ypay") }}：{{
                  countData.PreferPrice
                }};</span
              >
              <span
                >{{ $t("Operation.Op_yiShou") }}：{{ countData.Income }};</span
              >
              <span
                :class="{
                  color_red_order:
                    countData.DueinMoney !== countData.PreferPrice,
                }"
                >{{ $t("Operation.Op_weiShou") }}：{{
                  countData.DueinMoney
                }};</span
              >
              <span>{{ $t("fnc.ztjine") }}：{{ countData.ZaiTu }};</span>
            </p>
          </div>
        </el-col>
        <el-col :span="4" class="groupTourOrder_count_col">
          <div class="groupTourOrder_count_item">
            <div class="groupTourOrder_count_blue">
              <i class="iconfont icon-baomingrenshu"></i>
              <span>{{ $t("fnc.zcbmrenshu") }}</span>
              <span>{{ countData.NormalGuestNum }}</span>
            </div>
            <p>
              <span
                >{{ $t("Airticket.Air_EconomyClass") }}：{{
                  countData.NormalYSeatNum
                }};</span
              >
              <span
                >{{ $t("Airticket.Air_businessClass") }}：{{
                  countData.NormalESeatNum
                }};</span
              >
              <span
                >{{ $t("Airticket.Air_firstClass") }}：{{
                  countData.NormalFSeatNum
                }};</span
              >
            </p>
          </div>
        </el-col>
        <el-col :span="4" class="groupTourOrder_count_col">
          <div class="groupTourOrder_count_item">
            <div class="groupTourOrder_count_yellow">
              <i class="iconfont icon-baomingrenshu"></i>
              <span>{{ $t("fnc.qxrenshu") }}</span>
              <span>{{ countData.CancelGuestNum }}</span>
            </div>
            <p>
              <span
                >{{ $t("Airticket.Air_EconomyClass") }}：{{
                  countData.CancelYSeatNum
                }};</span
              >
              <span
                >{{ $t("Airticket.Air_businessClass") }}：{{
                  countData.CancelESeatNum
                }};</span
              >
              <span
                >{{ $t("Airticket.Air_firstClass") }}：{{
                  countData.CancelFSeatNum
                }};</span
              >
            </p>
          </div>
        </el-col>
        <el-col :span="4" class="groupTourOrder_count_col">
          <div class="groupTourOrder_count_item">
            <div>
              <i class="iconfont icon-tongji1 groupTourOrder_count_gray"></i>
              <span>{{ $t("fnc.qtxtongji") }}</span>
            </div>
            <p>
              <span
                >{{ $t("fnc.nbbaoming") }}：{{ countData.InteriorNum }};</span
              >
              <span>{{ $t("fnc.B2BWAP") }}：{{ countData.B2BNum }};</span>
            </p>
          </div>
        </el-col>
        <el-col :span="4" class="groupTourOrder_count_col">
          <div class="groupTourOrder_count_item">
            <div>
              <i class="iconfont icon-tongji1 groupTourOrder_count_gray"></i>
              <span>{{ $t("fnc.cwdjshuoming") }}</span>
            </div>
            <p>
              <span class="groupTourOrderByTuan_ico"
                ><i style="background-color: #0000ff"></i
                ><span>{{ $t("fnc.yidadan") }}</span></span
              >
              <span class="groupTourOrderByTuan_ico"
                ><i style="background-color: #00ff00"></i
                ><span>{{ $t("fnc.ptcnyshenhe") }}</span></span
              >
              <span class="groupTourOrderByTuan_ico"
                ><i style="background-color: #ff0000"></i
                ><span>{{ $t("fnc.yhcnyshenhe") }}</span></span
              >
              <span class="groupTourOrderByTuan_ico"
                ><i style="background-color: #000000"></i
                ><span>{{ $t("fnc.ytongguo") }}</span></span
              >
            </p>
          </div>
        </el-col>
        <el-col :span="3" class="groupTourOrder_count_col">
          <div class="groupTourOrder_count_item">
            <div>
              <i class="iconfont icon-tongji1 groupTourOrder_count_gray"></i>
              <span>{{ $t("salesModule.LJTC") }}</span>
            </div>
            <p>
              <span
                >{{ $t("salesModule.TCmoney") }}：{{
                  countData.SumCommissionMoney
                }};</span
              >
            </p>
            <p>
              <span>额外提成：{{ countData.ExtraCommissionMoney }};</span>
            </p>
          </div>
        </el-col>
      </el-row>
    </div>
    <!-- 表格 -->
    <div style="clear: both; width: 100%; height: 20px"></div>
    <table
      class="enrollTotalSearchTable"
      border="0"
      cellspacing="0"
      cellpadding="0"
      v-loading="loading"
    >
      <tr>
        <th width="160">{{ $t("fnc.danhao") }}&{{ $t("visa.v_tuanhao") }}</th>
        <th width="60">{{ $t("fnc.khxinxi") }}</th>
        <th width="70">{{ $t("salesModule.Type") }}</th>
        <th width="180">
          {{ $t("advmanager.v_xilie") }}&{{ $t("advmanager.v_line") }}
        </th>
        <th width="100">
          {{ $t("Airticket.Air_Number") }}/{{ $t("salesModule.AirNum")
          }}{{ $t("salesModule.AirNum") }}
        </th>
        <th width="80">{{ $t("fnc.danjia") }}</th>
        <th width="80">{{ $t("fnc.cjdanjia") }}</th>
        <th width="80">{{ $t("fnc.yszonge") }}</th>
        <th width="80">{{ $t("fnc.shishou") }}</th>
        <th width="70">{{ $t("fnc.youhui") }}</th>
        <th width="70">{{ $t("salesModule.HappinessPassbook") }}</th>
        <th width="70">{{ $t("fnc.xiaofei") }}</th>
        <th width="70">{{ $t("fnc.tuikuan") }}</th>
        <th width="70">{{ $t("fnc.ptshuijin") }}</th>
        <th width="80">{{ $t("Operation.Op_platZaitu") }}</th>
        <th width="80">{{ $t("Operation.Op_daishou") }}</th>
        <th width="60">{{ $t("admin.admin_status") }}</th>
        <th v-if="isEditOrderCreate == 1" width="140">
          {{ $t("admin.admin_operate") }}
        </th>
      </tr>
      <tr>
        <td
          v-show="list.length == 0"
          :colspan="isEditOrderCreate == 1 ? 18 : 17"
          align="center"
        >
          {{ $t("system.content_noData") }}
        </td>
      </tr>
      <tbody v-for="(item, index) in list" :key="index">
        <tr>
          <td rowspan="3" style="position: relative;">
            <span class="TC_neibu" style="float: inherit;margin-left: 5px;margin-right: 5px;position: absolute;top: 10px;left:3px" v-if="item.standardCurrencyName"
            :class="{'TCneibu':item.standardCurrencyName=='人民币','TCb2b':item.standardCurrencyName=='日元',
            'TCb2c':item.standardCurrencyName=='新台币','AppPlat':item.standardCurrencyName=='',
            'otherPlat':item.standardCurrencyName=='',}">{{item.standardCurrencyName}}结算</span>
            <p v-if="item.isChargeLossOrders == 1" style="color: red">
              {{ $t("fnc.sun") }}
            </p>
            <p
              class="fbold over_ellipsis"
              style="width: 100%; cursor: pointer"
              :title="item.orderId"
              @click="
                goUrlX(
                  '团报名清单',
                  item.isOneDay === 1
                    ? 'groupTourOrderByTuanOne'
                    : 'groupTourOrderByTuan',
                  item.tcid,
                  item.tcnum
                )
              "
            >
              <span>{{ item.orderId }}</span>
              <span
                style="font-weight: 100"
                v-if="item.scoreNum >= 0"
                @click="goInvetig('investigationList', item.tcid, item.orderId)"
                >({{ $t("salesModule.ScoreNUM") }}{{ item.scoreNum }})</span
              >
              <el-tooltip
                class="item"
                effect="dark"
                :content="$t('salesModule.ByProgram')"
                placement="top"
                v-show="item.orderForm == 4"
              >
                <i
                  class="iconfont icon-xiaochengxu"
                  style="font-size: 22px; color: red"
                ></i>
              </el-tooltip>
              <el-tooltip
                class="item"
                effect="dark"
                :content="$t('salesModule.ByB2b')"
                placement="top"
                v-show="item.isFormB2B == 1"
              >
                <i
                  class="iconfont icon-tiaozheng"
                  style="font-size: 22px; color: #297bef"
                ></i
              ></el-tooltip>
            </p>
            <p
              class="fz12 over_ellipsis"
              style="width: 100%; text-decoration: underline; cursor: pointer"
              :title="item.alName"
              @click="
                goUrlX(
                  '产品查询',
                  item.isOneDay === 1 ? 'productQueryOne' : 'productQuery',
                  item.tcid,
                  item.tcnum
                )
              "
            >
              {{ item.tcnum }}
            </p>
            <p class="fz12 over_ellipsis" style="width: 100%">
              {{ item.createBy
              }}<span v-if="item.leaveStr != ''" style="color: red"
                >({{ item.leaveStr }})</span
              >
            </p>
            <p class="fz12 over_ellipsis" style="width: 100%">
              {{
                item.commissionSPeopleName == "无"
                  ? ""
                  : item.commissionSPeopleName
              }}
            </p>
            <p>{{ $t("hotel.hotel_StartTeam") }}：{{ item.startDate }}</p>
            <p v-if="item.tradeWay == 1">{{ item.platformOrder }}</p>
            <!-- <p v-if="item.commissionMoney" style="color: red;">
              {{ $t("salesModule.CommissionNum") }}：{{ item.commissionMoney }}
            </p>
            <p v-else-if="item.latestCommissionMoney" style="color: red">
              {{ $t("salesModule.CommissionNum") }}：{{
                item.latestCommissionMoney
              }}
            </p> -->
            <div>
              <div
                style="color: green"
                v-if="
                  item.commissionMoney == '' || item.commissionMoney == '-1'
                "
              >
                <p v-if="item.extraRewardMoney > 0">
                  {{ $t("salesModule.EWJLJE") }}：{{ item.extraRewardMoney }}
                </p>
                <p v-if="item.extraDeductMoney > 0">
                  {{ $t("salesModule.EWKCJE") }}：{{ item.extraDeductMoney }}
                </p>
              </div>
              <div style="color: red" v-else>
                <p v-if="item.extraRewardMoney > 0">
                  {{ $t("salesModule.EWJLJE") }}：{{ item.extraRewardMoney }}
                </p>
                <p v-if="item.extraDeductMoney > 0">
                  {{ $t("salesModule.EWKCJE") }}：{{ item.extraDeductMoney }}
                </p>
              </div>
              <div style="color: red">
                <p v-if="item.unionExtraMoney != 0">
                  {{ $t("salesModule.LYEWFY") }}：{{ item.unionExtraMoney }}
                </p>
              </div>
            </div>
            <div
              v-if="item.orderTypeName === '单团'"
              style="color: red; cursor: pointer"
              @click="seeBJD(item.quotationUrl)"
            >
              查看报价单
            </div>
          </td>
          <td>
            <p
              class="over_ellipsis"
              style="width: 150px"
              :title="item.contactName"
            >
              {{ item.contactName }}
            </p>
            <p>{{ item.contactMobile }}</p>
            <p v-if="item.industryCategory !== ''" style="color: green">
              {{ $t("salesModule.HYLB") }}：{{ item.industryCategory }}
            </p>
          </td>
          <td>
            <p class="fz12 over_ellipsis" style="width: 100%">
              {{ item.orderTypeName }}
            </p>
          </td>
          <td class="fz12">
            <p
              style="max-width: 160px; display: block"
              class="over_ellipsis"
              :title="item.lineName"
            >
              <span>{{ item.lineName }}</span>
            </p>
            <p
              style="max-width: 160px; display: block"
              class="over_ellipsis"
              :title="item.ltName"
            >
              {{ item.ltName }}
            </p>
          </td>
          <td>
            {{ item.guestNum }}/{{
              item.ySeatNum > 0 ? item.ySeatNum + "Y " : ""
            }}{{ item.eSeatNum > 0 ? item.eSeatNum + "E " : ""
            }}{{ item.fSeatNum > 0 ? item.fSeatNum + "F " : "" }}
            <br />
            <span v-if="item.refuseVisaNum > 0" style="color: red">
              ({{ $t("salesModule.RefuseQ") }}{{ item.refuseVisaNum
              }}{{ $t("salesModule.PeoPle") }})
            </span>
          </td>
          <td style="color: #ff9c00">{{ item.tC_Price }}</td>
          <td style="color: #ff9c00">￥{{ item.unit_Price }}</td>
          <td>
            <p style="color: #ff9c00">￥{{ item.preferPrice }}</p>
          </td>

          <td>
            <span v-if="item.dueInMoney == 0" style="cursor: pointer">{{
              item.income
            }}</span>
            <span
              v-if="item.dueInMoney != 0"
              style="cursor: pointer; color: #e95252"
              >{{ item.income }}</span
            >
          </td>
          <!-- 优惠 -->
          <td>
            <el-popover style="padding: 0" width="600" trigger="click">
              <div class="personNolayer">
                <table border="0" cellspacing="1" cellpadding="1">
                  <tr>
                    <th>{{ $t("active.cl_couponName") }}</th>
                    <th>{{ $t("active.cl_couponType") }}</th>
                    <th>{{ $t("active.cl_dkjezk") }}</th>
                    <th>{{ $t("active.cl_sytiaojian") }}</th>
                    <th>{{ $t("active.cl_huoqufangshi") }}</th>
                    <th>{{ $t("active.cl_hqriqi") }}</th>
                  </tr>
                  <tr
                    v-if="item.couponAllotList.length > 0"
                    v-for="(item2, index2) in item.couponAllotList"
                    :key="index2"
                  >
                    <td>{{ item2.couponsName }}</td>
                    <td>
                      <span v-if="item2.couponsType == 1">{{
                        $t("active.cl_dyquan")
                      }}</span>
                      <span v-if="item2.couponsType == 2">{{
                        $t("active.cl_zkquan")
                      }}</span>
                    </td>
                    <td>{{ item2.denomination }}</td>
                    <td>
                      {{ $t("active.cl_man") }}{{ item2.useCondition
                      }}{{ $t("active.cl_keyong") }}
                    </td>
                    <td>
                      <span v-if="item2.accessType == 1">{{
                        $t("active.cl_choujiang")
                      }}</span>
                      <span v-else></span>
                    </td>
                    <td>{{ item2.acessDate }}</td>
                  </tr>
                  <tr v-if="item.couponAllotList.length == 0">
                    <td colspan="6" align="center">
                      {{ $t("system.content_noData") }}
                    </td>
                  </tr>
                </table>
              </div>
              <span
                style="
                  cursor: pointer;
                  color: #e95252;
                  text-decoration: underline;
                "
                slot="reference"
                >{{ moneyFormat(item.discountMoney) }}</span
              >
            </el-popover>
          </td>
          <td>
            <el-popover
              v-if="item.customerId || item.customerId == 0"
              style="padding: 0"
              width="600"
              trigger="click"
            >
              <div class="personNolayer">
                <table border="0" cellspacing="1" cellpadding="1">
                  <tr>
                    <th>{{ $t("fnc.jine") }}</th>
                    <th>{{ $t("admin.admin_type") }}</th>
                    <th>{{ $t("system.label_info") }}</th>
                    <th>
                      {{ $t("salesModule.Time") }}（<span
                        @click="goUrlHappy(item)"
                        style="cursor: pointer"
                        colspan="4"
                        align="center"
                        >{{ $t("salesModule.LookMore") }}</span
                      >）
                    </th>
                  </tr>
                  <tr v-for="(item2, index2) in redBagList" :key="index2">
                    <td>{{ item2.Money }}</td>
                    <td>
                      {{ item2.Type == 1 ? "收入" : "折扣" }}
                    </td>
                    <td>{{ item2.Description }}</td>
                    <td>{{ item2.UpdateTime }}</td>
                  </tr>
                  <tr v-if="redBagList.length == 0">
                    <td colspan="4" align="center">
                      {{ $t("system.content_noData") }}
                    </td>
                  </tr>
                  <tr>
                    <!-- <td @click="goUrlHappy(item)" style="cursor: pointer;" colspan="4" align="center">查看更多</td> -->
                  </tr>
                </table>
              </div>
              <span
                @click="getRedBag(item)"
                style="
                  cursor: pointer;
                  color: #e95252;
                  text-decoration: underline;
                "
                slot="reference"
                >{{ item.redEnvelopeMoney }}</span
              >
            </el-popover>
            <span v-else style="color: #e95252; text-decoration: underline">{{
              item.redEnvelopeMoney
            }}</span>
          </td>
          <td v-if="item.tipMoney">{{ item.tipMoney }}</td>
          <td v-else>0.00</td>

          <td>{{ item.refund }}</td>
          <td>{{ item.platformTax }}</td>
          <td>{{ item.zaiTuMoney }}</td>
          <td>
            <span
              :class="{ color_red_order: item.dueInMoney !== item.preferPrice }"
              >{{ item.dueInMoney }}</span
            >
          </td>
          <td
            v-if="item.isChargeLossOrders == 1"
            class="fz12"
            style="color: #e95252"
          >
            {{ $t("fnc.shousun") }}
          </td>
          <td
            v-else
            class="fz12"
            :style="item.orderState === 3 ? 'color: #e95252;' : ''"
          >
            {{ item.statsstr }}
          </td>
          <td v-if="isEditOrderCreate == 1">
            <button
              class="normalBtn"
              style="margin-left: 0; width: 95px; padding: 0"
              @click="getSalerInfo(item)"
            >
              {{ $t("salesModule.UpdateYWY") }}
            </button>
          </td>
        </tr>
        <tr style="height: 20px">
          <td
            :colspan="isEditOrderCreate == 1 ? 17 : 16"
            class="RL_Order"
            style="height: 20px"
          >
            <span style="font-size: 14px; color: #333333"
              >{{ $t("salesModule.MD") }}:</span
            >
            <span
              v-for="childItem in item.guestList"
              style="font-size: 14px; color: blue"
              >{{ childItem.userName }}&nbsp;&nbsp;</span
            >
            <p v-if="item.cancelGuestList && item.cancelGuestList.length > 0">
              <span class="">{{ $t("salesModule.CancelOrder") }}:</span>
              <span class="RL-redType RL-remarkCon">
                <span
                  style="color: red"
                  v-for="childItem in item.cancelGuestList"
                  >{{ childItem.userName }} &nbsp;&nbsp;</span
                >
              </span>
            </p>
            <span style="display: block; font-size: 14px; color: #333333"
              >{{ $t("salesModule.RoomInfo")
              }}<span v-if="item.oneSex > 0" style="color: #e95252"
                >（{{ item.oneSex == 1 ? "单男" : "单女" }}）</span
              >：{{ item.orderGuestHouseStr }}</span
            >
          </td>
        </tr>
        <tr>
          <td colspan="4" class="groupTourOrder_remarks" style="height: 40px">
            <div>
              <div v-if="item.gatherAddress" style="font-size: 14px;">
                <span style="color: rgb(26, 168, 107);">集合地：</span>
                <span style="color: rgb(26, 168, 107);">{{ item.gatherAddress }}</span>
              </div>
            </div>
            <div>
              <div>
                <span>{{ $t("pub.pubRemark") }}：</span>
                <span v-if="item.tsIdList.length > 0"
                  >{{ $t("salesModule.ComplaintNum") }}：
                  <a
                    class="underline"
                    v-for="ts in item.tsIdList"
                    href="javascript:void(0);"
                    @click="
                      goUrlTS('ComplaintsDetail', ts, item.orderId, '投诉详情')
                    "
                    >{{ ts }}
                  </a>
                  ;
                </span>
                <p>
                  <span v-if="item.clientSource == 1 && item.brandName != ''"
                    >{{ item.brandName }}{{ $t("fnc.dingdan") }}
                    {{ item.platformOrder }};</span
                  >{{ item.remarks }}
                </p>
              </div>
              <div>
                <span>{{ item.remarksName }}&ensp;{{ item.rematksTime }}</span>
                <el-popover width="600" placement="bottom-end" trigger="click">
                  <div class="groupTourOrder_remarks_popover">
                    <div>{{ $t("fnc.lsbeizhu") }}</div>
                    <p
                      v-if="item.remarksList.length !== 0"
                      v-for="(item2, index2) in item.remarksList"
                      :key="index2"
                    >
                      <span>{{ item2.remarks }}</span>
                      <span
                        >{{ item2.createByName }}
                        <span style="color: #666666">{{
                          item2.createDate
                        }}</span></span
                      >
                    </p>
                    <span v-if="item.remarksList.length === 0">{{
                      $t("system.content_noData")
                    }}</span>
                  </div>
                  <el-button
                    slot="reference"
                    icon="iconfont icon-gengduo"
                    style="
                      padding: 0px;
                      border: none;
                      background-color: transparent;
                    "
                    class="groupTourOrder_remarks_btn"
                  >
                  </el-button>
                </el-popover>
              </div>
            </div>
          </td>
          <td colspan="4" class="groupTourOrder_remarks" style="height: 40px">
            <div>
              <div>
                <span>{{ $t("Operation.Op_remark") }}:</span>
                <p>{{ item.oP_Remarks ? item.oP_Remarks : "无" }}</p>
              </div>
            </div>
          </td>
          <td
            colspan="4"
            class="groupTourOrder_SpecialAPP"
            stysle="height: 40px;"
          >
            <div>
              特价申请函:
              <template v-if="item.orderspecialofferId === 0">
                <span class="font-color-blur">未申请</span>
              </template>
              <template v-else>
                <span
                  class="font-color-red"
                  v-if="item.orderspecialofferState === -1"
                  >拒绝</span
                >
                <span
                  class="font-color-org"
                  v-if="item.orderspecialofferState === 0"
                  >审批中</span
                >
                <span
                  class="font-color-green"
                  v-if="item.orderspecialofferState === 1"
                  >通过</span
                >
              </template>
            </div>
            <div class="font-color-red" v-if="item.orderspecialofferId !== 0">
              申请说明：<span>{{ item.orderspecialofferApplyReason }}</span>
            </div>
            <div class="font-color-red" v-if="item.orderspecialofferId !== 0">
              审批说明：<span>{{ item.orderspecialofferReason }}</span>
            </div>
          </td>
          <td
            colspan="5"
            class="groupTourOrder_tickets"
            style="height: 40px; cursor: pointer"
          >
            <div
              @click="goUrlSFD('SalesFinancialDetail', '销售财务单据', item)"
            >
              <div>{{ $t("fnc.skdanju") }}：</div>
              <div>
                <span v-for="(item2, index2) in item.financeList" :key="index2">
                  <span
                    v-if="item2.colorState === 1"
                    class="groupTourOrder_tickets_blue"
                    >{{ item2.frID }}</span
                  >
                  <span
                    v-else-if="item2.colorState === 2"
                    class="groupTourOrder_tickets_green"
                    >{{ item2.frID }}</span
                  >
                  <span
                    v-else-if="item2.colorState === 3"
                    class="groupTourOrder_tickets_red"
                    >{{ item2.frID }}</span
                  >
                  <span
                    v-else-if="item2.colorState === 4"
                    class="groupTourOrder_tickets_black"
                    >{{ item2.frID }}</span
                  >
                </span>
                <span
                  v-if="item.financeList.length === 0"
                  style="cursor: default"
                  >{{ $t("system.content_noData") }}</span
                >
              </div>
            </div>
            <div
              @click="goUrlSFD('SalesFinancialDetail', '销售财务单据', item)"
            >
              <div>{{ $t("fnc.fkdanju") }}：</div>
              <div>
                <span
                  v-for="(item2, index2) in item.refundFinanceList"
                  :key="index2"
                >
                  <span
                    v-if="item2.colorState === 1"
                    class="groupTourOrder_tickets_blue"
                    >{{ item2.frID }}</span
                  >
                  <span
                    v-else-if="item2.colorState === 2"
                    class="groupTourOrder_tickets_green"
                    >{{ item2.frID }}</span
                  >
                  <span
                    v-else-if="item2.colorState === 3"
                    class="groupTourOrder_tickets_red"
                    >{{ item2.frID }}</span
                  >
                  <span
                    v-else-if="item2.colorState === 4"
                    class="groupTourOrder_tickets_black"
                    >{{ item2.frID }}</span
                  >
                </span>
                <span
                  v-if="item.financeList.length === 0"
                  style="cursor: default"
                  >{{ $t("system.content_noData") }}</span
                >
              </div>
            </div>
            <div>
              <div>{{ $t("salesModule.Invoice") }}：</div>
              <div>
                <span
                  v-for="(item2, index2) in item.invoiceApplyList"
                  :key="index2"
                >
                  <span
                    v-if="item2.invoiceApplyState === 6"
                    class="groupTourOrder_tickets_blue"
                    @click="goIisDetail(item2.id)"
                    >{{ item2.id }}</span
                  >
                  <span
                    v-else-if="
                      item2.invoiceApplyState === 1 ||
                      item2.invoiceApplyState === 3 ||
                      item2.invoiceApplyState === 6
                    "
                    class="groupTourOrder_tickets_green"
                    @click="goIisDetail(item2.id)"
                    >{{ item2.id }}</span
                  >
                  <span
                    v-else-if="
                      item2.invoiceApplyState === 5 ||
                      item2.invoiceApplyState === 4
                    "
                    class="groupTourOrder_tickets_red"
                    @click="goIisDetail(item2.id)"
                    >{{ item2.id }}</span
                  >
                  <span
                    v-else-if="item2.invoiceApplyState === 2"
                    class="groupTourOrder_tickets_black"
                    @click="goIisDetail(item2.id)"
                    >{{ item2.id }}</span
                  >
                </span>
                <span
                  v-if="item.invoiceApplyList.length === 0"
                  style="cursor: default"
                  >{{ $t("system.content_noData") }}</span
                >
              </div>
            </div>
          </td>
        </tr>
      </tbody>
    </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 class="combottomDiv" v-if="showChangeSales" style="height: 200px">
      <updateSalesMan
        @closeUpdiv="closeSalseDiv"
        @getList="getList"
        :subInfo="subInfo"
      ></updateSalesMan>
    </div>
  </div>
</template>

<script>
import Treeselect from "@riophae/vue-treeselect";
import updateSalesMan from "../commonPage/updateSalesMan.vue";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
export default {
  components: {
    Treeselect,
    updateSalesMan,
  },
  data() {
    return {
      normalizer(node) {
        var obj = {
          id: node.DepartmentId,
          label: node.DepartmentName,
        };
        if (node.ChildList != null && node.ChildList.length > 0) {
          obj.children = node.ChildList;
        }
        return obj;
      },
      redBagList: [],
      happy: false,
      defaultImg:
        'this.src="' + require("../../assets/img/litheader.png") + '"',
      currentPage: 1,
      total: 0,
      loading: false,
      msg: {
        LineId: "-1",
        LineteamId: 0, //系列
        RB_Department_Id: null,
        CreateBy: "-1",
        OrderState: "-1",
        CStartDate: "",
        CEndDate: "",
        QStartDate: "",
        QEndDate: "",
        pageIndex: 1,
        pageSize: 10,
        tempOrderId: "",
        SellFormEmp: 0,
        GroupType: "-1",
        TCNUM: "",
        BranchId: "-1",
        IsOneDay: "-1",
        IsCollectMoney: 0,
        IsUseCoupon: "0",
        IsUseRedEnvelopeMoney: "0",
      },
      employeeMsg: {
        RB_Group_id: "0",
        RB_Branch_id: "-1",
        departmentId: "0",
        IsLeave: "-1",
      },
      getCompanyMsg: {
        RB_Group_Id: "0",
        Status: "0",
      },
      getDepartmentMsg: {
        RB_Group_Id: "0",
        RB_Branch_Id: "-1",
        Status: "0",
      },
      isOwn: false,
      list: [],
      LineList: [],
      LineTeamList: [],
      departmentList: [],
      employeeList: [],
      companyList: [],
      ddztList: [],
      countData: {
        // 总报名人数
        TotalGuestNum: 0,
        TotalYSeatNum: 0,
        TotalESeatNum: 0,
        TotalFSeatNum: 0,
        // 正常报名人数
        NormalGuestNum: 0,
        NormalYSeatNum: 0,
        NormalESeatNum: 0,
        NormalFSeatNum: 0,
        // 取消人数
        CancelGuestNum: 0,
        CancelYSeatNum: 0,
        CancelESeatNum: 0,
        CancelFSeatNum: 0,
        // 其他统计项
        Income: 0,
        Commission: 0,
        DueinMoney: 0,
        PreferPrice: 0,
        InteriorNum: 0,
        B2BNum: 0,
      },
      ctlxList: [],
      showChangeSales: false,
      //订单编号及业务员信息
      subInfo: {
        CreateBy: "",
        OrderId: 0,
      },
      userId: 0,
      //修改订单业务员1-有权限
      isEditOrderCreate: 0,
    };
  },
  methods: {
    //获取系列列表
    getLineTeamList(lineId) {
      this.LineTeamList = [];
      this.apipost(
        "team_post_GetList",
        {
          lineID: lineId,
          isTOOP: 1,
        },
        (res) => {
          if (res.data.resultCode == 1) {
            this.msg.LineteamId = 0;
            this.LineTeamList = res.data.data;
          }
        }
      );
    },
    goUrlHappy(item) {
      this.happy = false;
      this.$router.push({
        name: "HappyPassbook",
        query: {
          CustomerId: item.customerId,
          blank: "y",
        },
      });
    },
    getRedBag(item) {
      let msg = {
        CustomerId: item.customerId,
        pageIndex: 1,
        pageSize: 4,
      };
      if (item.customerId) {
        this.apipost(
          "customer_post_GetC_BigRedEnvelopeInfoList",
          msg,
          (res) => {
            if (res.data.resultCode == 1) {
              this.redBagList = res.data.data.pageData;
            } else {
            }
          },
          (err) => {}
        );
      } else {
        this.redBagList = [];
      }
    },
    //跳转
    goUrlTS(path, id, orderId, title) {
      this.$router.push({
        name: path,
        query: {
          id: id,
          orderId: orderId,
          blank: "y",
          tab: title,
        },
      });
    },
    goUrlSFD: function (path, name, item) {
      let obj = JSON.parse(JSON.stringify(item));
      obj.oP_Remarks = "";
      obj.remarksList = [];
      obj.refundFinanceList = [];
      obj.remarks = [];
      obj.ltName = [];
      obj.lineName = [];
      obj.financeList = [];
      obj.guestList = [];
      obj.description = [];
      this.$router.push({
        name: path,
        query: {
          blank: "y",
          tab: name,
          item: JSON.stringify(obj),
        },
      });
    },
    // 结束日期不能小于开始日期
    dataDui() {
      if (this.msg.CStartDate > this.msg.CEndDate && this.msg.CEndDate !== "") {
        this.$message.error("结束日期不能小于开始日期");
        this.msg.CEndDate = "";
      }
    },
    dataDuiQ() {
      if (
        new Date(this.msg.QStartDate).getTime() >
          new Date(this.msg.QEndDate).getTime() &&
        this.msg.QEndDate !== ""
      ) {
        this.$message.error("结束日期不能小于开始日期");
        this.msg.QEndDate = "";
      }
    },
    // 跳转调查列表
    goInvetig: function (path, tcid, orderId) {
      this.$router.push({
        name: path,
        query: {
          OrderId: orderId,
          TCID: tcid,
          blank: "y",
        },
      });
    },
    goUrl(name, path, id, tcmun) {
      this.$router.push({
        name: path,
        query: {
          id: id,
          tcmun: tcmun,
          blank: "y",
          tab: name,
        },
      });
    },
    // 获取统计数据
    getCount: function () {
      this.apipost(
        "sellorder_post_GetOrderListStatistics",
        this.msg,
        (res) => {
          if (res.data.resultCode == 1) {
            this.countData = res.data.data;
          } else {
            this.$message.error("数据获取失败！");
          }
        },
        (err) => {}
      );
    },
    goUrlX(name, path, id, tcmun) {
      this.$router.push({
        name: path,
        query: {
          id: id,
          tcmun: tcmun,
          blank: "y",
          tab: name,
        },
      });
    },
    linkageEmployeeMsg(node, instanceId) {
      this.employeeMsg.departmentId = node.DepartmentId;
      this.msg.CreateBy = "-1";
      this.getEmployee();
    },
    getDdztList() {
      this.apipost(
        "sellorder_post_GetSellOrderStatusEnumList",
        {},
        (res) => {
          if (res.data.resultCode == 1) {
            this.ddztList = res.data.data;
          }
        },
        (err) => {}
      );
    },
    getEmployee() {
      this.apipost(
        "app_get_employeeInfo_v2",
        this.employeeMsg,
        (res) => {
          if (res.data.resultCode == 1) {
            this.employeeList = res.data.data;
          }
        },
        (err) => {}
      );
    },
    getLineList() {
      this.apipost("line_post_GetAllList", {}, (res) => {
        if (res.data.resultCode == 1) {
          this.LineList = res.data.data;
        } else {
          this.$message.error(res.data.message);
        }
      });
    },
    //获取公司
    getCompany() {
      this.apipost(
        "admin_get_BranchGetList",
        this.getCompanyMsg,
        (res) => {
          if (res.data.resultCode == 1) {
            this.companyList = res.data.data;
          } else {
          }
        },
        (err) => {}
      );
    },
    linkageDepartment() {
      //联动部门
      this.msg.RB_Department_Id = null;
      if (this.msg.BranchId != 0) {
        this.getDepartmentMsg.RB_Branch_Id = this.msg.BranchId;
      }
      this.getDepartment();
    },
    getDepartment() {
      this.apipost(
        "admin_Get_GetDepartmentTreeForReceiveQuery",
        this.getDepartmentMsg,
        (res) => {
          if (res.data.resultCode == 1) {
            this.departmentList = res.data.data;
          } else {
            this.Error(res.data.message);
          }
        },
        (err) => {}
      );
    },

    getList() {
      this.loading = true;
      this.apipost(
        "sellorder_post_GetOrderList",
        this.msg,
        (res) => {
          if (res.data.resultCode == 1) {
            this.loading = false;
            this.total = res.data.data.count;
            this.list = res.data.data.pageData;
          } else {
            this.loading = false;
            this.$message.error(res.data.message);
          }
        },
        (err) => {}
      );
      this.getCount();
    },
    handleCurrentChange(val) {
      this.msg.pageIndex = val;
      this.getList();
    },
    resetPageIndex() {
      this.msg.pageIndex = 1;
      this.currentPage = 1;
    },
    // 获取参团类型
    getCtlxList() {
      this.apipost(
        "sellorder_get_GetOrderJoinEnumList",
        {},
        (res) => {
          if (res.data.resultCode == 1) {
            this.ctlxList = res.data.data;
          }
        },
        (err) => {}
      );
    },
    //点击修改业务员
    getSalerInfo(item) {
      this.subInfo.CreateBy = item.createBy;
      this.subInfo.OrderId = item.orderId;
      this.showChangeSales = true;
    },
    //关闭修改业务员
    closeSalseDiv() {
      this.showChangeSales = false;
    },
    goIisDetail: function (id) {
      // 跳转发票详情页面
      this.$router.push({
        name: "invoicesManagerDetail",
        query: {
          id: id,
          noDetail: 1,
          blank: "y",
        },
      });
    },
    // 获取修改业务员权限
    GetEditOrderCreateByAuth() {
      var actionCode = this.$AuthCode.EditOrderCreateBy;
      this.CheckUserAuth(actionCode, (res) => {
        if (res.data.resultCode == 1 && res.data.data == 1) {
          this.isEditOrderCreate = 1;
        }
      });
    },
    // 查看报价单
    seeBJD(url) {
      window.open(url, "_blank");
      return;
    },
  },
  mounted() {
    let userInfo = this.getLocalStorage();
    this.userId = userInfo.EmployeeId;
    this.GetEditOrderCreateByAuth();
    this.getCompanyMsg.RB_Group_Id = this.getDepartmentMsg.RB_Group_Id =
      userInfo.RB_Group_id; //集团
    this.getCompany();

    this.getCtlxList();
    this.getEmployee();
    this.getLineList();
    this.getDepartment();
    this.getDdztList();
    if (this.$route.query.id) {
      this.msg.tempOrderId = this.$route.query.id;
    }
    if (this.$route.query.isOwn) {
      this.isOwn = true;
      this.msg.SellFormEmp = 1;
    }
    this.msg.CreateBy =
      this.$route.query.EmployeeId === undefined
        ? "-1"
        : this.$route.query.EmployeeId;
    this.msg.QStartDate =
      this.$route.query.starTime === undefined
        ? ""
        : this.$route.query.starTime;
    this.msg.QEndDate =
      this.$route.query.endTime === undefined ? "" : this.$route.query.endTime;
    if (
      this.msg.QStartDate === "" &&
      this.msg.QEndDate === "" &&
      !this.msg.tempOrderId
    ) {
      this.msg.QStartDate = new Date();
      this.msg.QEndDate = new Date();
    }
    if (this.$route.query.orderId) {
      this.msg.tempOrderId = this.$route.query.orderId;
      this.msg.QStartDate = "";
      this.msg.QEndDate = "";
    }
    this.getList();
  },
};
</script>

<style>
  @import "../../assets/css/newTravelManager.css";
.personNolayer p {
  height: 28px;
  line-height: 28px;
  padding-left: 15px;
}

.personNolayer p > span {
  font-size: 12px;
  color: #333;
  margin-right: 15px;
}

.personNolayer table {
  padding: 10px 0 0 20px;
  width: 100%;
  background-color: #ededed;
  border-collapse: collapse;
  border: 1px solid #d2d2d2;
  font-size: 12px;
}

.personNolayer table th {
  background-color: #ededed;
  height: 34px;
  text-indent: 15px;
}

.personNolayer table td {
  background-color: #ffffff;
  padding: 9px 15px;
  color: #333333;
  border: 1px solid #d2d2d2;
}

.personNolayer table ._color_666 {
  color: #666666;
}

.personNolayer table tr._color_666 th {
  padding: 9px 15px;
}

.personNolayer table th {
  background-color: #ededed;
  height: 34px;
  text-indent: 15px;
}

.personNolayer table td {
  background-color: #ffffff;
  padding: 9px 15px;
  color: #333333;
  border: 1px solid #d2d2d2;
}

.personNolayer table ._color_666 {
  color: #666666;
}

.personNolayer table tr._color_666 th {
  padding: 9px 15px;
}

.groupts .underline {
  text-decoration: underline;
  margin: 5px;
  text-align: center;
}

.color_red_order {
  color: #e95252 !important;
}

.enrollTotalSearch {
  width: 100%;
  min-height: auto;
  padding: 0 0 20px 0;
}

.enrollTotalSearch::after {
  display: block;
  clear: both;
  content: "";
  visibility: hidden;
  height: 0;
}

.enrollTotalSearch li {
  float: left;
  font-size: 12px;
  height: 40px;
  color: #666;
  margin: 20px 10px 10px 0;
}

.enrollTotalSearch li > span {
  display: inline-block;
}

.enrollTotalSearch li span > em {
  display: inline-block;
  min-width: 60px;
  text-align: right;
  font-style: normal;
  margin: 0 12px 0 0;
}

.enrollTotalSearch li:last-child {
  float: right;
  position: fixed;
  top: 36px;
  right: 20px;
  text-align: right;
  z-index: 50;
}

.enrollTotalSearchTable {
  width: 100%;
  font-size: 14px;
  color: #333;
  border-bottom: 1px solid #cccccc;
  border-right: 1px solid #cccccc;
  border-collapse: collapse;
}

.enrollTotalSearchTable tr {
  /* border-bottom: 2px solid #333; */
}

.enrollTotalSearchTable tr th {
  background: #bdbdbd;
  height: 30px;
  font-size: 12px;
  text-align: center;
  border-top: 1px solid #cccccc;
  border-left: 1px solid #cccccc;
}

.enrollTotalSearchTable tr {
  background: #fff;
  text-align: left;
}

.enrollTotalSearchTable tbody tr:last-child {
  border-bottom: 2px solid #333;
}

.enrollTotalSearchTable tr:first-child td:first-child {
  border-bottom: 2px solid #333;
}

.enrollTotalSearchTable tr td {
  height: 80px;
  padding: 10px;
  border-top: 1px solid #cccccc;
  border-left: 1px solid #cccccc;
}

.enrollTotalSearchTable tr td > img {
  width: 32px;
  height: 32px;
  border-radius: 16px;
  vertical-align: middle;
  margin-right: 5px;
}

.enrollTotalSearchTable tr td p {
  line-height: 20px;
}

.groupTourOrder_count_green {
  color: #1bc594;
}

.groupTourOrder_count_blue {
  color: #4d7afd;
}

.groupTourOrder_count_yellow {
  color: #ff9c00;
}

.groupTourOrder_count_gray {
  color: #999999;
}

.groupTourOrder_count {
  margin: 0 0 20px 0;
  width: 100%;
  height: auto;
}

.groupTourOrder_count_col {
  height: 80px;
}

.groupTourOrder_count_item {
  font-weight: 400;
  padding: 10px;
  height: 100%;
  border: 1px solid #e6e6e6;
  background-color: #ffffff;
  color: #333333;
}

.groupTourOrder_count_item > div > i {
  font-size: 12px;
  vertical-align: bottom;
}

.groupTourOrder_count_item > div > span:nth-child(2) {
  font-size: 14px;
  vertical-align: bottom;
}

.groupTourOrder_count_item > div > span:nth-child(3) {
  font-weight: bold;
  font-size: 16px;
  vertical-align: bottom;
}

.groupTourOrder_count_item > p {
  font-size: 12px;
  line-height: 18px;
}

.groupTourOrder_count_item > p > span {
  margin: 0 5px 0 0;
  white-space: nowrap;
}

.groupTourOrder_more {
  margin: 0 -12px;
}

.groupTourOrder_more > div {
  width: 100%;
  height: 30px;
  line-height: 30px;
  text-align: center;
  font-size: 12px;
  color: #333333;
  background-color: #ffffff;
  cursor: pointer;
}

.groupTourOrder_more > div:hover {
  color: #297bef;
  background-color: #dcebff;
}

.groupTourOrder_remarks {
  font-size: 0px;
}

.groupTourOrder_remarks > div {
}

.groupTourOrder_remarks > div > div:nth-child(1) {
  float: left;
  display: flex;
  align-items: flex-start;
}

.groupTourOrder_remarks > div > div:nth-child(1) > span {
  line-height: 20px;
  font-size: 12px;
  color: #e95252;
  white-space: nowrap;
}

.groupTourOrder_remarks > div > div:nth-child(1) > p {
  line-height: 20px;
  font-size: 12px;
  color: #e95252;
}

.groupTourOrder_remarks > div > div:nth-child(2) {
  float: right;
  text-align: right;
  font-size: 12px;
  color: #e95252;
}

.groupTourOrder_remarks > div > div:nth-child(2) > i {
  font-size: 10px;
  cursor: pointer;
}

.groupTourOrder_remarks > div::after {
  display: block;
  clear: both;
  content: "";
  visibility: hidden;
  height: 0;
}

.groupTourOrder_remarks_btn {
  padding: 0px;
  width: 12px;
  height: 12px;
  border: none;
  background-color: transparent;
}

.groupTourOrder_remarks_btn > i {
  color: #e95252;
  font-size: 12px;
}

.groupTourOrder_remarks_popover > div {
  display: inline-block;
  font-size: 14px;
  color: #000000;
}

.groupTourOrder_remarks_popover > div::before {
  content: "";
  display: inline-block;
  margin: 0 5px 0 0;
  width: 2px;
  height: 12px;
  background-color: #e95252;
}

.groupTourOrder_remarks_popover > span {
  display: block;
  margin: 0 0 0 0;
  width: 100%;
  text-align: center;
  font-size: 12px;
  color: #000000;
}

.groupTourOrder_remarks_popover > p {
  margin: 5px 0 0 0;
  padding: 3px;
  width: 100%;
  max-height: 300px;
  overflow-y: auto;
  font-size: 12px;
  color: #000000;
}

.groupTourOrder_remarks_popover > p:nth-child(even) {
  background-color: #e6e6e6;
}

.groupTourOrder_remarks_popover > p > span:nth-child(1) {
  float: left;
}

.groupTourOrder_remarks_popover > p > span:nth-child(2) {
  margin: 0 10px 0 0;
  float: right;
}

.groupTourOrder_remarks_popover > p::after {
  display: block;
  clear: both;
  content: "";
  visibility: hidden;
  height: 0;
}

/* .groupTourOrder_tickets>div>span{
	margin: 0 5px 0 0;
	cursor: pointer;
} */
.groupTourOrder_tickets > div > div > span {
  display: inline-block;
  margin: 0 10px 0 0;
}

.groupTourOrder_tickets_red {
  color: #ff0000;
  text-decoration: underline;
}

.groupTourOrder_tickets_blue {
  color: #0000ff;
  text-decoration: underline;
}

.groupTourOrder_tickets_green {
  color: #008000;
  text-decoration: underline;
}

.groupTourOrder_tickets_black {
  color: #000000;
  text-decoration: underline;
}

.groupTourOrderByTuan_ico {
  margin: 0 10px 0 0;
}

.groupTourOrderByTuan_ico > i {
  display: inline-block;
  margin: 0 2px 0 0;
  width: 8px;
  height: 8px;
  border-radius: 2px;
  vertical-align: middle;
}

.groupTourOrderByTuan_ico > span {
  vertical-align: middle;
}

.groupTourOrder_tickets > div > div {
  display: table-cell;
  cursor: pointer;
}

.groupTourOrder_tickets > div > div:nth-child(1) {
  width: 80px;
}

.groupTourOrder_tickets > div > div > span {
  display: inline-block;
  margin: 0 10px 0 0;
}
</style>