<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
        <el-form-item label="直播日期" prop="liveSchedulDate">
          <!--<el-date-picker clearable size="small" style="width: 200px"
            v-model="queryParams.liveSchedulDate"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="选择直播日期">
          </el-date-picker>-->
          <el-date-picker
                v-model="liveDateScope"
                type="daterange"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                :picker-options="liveDatePickerOptions"
                
              >
              </el-date-picker>
        </el-form-item>

        
        <el-form-item label="直播间" prop="liveRoom">
          <el-select
              v-model="queryParams.liveRoom"
              placeholder="请选择直播间"
              clearable
              filterable
              size="small"
            >
              <el-option
                v-for="dict in liveTypeOptions"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="parseInt(dict.dictValue)"
              />
            </el-select>
        </el-form-item>
         <el-form-item label="所属账号" prop="fanChannel">
          <el-select
              v-model="queryParams.fanChannel"
              placeholder="请选择账号渠道"
              clearable
              filterable
              size="small"
            >
              <el-option 
                v-for="dict in fanChanneloptions"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="parseInt(dict.dictValue)"
              />
            </el-select>
        </el-form-item>
        <el-form-item label="营养师" prop="liveNutritionistId">
            <el-select
              v-model="queryParams.liveNutritionistId"
              placeholder="请选择营养师"
              clearable
              filterable
              size="small"
            >
              <el-option
                v-for="dict in nutritionistIdOptions.slice(1)"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="parseInt(dict.dictValue)"
              />
            </el-select>
        </el-form-item>
        <!--<el-form-item label="微信号" prop="wxAccountId">
          <el-select
            v-model="queryParams.wxAccountId"
            filterable
            placeholder="请选择微信号"
            clearable
            size="small"
          >
            <el-option
              v-for="dict in wxAccountList"
              :key="dict.id"
              :label="dict.wxAccount"
              :value="parseInt(dict.id)"
            />
          </el-select>
        </el-form-item>-->

        
        
      <el-form-item style="margin-left:10px;">
        <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>

    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button
          type="primary"
          icon="el-icon-plus"
          size="mini"
          @click="handleAdd"
          v-hasPermi="['custom:liveSchedul:add']"
        >新增</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="success"
          icon="el-icon-edit"
          size="mini"
          :disabled="single"
          @click="handleUpdate"
          v-hasPermi="['custom:liveSchedul:edit']"
        >修改</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="danger"
          icon="el-icon-delete"
          size="mini"
          :disabled="multiple"
          @click="handleDelete"
          v-hasPermi="['custom:liveSchedul:remove']"
        >删除</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button
          type="primary"
          size="mini"
          @click="copyLastTimeLiveSchedul"
          v-hasPermi="['custom:liveSchedul:add']"
        >一键复制上次记录</el-button>
      </el-col>
      
      <el-col :span="1.5">
        <el-button
          type="warning"
          icon="el-icon-download"
          size="mini"
          @click="handleExport"
          v-hasPermi="['custom:liveSchedul:export']"
        >导出</el-button>
      </el-col>
	  <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </el-row>

    <el-table v-loading="loading" :data="liveSchedulList" :span-method="objectSpanMethod" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="直播日期" align="center" prop="liveSchedulDate" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.liveSchedulDate, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="直播间" align="center" prop="liveRoomName" />
      
      <el-table-column label="直播时间" align="center" prop="liveStartTime" width="180">
        <template slot-scope="scope">
          <span>{{ parseTime(scope.row.liveStartTime, '{h}:{i}') }}-{{ parseTime(scope.row.liveEndTime, '{h}:{i}') }}</span>
        </template>
      </el-table-column>
      <el-table-column label="直播状态" align="center" prop="liveStatus">
        <template slot-scope="scope">
          <span><el-tag :type="scope.row.liveStatus == 0 ? 'info' : (scope.row.liveStatus == 1 ? 'success' : '')">{{scope.row.liveStatus == 0 ? '未开播' : (scope.row.liveStatus == 1 ? '直播中' : '已下播')}}</el-tag></span>
        </template>
      </el-table-column>
      <el-table-column label="直播营养师" align="center" prop="liveNutritionistName" />
      <!--<el-table-column label="直播运营" align="center" prop="liveOperatorName" />
      <el-table-column label="直播策划" align="center" prop="livePlannerName" />-->
      <el-table-column label="所属账号" align="center" prop="fanChannelName" />
      <el-table-column label="导粉情况" align="center" prop="wxAccountList">
        <template slot-scope="scope">
          <span style="margin-right:10px">{{getTotalImportFanNum(scope.row.wxAccountList)}}</span>
          <el-popover
          placement="left"
          width="370"
          trigger="click">
          
          <el-table :data="scope.row.wxAccountList" height="300" style="width: 100%">
            <el-table-column width="80" property="saleName" label="销售"></el-table-column>
            <el-table-column width="180" property="wxAccount" label="微信号" align="center"></el-table-column>
            <el-table-column width="80" property="fanNum" label="导粉量" align="center"></el-table-column>
          </el-table>
          <el-button slot="reference">详情</el-button>
          </el-popover>
        </template>
      </el-table-column>
      <el-table-column label="进粉情况" align="center" prop="addFanList">
        <template slot-scope="scope">
          <span style="margin-right:10px">{{scope.row.addFanList.length}}</span>
          <el-popover
          :title="scope.row.liveRoomName + '-'  + scope.row.fanChannelName + '-' + scope.row.liveNutritionistName + '-' + parseTime(scope.row.liveStartTime, '{h}:{i}') + '至' + parseTime(scope.row.liveEndTime, '{h}:{i}') + '直播进粉记录'"
          placement="left"
          width="680"
          trigger="click">
          <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
              <el-button
                type="primary"
                icon="el-icon-plus"
                size="mini"
                @click="addFanRecord(scope.row)"
              >新增</el-button>
              <span style="margin-left:5px;color:red">总数：{{scope.row.addFanList.length}}</span>
            </el-col>
          </el-row>
          <el-table :data="scope.row.addFanList" height="250" style="width: 100%"><!-- 620;height: 300px;overflow: auto; -->
            <el-table-column width="70" property="saleName" label="销售"></el-table-column>
            <el-table-column width="140" property="saleWxAccount" label="销售微信号" align="center"></el-table-column>
            <el-table-column width="140" property="fanWxNumber" label="客户微信号" align="center"></el-table-column>
            <el-table-column width="140" property="enterFanTime" label="进粉时间" align="center"></el-table-column>
            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="140">
                <template slot-scope="scope">
                      <el-button
                        style="margin-left:16px"
                          size="normal"
                          type="text"
                          icon="el-icon-edit"
                          @click="updateFanRecord(scope.row)"
                      >修改</el-button>
                      <el-popconfirm title="确定要删除吗？" @onConfirm="delFanRecord(scope.row)">
                          <el-button
                             slot="reference"
                            size="normal"
                            type="text"
                            icon="el-icon-delete"
                          >删除</el-button> 
                      </el-popconfirm>
                    
                </template>
            </el-table-column>
          </el-table>
          <el-button slot="reference">详情</el-button>
          </el-popover>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="300">
        <template slot-scope="scope"><!-- scope.row.statusTrueName,scope.row.statusFalseName -->
          <el-switch
              v-hasPermi="['custom:liveSchedul:edit']"
                v-model="scope.row.status"
                :active-text="scope.row.statusTrueName"
                :inactive-text="scope.row.statusFalseName"
                @change="updateLiveStatus($event, scope.row)"
                >
              </el-switch>
          <el-button
          style="margin-left:16px"
            size="normal"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['custom:liveSchedul:edit']"
          >修改</el-button>
          <el-button
             size="normal"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['custom:liveSchedul:remove']"
          >删除</el-button>
        </template>
      </el-table-column>
    </el-table>
    
    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.pageNum"
      :limit.sync="queryParams.pageSize"
      @pagination="getList"
      :layout="'total, slot, sizes, prev, pager, next, jumper'"
    >
      <span class="totalSpan">总导粉量：{{totalImportNum}}</span>
      <span class="totalSpan">总进粉量：{{totalAddFanNum}}</span>
      <span class="totalSpan" style="margin-right:10px">总直播时长：{{totalLiveTime}}小时</span>
    </pagination>

    <!-- 添加或修改直播排班对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
        
        <el-form-item label="直播日期" prop="liveSchedulDate">
          <el-date-picker clearable size="small" style="width: 200px"
            v-model="form.liveSchedulDate"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="选择直播日期">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="直播间" prop="liveRoom">
          <el-select
              v-model="form.liveRoom"
              placeholder="请选择直播间"
              clearable
              filterable
              size="small"
            >
              <el-option
                v-for="dict in liveTypeOptions"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="parseInt(dict.dictValue)"
              />
            </el-select>
        </el-form-item>
        <!--<el-form-item label="开始时间" prop="liveStartTime">
          <el-date-picker clearable size="small" style="width: 200px"
            v-model="form.liveStartTime"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="选择开始时间">
          </el-date-picker>
        </el-form-item>-->
        <el-form-item label="直播时间" prop="liveTime">
                <el-time-picker
                v-model="form.startTime"
                value-format="yyyy-MM-dd HH:mm"
                start-placeholder="开始时间"
                placeholder="选择开始时间(必须)">
            </el-time-picker>
            <span style="margin-left:10px;margin-right:10px">至</span>
             <el-time-picker
                value-format="yyyy-MM-dd HH:mm"
                v-model="form.endTime"
                placeholder="选择结束时间(非必须)">
            </el-time-picker>

          <!--<el-time-picker
              is-range
              value-format="yyyy-MM-dd HH:mm"
              v-model="form.liveTime"
              range-separator="至"
              start-placeholder="开始时间"
              end-placeholder="结束时间"
              placeholder="选择时间范围">
            </el-time-picker>-->
        </el-form-item>
        <!--<el-form-item label="结束时间" prop="liveEndTime">
          <el-date-picker clearable size="small" style="width: 200px"
            v-model="form.liveEndTime"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="选择结束时间">
          </el-date-picker>
        </el-form-item>-->
        <el-form-item label="营养师" prop="liveNutritionistId">
            <el-select
              v-model="form.liveNutritionistId"
              placeholder="请选择营养师"
              clearable
              filterable
              size="small"
            >
              <el-option
                v-for="dict in nutritionistIdOptions"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="parseInt(dict.dictValue)"
              />
            </el-select>
        </el-form-item>
        <el-form-item label="运营" prop="liveOperatorId">
          <el-select
              v-model="form.liveOperatorId"
              placeholder="请选择运营"
              clearable
              filterable
              size="small"
            >
              <el-option
                v-for="dict in operatorIdOptions"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="parseInt(dict.dictValue)"
              />
            </el-select>
        </el-form-item>
        <el-form-item label="策划" prop="livePlannerId">
          <el-select
              v-model="form.livePlannerId"
              placeholder="请选择策划"
              clearable
              filterable
              size="small"
            >
              <el-option
                v-for="dict in plannerIdOptions"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="parseInt(dict.dictValue)"
              />
            </el-select>
        </el-form-item>
        <el-form-item label="所属账号" prop="fanChannel">
            <el-select
              v-model="form.fanChannel"
              placeholder="请选择所属账号渠道"
              clearable
              filterable
              size="small"
            >
              <el-option
                v-for="dict in fanChanneloptions"
                :key="dict.dictValue"
                :label="dict.dictLabel"
                :value="parseInt(dict.dictValue)"
              />
            </el-select>
            <!--<span style="margin-left:10px;color:#1890ff">该账号与销售接粉微信号绑定</span>-->
        </el-form-item>
        <el-form-item label="直播状态" prop="liveStatus">
            <el-select
              v-model="form.liveStatus"
              placeholder="请选择状态"
              clearable
              filterable
              size="small"
            >
              <el-option :key="0" :label="'未开播'" :value="parseInt('0')"/>
              <el-option :key="1" :label="'开播中'" :value="parseInt('1')"/>
              <el-option :key="2" :label="'已下播'" :value="parseInt('2')"/>
            </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm">确 定</el-button>
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

     <el-dialog :title="addEditFanRecordTitle" :visible.sync="addEditFanRecordOpen" width="600px" append-to-body :close-on-click-modal="false">
        <el-form ref="addEditFanRecordForm" :model="addEditFanRecordForm" :rules="addEditFanRecordRules" label-width="120px">
            <el-form-item label="销售微信号" prop="saleWxAccountId">
            <el-select
                v-model="addEditFanRecordForm.saleWxAccountId"
                placeholder="请选择销售微信号"
                clearable
                filterable
                size="small"
                style="width:300px"
              >
              <el-option
                v-for="dict in wxAccountList"
                :key="dict.id"
                :label="dict.wxAccount"
                :value="parseInt(dict.id)"
              />
            </el-select>
            </el-form-item>
            <el-form-item label="粉丝微信号" prop="fanWxNumber">
                <el-input
                  v-model="addEditFanRecordForm.fanWxNumber"
                  placeholder="请输入微信号"
                  clearable
                  size="small"
                  maxlength="50"
                  style="width:300px"
                />
            </el-form-item>
            <el-form-item label="进粉时间" prop="enterFanTime">
                <el-date-picker
                v-model="addEditFanRecordForm.enterFanTime"
                format="yyyy-MM-dd HH:mm"
                value-format="yyyy-MM-dd HH:mm"
                type="datetime"
                style="width:300px"
                placeholder="进粉时间">
            </el-date-picker>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="primary" @click="submitAddEditFanRecordForm">确 定</el-button>
          <el-button @click="cancelAddEditFanRecordForm">取 消</el-button>
        </div>
    </el-dialog>
  </div>
</template>

<script>
import { listLiveSchedul, getLiveSchedul, delLiveSchedul, addLiveSchedul, updateLiveSchedul, exportLiveSchedul,updateLiveStatus,copyLastTimeLiveSchedul,addOrEditSysLiveSchedulFanRecord,delSysLiveSchedulFanRecord } from "@/api/custom/liveSchedul";
import { getAllWxAccount } from "@/api/custom/wxAccount";
import AutoHideInfo from "@/components/AutoHideInfo";
import dayjs from "dayjs";
const nowDate = dayjs().format("YYYY-MM-DD");
const nowTime = dayjs().format("YYYY-MM-DD HH:mm");
import { mapGetters } from "vuex";
export default {
  name: "LiveSchedul",
  data() {
    const checkLiveTime = (rule, value, callback) => {
      if (!this.form.startTime || this.form.startTime == null) {
        return callback(new Error("请选择开始时间"));
      }
      if (this.form.endTime != undefined && this.form.endTime != null && !dayjs(this.form.startTime).isBefore(dayjs(this.form.endTime))) {
        return callback(new Error("结束时间必须在开始时间之后"));
      }
      callback();
    };
    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 直播排班表格数据
      liveSchedulList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        liveSchedulDate: null,
        liveRoom: null,
        fanChannel: null,
        liveNutritionistId: null,
        wxAccountId: null
      },
      // 表单参数
      form: {
      },
      // 表单校验
      rules: {
            liveSchedulDate: [{ required: true, trigger: "blur", message: "请选择直播日期" }],
            liveRoom: [{ required: true, trigger: "blur", message: "请选择直播间" }],
            liveTime: [
                //{ required: true, trigger: "blur", message: "请选择直播时间" },
                { required: true, trigger: "blur", validator: checkLiveTime }
            ],
            liveNutritionistId: [{ required: true, trigger: "blur", message: "请选择营养师" }],
            fanChannel: [{ required: true, trigger: "blur", message: "请选择所属账号渠道" }],
      },
      //直播间类型
      liveTypeOptions: [],
      //接粉渠道
      fanChanneloptions: [],
      //所有微信号
      wxAccountList:[],

      addEditFanRecordTitle: "",
      addEditFanRecordOpen: false,
      addEditFanRecordForm: {},
      addEditFanRecordRules: {
        saleWxAccountId: [{ required: true, trigger: "blur", message: "请选择销售微信号" }],
        fanWxNumber:[{ required: true, trigger: "blur", message: "请填写粉丝微信号" }],
        enterFanTime:[{ required: true, trigger: "blur", message: "请选择进粉时间" }],
      },
      //记录当前添加或编辑进粉记录对应直播记录的ID
      addOrEditSchedulId: null,
      //直播范围查询
      liveDateScope: [nowDate, nowDate],

      //总导粉量
      totalImportNum: null,
      //总进粉量
      totalAddFanNum: null,
      //总直播时长
      totalLiveTime: null,

      liveDatePickerOptions: {
        disabledDate(time) {
          return time.getTime() > dayjs()
        },
      }
    };
  },
  components:{
    AutoHideInfo
  },
  created() {
    this.getList();
    this.getDicts("sys_live_type").then((response) => {
      this.liveTypeOptions = response.data;
    });
    /**this.getDicts("fan_channel").then((response) => {
      this.fanChanneloptions = response.data;
    });**/
    this.getDicts("cus_account").then((response) => {
      this.fanChanneloptions = response.data;
    });
    this.getListWxAccount();
  },
  computed: {
    ...mapGetters([
      // 主营养师字典
      "nutritionistIdOptions",
      // 策划字典
      "plannerIdOptions",
      // 运营字典
      "operatorIdOptions"
    ]),
  },
  methods: {
    /** 查询直播排班列表 */
    getList() {
      this.loading = true;
      this.queryParams.liveStartTime = this.liveDateScope && this.liveDateScope.length > 0 ? this.liveDateScope[0] : null;
      this.queryParams.liveEndTime = this.liveDateScope && this.liveDateScope.length > 0 ? this.liveDateScope[1] : null;
      listLiveSchedul(this.queryParams).then(response => {
        this.liveSchedulList = response.data.tableDataInfo.rows;
        if(this.liveSchedulList != null && this.liveSchedulList.length > 0){
            this.liveSchedulList.forEach((item,index) => {
                item.status = (item.liveStatus == 0 || item.liveStatus == 2) ? false : true; 
                item.statusFalseName = item.liveStatus == 0 ? '未开播' : '已下播';
                item.statusTrueName = '已开播';
                item.addFanVisible = this.addOrEditSchedulId == item.id;  
            });
        }
        //总导粉量
        this.totalImportNum = response.data.totalImportNum;
        //总进粉量
        this.totalAddFanNum = response.data.totalAddFanNum;
        //总直播时长
        this.totalLiveTime = response.data.totalLiveTime;

        this.total = response.data.tableDataInfo.total;
        this.loading = false;
        this.addOrEditSchedulId = null;
      });
    },
    //获取所有微信号
    getListWxAccount() {
      getAllWxAccount().then((response) => {
        this.wxAccountList = response.data;
      });
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {
        id: null,
        liveRoom: null,
        liveSchedulDate: nowDate,
        liveStartTime: null,
        liveEndTime: null,
        startTime: dayjs().format("YYYY-MM-DD HH:mm"),
        endTime: null,
        liveNutritionistId: null,
        liveOperatorId: null,
        livePlannerId: null,
        fanChannel: null,
        liveStatus: 1,
        createTime: null,
        createBy: null,
        updateTime: null,
        updateBy: null,
        delFlag: null
      };
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
      this.single = selection.length!==1
      this.multiple = !selection.length
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.reset();
      this.open = true;
      this.title = "添加直播记录";
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
      const id = row.id || this.ids
      getLiveSchedul(id).then(response => {
        response.data.startTime = response.data.liveStartTime;
        response.data.endTime = response.data.liveEndTime;
        this.form = response.data;
        this.open = true;
        this.title = "修改直播记录";
      });
    },
    //修改直播状态
    updateLiveStatus(newStatus, row){
        row.statusFalseName = '已下播';
        row.statusTrueName = '已开播';
        let param = {
          id: row.id,
          liveStatus: newStatus ? 1 : 2
        };
        updateLiveStatus(param).then(response => {
            if(response.code == 200){
               this.getList();
            }
        });
    },
    /** 提交按钮 */
    submitForm() {
      this.$refs["form"].validate(valid => {
        if (valid) {
            //处理直播开始时间
            this.form.liveStartTime = this.form.liveSchedulDate + " " + this.form.startTime.substring(this.form.startTime.length - 5);
            if(this.form.endTime == undefined || this.form.endTime == null){
                this.form.liveEndTime = "";
            }else{
                this.form.liveEndTime = this.form.liveSchedulDate + " " + this.form.endTime.substring(this.form.endTime.length -5);
            }
          if (this.form.id != null) {
            updateLiveSchedul(this.form).then(response => {
              if (response.code === 200) {
                this.msgSuccess("修改成功");
                this.open = false;
                this.getList();
              }
            });
          } else {
            addLiveSchedul(this.form).then(response => {
              if (response.code === 200) {
                this.msgSuccess("新增成功");
                this.open = false;
                this.getList();
              }
            });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const ids = row.id || this.ids;
      this.$confirm('是否确认删除直播排班编号为"' + ids + '"的数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return delLiveSchedul(ids);
        }).then(() => {
          this.getList();
          this.msgSuccess("删除成功");
        }).catch(function() {});
    },
    /** 导出按钮操作 */
    handleExport() {
      this.queryParams.liveStartTime = this.liveDateScope && this.liveDateScope.length > 0 ? this.liveDateScope[0] : null;
      this.queryParams.liveEndTime = this.liveDateScope && this.liveDateScope.length > 0 ? this.liveDateScope[1] : null;
      let fileName = '';
      if(this.queryParams.liveStartTime != null && this.queryParams.liveEndTime != null){
        if(this.queryParams.liveStartTime != this.queryParams.liveEndTime){
            fileName += this.queryParams.liveStartTime + "至" + this.queryParams.liveEndTime;
        }else{
            fileName += this.queryParams.liveStartTime;
        } 
      }
      if(this.queryParams.liveRoom && this.queryParams.liveRoom != null){
          let liveType = this.liveTypeOptions.find(
            (opt) => opt.dictValue == this.queryParams.liveRoom
          );
          console.log(liveType);
          fileName += liveType ? liveType.dictLabel : "";
      }
      if(this.queryParams.fanChannel && this.queryParams.fanChannel != null){
          let channel = this.fanChanneloptions.find(
            (opt) => opt.dictValue == this.queryParams.fanChannel
          );
          fileName += channel ? channel.dictLabel : "";
      }
      if(this.queryParams.liveNutritionistId && this.queryParams.liveNutritionistId != null){
          let nutritionist = this.nutritionistIdOptions.find(
            (opt) => opt.dictValue == this.queryParams.liveNutritionistId
          );
          fileName += nutritionist ? nutritionist.dictLabel : "";
      }   
      fileName += "直播记录.xlsx"

      const queryParams = this.queryParams;
      this.$confirm('是否确认导出所有直播排班数据项?', "警告", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(function() {
          return exportLiveSchedul(queryParams);
        }).then(response => {
          this.download(response.msg, fileName);
        }).catch(function() {});
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        return row.userSpan;
      } else if (columnIndex === 1) {
        return row.postSpan;
      }
    },
    wxAccountFormat(row){
       return (row.wxAccountList != null && row.wxAccountList.length > 0) ? row.wxAccountList : [];
    },
    copyLastTimeLiveSchedul(){
      copyLastTimeLiveSchedul().then(response => {
          if (response.code === 200) {
              this.msgSuccess("一键复制成功");
              this.getList();
          }else{
            this.msgError(response.msg);
          }
      });
      
    },
    addEditFanRecordFormRest(){
        this.addEditFanRecordForm = {
          id: null,
          liveSchedulId: null,
          saleWxAccountId: null,
          fanWxNumber: null,
          enterFanTime: nowTime
        },
        this.addOrEditSchedulId = null;
    }, 
    addFanRecord(item){
        this.addEditFanRecordFormRest();
        this.addEditFanRecordForm.liveSchedulId = item.id;
        this.addEditFanRecordTitle = item.liveRoomName + "-" + item.fanChannelName + "-" + item.liveNutritionistName + "-" + this.parseTime(item.liveStartTime, '{h}:{i}') +"至" + this.parseTime(item.liveEndTime, '{h}:{i}') + "直播-添加进粉记录";
        this.addEditFanRecordOpen = true;
    },
    updateFanRecord(item){
        this.addEditFanRecordFormRest();
        if(item.id == null){
            return;
        }
        this.addEditFanRecordForm = {
          id: item.id,
          liveSchedulId: item.liveSchedulId,
          saleWxAccountId: item.saleWxAccountId,
          fanWxNumber: item.fanWxNumber,
          enterFanTime: item.enterFanTime
        };
        let liveSchedul = this.getLiveSchedulById(item.liveSchedulId);
        this.addEditFanRecordTitle = liveSchedul.liveRoomName + "-" + liveSchedul.fanChannelName + "-" + liveSchedul.liveNutritionistName + "-" + this.parseTime(liveSchedul.liveStartTime, '{h}:{i}') +"至" + this.parseTime(liveSchedul.liveEndTime, '{h}:{i}') + "直播-编辑进粉记录";
        this.addEditFanRecordOpen = true;
    },
    delFanRecord(item){
        if(item == null || item.id == null){
          return;
        }
        delSysLiveSchedulFanRecord({'id': item.id}).then((reponse) => {
            if(reponse.code == 200){
              this.msgSuccess("删除成功");
              this.addEditFanRecordOpen = false;
               this.getList();
            }else{
              this.msgSuccess("删除失败");
            }
        });
    },
    submitAddEditFanRecordForm(){
         this.$refs["addEditFanRecordForm"].validate(valid => {
            if (valid) {
                  addOrEditSysLiveSchedulFanRecord(this.addEditFanRecordForm).then((response) => {
                      if(response.code == 200){
                            this.msgSuccess(this.addEditFanRecordForm.id == null ? "添加成功" : "编辑成功");
                            this.addEditFanRecordOpen = false;
                            this.addOrEditSchedulId = this.addEditFanRecordForm.liveSchedulId;
                            this.getList();
                      }else{
                         this.msgError(this.addEditFanRecordForm.id == null ? "添加失败" : "编辑失败");
                      }

                  });
            }else{
              this.msgError("数据未填写完整");
            }
         });
    },
    cancelAddEditFanRecordForm(){
        this.addEditFanRecordOpen = false;
    },
    getLiveSchedulById(id){
      if(this.liveSchedulList != null && this.liveSchedulList.length > 0 && id != null){
         return this.liveSchedulList.find((opt) => opt.id === id);
      }
    },
    getTotalImportFanNum(list){
       if(!list || list == null || list.length == 0){
          return 0;
       }
       let num = 0;
       list.forEach((item,index) => {
          num += item.fanNum;
       });
       return num;
    }
  }
};
</script>

<style lang="scss" scoped>
  .totalSpan{
    margin-left: 10px;
    color: #606266;
    font-weight: normal;
    font-size:13px;
  }
</style>
