<template>
  <div class="app-container">
    <div class="search-bx">
      <div class="search">
        <el-row :gutter="0">
          <el-input
            v-model="tableObj.getdataListParm.parammaps.remoteCode"
            placeholder="远程服务编号"
            class="filter-item"
            style="width: 120px; padding-bottom: 10px"
          />

          <el-select
            v-model="tableObj.getdataListParm.parammaps.statusName"
            placeholder="服务状态"
            class="filter-item"
            style="width: 120px"
            clearable
          >
            <el-option
              v-for="item in statusNameList"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            />
          </el-select>

          <el-date-picker
            v-model="tableObj.getdataListParm.parammaps.inputDatetime1"
            class="inputDatetime filter-item"
            type="daterange"
            range-separator="至"
            start-placeholder="服务开始日期"
            end-placeholder="服务开始日期"
            style="width: 250px"
          />

          <el-date-picker
            v-model="tableObj.getdataListParm.parammaps.inputDatetime2"
            class="inputDatetime filter-item"
            type="daterange"
            range-separator="至"
            start-placeholder="服务完成日期"
            end-placeholder="服务完成日期"
            style="width: 250px"
          />

          <!-- <el-autocomplete v-model="tableObj.getdataListParm.parammaps.customerName" :fetch-suggestions="customer_search" placeholder="客户名称" style="width: 200px;margin-right:10px" @select="change_customer_select" @clear="clear_customer_select" @blur="customer_search_blur" clearable>
                <template slot-scope="{ item }">
                  <span class="name">{{ item.name }}</span>
                </template>
              </el-autocomplete> -->
          <el-input
            v-model="tableObj.getdataListParm.parammaps.customerName"
            placeholder="客户名称"
            style="width: 180px"
            class="filter-item"
            clearable
          />

          <el-select
            v-model="tableObj.getdataListParm.parammaps.groupId"
            placeholder="集团"
            class="filter-item"
            style="width: 120px"
            clearable
          >
            <el-option
              v-for="item in groupNameList"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            />
          </el-select>

          <el-input
            v-model="tableObj.getdataListParm.parammaps.receiverName"
            placeholder="客户对接人"
            style="width: 180px"
            class="filter-item"
            clearable
          />

          <el-select
            v-model="tableObj.getdataListParm.parammaps.employeeId"
            placeholder="技术人员"
            class="filter-item"
            style="width: 120px"
            clearable
          >
            <el-option
              v-for="item in employeeNameList"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            />
          </el-select>

          <el-select
            v-model="tableObj.getdataListParm.parammaps.costStatus"
            placeholder="款项状态"
            class="filter-item"
            style="width: 120px"
            clearable
          >
            <el-option
              v-for="item in moneyNameList"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            />
          </el-select>

          <el-input
            v-model="tableObj.getdataListParm.parammaps.beginRemoteCost"
            placeholder="服务费用"
            style="width: 90px"
            onkeyup="this.value=this.value.replace(/[^\d.]/g,'');"
          ></el-input>
          -
          <el-input
            v-model="tableObj.getdataListParm.parammaps.endRemoteCost"
            placeholder="服务费用"
            style="width: 90px"
            onkeyup="this.value=this.value.replace(/[^\d.]/g,'');"
          ></el-input>

          <el-date-picker
            v-model="tableObj.getdataListParm.parammaps.inputDatetime3"
            class="inputDatetime filter-item"
            type="daterange"
            range-separator="至"
            start-placeholder="支付时间"
            end-placeholder="支付时间"
            style="width: 250px"
          />

          <el-date-picker
            v-model="tableObj.getdataListParm.parammaps.inputDatetime4"
            class="inputDatetime filter-item"
            type="daterange"
            range-separator="至"
            start-placeholder="收款时间"
            end-placeholder="收款时间"
            style="width: 250px"
          />

          <el-button class="successBorder" @click="form_search">查询</el-button>
          <el-button class="successBorder" @click="form_clear">重置</el-button>

          <el-button
            v-if="isRemoteAdd"
            class="success"
            icon="el-icon-plus"
            @click="form_add"
            >新增</el-button
          >
          <el-button class="success" icon="el-icon-upload2" @click="form_export"
            >导出</el-button
          >
        </el-row>
      </div>
      <!-- <div class="operation">


          <el-row :gutter="0">
            <el-col :span="21">
              <el-button v-if="isRoleEdit" class="success" icon="el-icon-plus" @click="form_add">新增</el-button>
            </el-col>
            <el-col :span="3">
                <el-dropdown>
                  <el-button class="export">导出</el-button>
                  <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item @click.native="form_export(1)">导出模板</el-dropdown-item>
                    <el-dropdown-item @click.native="form_export(2)">导出数据</el-dropdown-item>
                  </el-dropdown-menu>
                </el-dropdown>
            </el-col>
          </el-row>

        </div> -->
    </div>

    <div class="table">
      <el-table
        :key="tableObj.tableKey"
        v-loading="tableObj.listLoading"
        element-loading-text="给我一点时间"
        :data="tableObj.list"
        border
        fit
        highlight-current-row
        style="width: 100%"
        :row-style="rowStyle"
        :cell-style="cellStyle"
        class="elTable table-fixed"
        :max-height="myHeight"
      >
        <!-- <el-table-column type="selection" align="center" width="50" /> -->
        <el-table-column
          label="序号"
          align="center"
          type="index"
          width="50px"
          fixed="left"
        >
          <template slot-scope="scope">
            <span>{{
              scope.$index + (tableObj.pageNum - 1) * tableObj.pageSize + 1
            }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="远程服务编号"
          min-width="120px"
          align="center"
          show-overflow-tooltip
          fixed="left"
        >
          <template slot-scope="scope">
            <span
              style="color: #409eff; cursor: pointer"
              @click="form_see(scope.row)"
              >{{ scope.row.remoteCode }}</span
            >
          </template>
        </el-table-column>
        <el-table-column
          label="服务状态"
          min-width="90px"
          align="center"
          fixed="left"
        >
          <template slot-scope="scope">
            <span>{{ scope.row.statusName }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="客户名称"
          min-width="90px"
          align="center"
          fixed="left"
        >
          <template slot-scope="scope">
            <span>{{ scope.row.customerName }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="所属集团"
          min-width="90px"
          align="center"
          fixed="left"
        >
          <template slot-scope="scope">
            <span>{{ scope.row.groupName }}</span>
          </template>
        </el-table-column>
        <el-table-column label="客户对接人" min-width="110px" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.receiverName }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="款项状态"
          min-width="110px"
          align="center"
          show-overflow-tooltip
        >
          <template slot-scope="scope">
            <span>{{ scope.row.costStatus }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="服务费用"
          min-width="110px"
          align="center"
          show-overflow-tooltip
        >
          <template slot-scope="scope">
            <span>{{ scope.row.remoteCost }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="支付时间"
          min-width="110px"
          align="center"
          show-overflow-tooltip
        >
          <template slot-scope="scope">
            <span>{{ scope.row.payDate }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="收款时间"
          min-width="110px"
          align="center"
          show-overflow-tooltip
        >
          <template slot-scope="scope">
            <span>{{ scope.row.collectDate }}</span>
          </template>
        </el-table-column>
        <el-table-column label="服务开始时间" min-width="110px" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.remoteBeginDate }}</span>
          </template>
        </el-table-column>
        <el-table-column label="服务完成时间" min-width="110px" align="center">
          <template slot-scope="scope">
            <span>{{ scope.row.remoteEndDate }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="服务内容"
          min-width="120px"
          align="center"
          show-overflow-tooltip
        >
          <template slot-scope="scope">
            <span>{{ scope.row.content }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="技术人员"
          min-width="110px"
          align="center"
          show-overflow-tooltip
        >
          <template slot-scope="scope">
            <span>{{ scope.row.employeeName }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="备注"
          min-width="120px"
          align="center"
          show-overflow-tooltip
        >
          <template slot-scope="scope">
            <span>{{ scope.row.remark }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="拜访记录关联"
          min-width="110px"
          align="center"
          show-overflow-tooltip
        >
          <template slot-scope="scope">
            <span>{{ scope.row.visitName }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="回访记录关联"
          min-width="110px"
          align="center"
          show-overflow-tooltip
        >
          <template slot-scope="scope">
            <span>{{ scope.row.telvisitName }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="服务总结"
          min-width="110px"
          align="center"
          show-overflow-tooltip
        >
          <template slot-scope="scope">
            <span>{{ scope.row.remoteSummary }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="录入日期"
          min-width="110px"
          align="center"
          show-overflow-tooltip
        >
          <template slot-scope="scope">
            <span>{{ scope.row.createrDate }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="操作"
          align="center"
          :width="autoWidth"
          v-if="autoWidth !== 0"
          class-name="small-padding fixed-width"
          fixed="right"
        >
          <template slot-scope="{ row }">
            <el-button
              class="miniPrimary"
              @click="form_see(row)"
              v-if="isRemoteFeed && row.isFeedBack == '1'"
              >服务反馈</el-button
            >
            <el-button
              class="miniSuccess"
              @click="form_edit(row)"
              v-if="isRemoteAdd && row.isModify == '1'"
              >编辑</el-button
            >
            <el-button
              class="miniDanger"
              @click="form_delete(row)"
              v-if="isRemoteAdd && row.isDel == '1'"
              >删除</el-button
            >
            <el-button
              class="miniSuccess"
              @click="form_complete(row)"
              v-if="isRemoteComplete && row.isComplete == '1'"
              >完成</el-button
            >

            <el-button
              class="miniSuccess"
              @click="form_revoke(row)"
              v-if="isRemoteAdd && row.isRevoke == '1'"
              >撤销</el-button
            >
          </template>
        </el-table-column>
      </el-table>

      <el-row :gutter="0">
        <el-col :span="6" :offset="12" style="color: #f00">
          列表服务总金额：{{ tableSumMoney }}
        </el-col>
      </el-row>

      <pagination
        v-show="tableObj.total >= 0"
        :total="tableObj.total"
        :page.sync="tableObj.getdataListParm.offset"
        :limit.sync="tableObj.getdataListParm.pagecount"
        @pagination="get_table_data"
      />
    </div>

    <!-- 新增/编辑 -->
    <el-dialog
      :title="textMap[create.dialogStatus]"
      :visible.sync="create.dialogFormVisible"
      :close-on-click-modal="false"
      width="70%"
    >
      <div class="app-add">
        <el-form
          ref="temp"
          :rules="create.rules"
          :model="create.temp"
          label-position="right"
          label-width="150px"
          style="width: 80%; margin: 0 auto 50px"
        >
          <!-- <el-form-item label="所属集团：" prop="groupId">
              <el-select v-model="create.temp.groupId" placeholder="所属集团" class="filter-item" style="width: 100%;" filterable  @change="change_group" clearable :disabled="create.dialogStatus=='see' || create.dialogStatus=='update' " >
                  <el-option v-for="item in groupNameList" :key="item.id" :label="item.name" :value="item.id" />
              </el-select>
           </el-form-item> -->

          <el-form-item label="客户名称：" prop="customerId">
            <el-select
              v-model="create.temp.customerId"
              filterable
              placeholder="客户名称"
              class="filter-item"
              style="width: 100%"
              clearable
              @change="change_customer"
              :disabled="
                create.dialogStatus == 'see' || create.dialogStatus == 'update'
              "
            >
              <el-option
                v-for="item in create.customerNameList"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              />
            </el-select>
          </el-form-item>

          <el-form-item label="集团：" prop="groupName">
            <el-input
              ref="groupName"
              v-model="create.temp.groupName"
              class="filter-item"
              style="width: 100%"
              disabled
            />
          </el-form-item>

          <el-form-item label="开始服务日期：" prop="remoteBeginDate">
            <el-date-picker
              v-model="create.temp.remoteBeginDate"
              type="date"
              placeholder="选择日期"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              style="width: 100%"
              :clearable="false"
              :disabled="create.dialogStatus == 'see'"
            />
          </el-form-item>
          <!-- <el-form-item label="服务人员：" prop="employeeId">
            <el-select ref="employeeId" v-model="create.temp.employeeId" filterable placeholder="" class="filter-item" style="width: 100%;" :disabled="create.dialogStatus=='see'">
              <el-option v-for="item in employeeNameList" :key="item.id" :label="item.name" :value="item.id" />
            </el-select>
          </el-form-item> -->
          <el-form-item label="服务人员：" prop="employeeName">
            <el-input
              ref="employeeName"
              v-model="create.temp.employeeName"
              placeholder=""
              class="filter-item"
              style="width: 100%"
              disabled
            />
          </el-form-item>

          <el-form-item label="客户对接人：" prop="receiverName">
            <el-input
              ref="content"
              v-model="create.temp.receiverName"
              placeholder="请输入客户对接人"
              class="filter-item"
              style="width: 100%"
              :disabled="create.dialogStatus == 'see'"
            />
          </el-form-item>

          <!-- <el-form-item label="客户对接人：" prop="receiverId">
            <el-select ref="receiverId" v-model="create.temp.receiverId" filterable placeholder="请选择客户对接人" class="filter-item" style="width: 100%;" @change="changeReceiver" allow-create :disabled="create.dialogStatus=='see'">
              <el-option v-for="item in create.receiverNameList" :key="item.id" :label="item.name" :value="item.id" />
            </el-select>
          </el-form-item> -->

          <el-form-item label="拜访记录关联：" prop="visitId">
            <el-select
              ref="visitId"
              v-model="create.temp.visitId"
              filterable
              placeholder="请选择拜访记录单号"
              class="filter-item"
              style="width: 100%"
              :disabled="create.dialogStatus == 'see'"
              clearable
            >
              <el-option
                v-for="item in create.visitNameList"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="回访记录关联：" prop="telvisitId">
            <el-select
              ref="telvisitId"
              v-model="create.temp.telvisitId"
              filterable
              placeholder="请选择回访记录单号"
              class="filter-item"
              style="width: 100%"
              :disabled="create.dialogStatus == 'see'"
              clearable
            >
              <el-option
                v-for="item in create.telvisitNameList"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>

          <el-form-item label="服务内容：" prop="content">
            <el-input
              ref="content"
              v-model="create.temp.content"
              type="textarea"
              placeholder="请输入服务内容"
              maxlength="255"
              class="filter-item"
              style="width: 100%"
              :disabled="create.dialogStatus == 'see'"
            />
          </el-form-item>

          <el-form-item label="备注：" prop="remark">
            <el-input
              ref="remark"
              v-model="create.temp.remark"
              type="textarea"
              :autosize="{ minRows: 1.3, maxRows: 4 }"
              placeholder="请输入备注，最多255个字"
              maxlength="255"
              class="filter-item"
              style="width: 100%"
              :disabled="create.dialogStatus == 'see'"
            />
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button
            class="cancelClose"
            @click="
              create.dialogFormVisible = false;
              get_table_data();
            "
            >关闭</el-button
          >
          <el-button
            v-if="
              create.dialogStatus === 'create' ||
              create.dialogStatus === 'update'
            "
            class="success"
            :disabled="isokDisable"
            @click="
              create.dialogStatus === 'create'
                ? add_dialog_save()
                : form_edit_save()
            "
            >确认</el-button
          >
        </div>
      </div>
    </el-dialog>

    <!-- 查看/反馈 -->
    <el-dialog
      title="远程服务详情"
      :visible.sync="createSee.dialogFormVisible"
      :close-on-click-modal="false"
      width="95%"
    >
      <div class="app-add">
        <el-form
          ref="createSeetemp"
          :rules="createSee.rules"
          :model="create.temp"
          label-position="right"
          label-width="150px"
          style="width: 100%; margin: 0 auto 50px"
        >
          <el-row :gutter="25">
            <el-col :span="8">
              <el-form-item label="服务编号：" prop="remoteCode">
                <el-input
                  ref="remoteCode"
                  v-model="createSee.temp.remoteCode"
                  class="filter-item"
                  style="width: 100%"
                  disabled
                />
              </el-form-item>

              <el-form-item label="服务状态：" prop="statusName">
                <el-input
                  ref="statusName"
                  v-model="createSee.temp.statusName"
                  class="filter-item"
                  style="width: 100%"
                  disabled
                />
              </el-form-item>

              <el-form-item label="客户名称：" prop="customerName">
                <el-input
                  ref="customerName"
                  v-model="createSee.temp.customerName"
                  class="filter-item"
                  style="width: 100%"
                  disabled
                />
              </el-form-item>

              <el-form-item label="所属集团：" prop="groupName">
                <el-input
                  ref="groupName"
                  v-model="createSee.temp.groupName"
                  class="filter-item"
                  style="width: 100%"
                  disabled
                />
              </el-form-item>

              <el-form-item label="客户对接人：" prop="receiverName">
                <el-input
                  ref="receiverName"
                  v-model="createSee.temp.receiverName"
                  class="filter-item"
                  style="width: 100%"
                  disabled
                />
              </el-form-item>

              <el-form-item label="技术人员：" prop="employeeName">
                <el-input
                  ref="employeeName"
                  v-model="createSee.temp.employeeName"
                  class="filter-item"
                  style="width: 100%"
                  disabled
                />
              </el-form-item>

              <el-form-item label="服务开始时间：" prop="remoteBeginDate">
                <el-input
                  ref="remoteBeginDate"
                  v-model="createSee.temp.remoteBeginDate"
                  class="filter-item"
                  style="width: 100%"
                  disabled
                />
              </el-form-item>

              <el-form-item label="拜访记录关联：" prop="visitName">
                <el-input
                  ref="visitName"
                  v-model="createSee.temp.visitName"
                  class="filter-item"
                  style="width: 100%"
                  disabled
                />
              </el-form-item>

              <el-form-item label="回访记录关联：" prop="telvisitName">
                <el-input
                  ref="telvisitName"
                  v-model="createSee.temp.telvisitName"
                  class="filter-item"
                  style="width: 100%"
                  disabled
                />
              </el-form-item>

              <el-form-item label="服务内容：" prop="content">
                <el-input
                  ref="content"
                  v-model="createSee.temp.content"
                  type="textarea"
                  maxlength="255"
                  class="filter-item"
                  style="width: 100%"
                  disabled
                />
              </el-form-item>

              <el-form-item label="备注：" prop="remark">
                <el-input
                  ref="remark"
                  v-model="createSee.temp.remark"
                  type="textarea"
                  :autosize="{ minRows: 1.3, maxRows: 4 }"
                  maxlength="255"
                  class="filter-item"
                  style="width: 100%"
                  disabled
                />
              </el-form-item>
            </el-col>

            <el-col :span="16">
              <h3>反馈记录</h3>
              <el-row>
                <div v-for="item in feedRecordList">
                  <div>
                    <span>{{ item.num }}</span>
                    <span>{{ item.remark }}</span>
                  </div>
                  <el-row type="flex" justify="end">
                    <el-col :span="6">
                      {{ item.createDate }}
                    </el-col>
                    <el-col :span="6"> 反馈人：{{ item.employeeName }} </el-col>
                  </el-row>
                  <el-divider></el-divider>
                </div>

                <el-input
                  type="textarea"
                  :rows="4"
                  placeholder="请输入内容"
                  v-model="feedRecordTemp.parammaps.remark"
                >
                </el-input>

                <el-button class="success" @click="feedRecord_save()"
                  >确认</el-button
                >
              </el-row>
            </el-col>
          </el-row>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button
            class="cancelClose"
            @click="
              createSee.dialogFormVisible = false;
              get_table_data();
            "
            >关闭</el-button
          >

          <el-button
            class="success"
            @click="form_complete(createSee.temp)"
            v-if="isRemoteComplete && createSee.temp.isComplete == '1'"
            >完成服务</el-button
          >
        </div>
      </div>
    </el-dialog>

    <!-- 完成 -->
    <el-dialog
      title="确认是否完成"
      :visible.sync="complete.dialogFormVisible"
      :close-on-click-modal="false"
      width="40%"
      :before-close="dialog_complete_close"
    >
      <div class="app-add">
        <el-form
          ref="completetemp"
          :rules="complete.rules"
          :model="complete.temp"
          label-position="right"
          label-width="150px"
          style="width: 80%; margin: 0 auto 50px"
        >
          <el-form-item label="款项状态：" prop="costStatus">
            <el-select
              ref="costStatus"
              v-model="complete.temp.costStatus"
              class="filter-item"
              style="width: 100%"
              @change="change_money_status"
              allow-create
            >
              <el-option
                v-for="item in moneyStatusList"
                :key="item.id"
                :label="item.name"
                :value="item.id"
              />
            </el-select>
          </el-form-item>

          <el-form-item label="服务费用：" prop="remoteCost" v-if="moneyShow">
            <el-input
              ref="remoteCost"
              v-model="complete.temp.remoteCost"
              class="filter-item"
              style="width: 95%"
            />元
          </el-form-item>

          <el-form-item label="支付时间：" prop="payDate" v-if="moneyShow">
            <el-date-picker
              v-model="complete.temp.payDate"
              type="date"
              placeholder="选择日期"
              format="yyyy-MM-dd"
              value-format="yyyy-MM-dd"
              style="width: 100%"
              :clearable="false"
            />
          </el-form-item>

          <el-form-item label="服务总结：" prop="remark">
            <el-input
              ref="remoteSummary"
              v-model="complete.temp.remoteSummary"
              type="textarea"
              :autosize="{ minRows: 1.3, maxRows: 5 }"
              :rows="3"
              placeholder="请输入服务总结，最多255个字"
              maxlength="255"
              class="filter-item"
              style="width: 100%"
            />
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button class="cancelClose" @click="dialog_complete_close()"
            >关闭</el-button
          >
          <el-button class="success" @click="form_complete_save()"
            >确认</el-button
          >
        </div>
      </div>
    </el-dialog>

    <!-- 撤销 -->
    <el-dialog
      title="确认是否撤销"
      :visible.sync="revoke.dialogFormVisible"
      :close-on-click-modal="false"
      width="60%"
    >
      <div class="app-add">
        <el-form
          ref="revoketemp"
          :rules="revoke.rules"
          :model="revoke.temp"
          label-position="right"
          label-width="150px"
          style="width: 80%; margin: 0 auto 50px"
        >
          <el-form-item label="撤销原因：" prop="revokeReason">
            <el-input
              ref="remark"
              v-model="revoke.temp.revokeReason"
              type="textarea"
              :autosize="{ minRows: 4, maxRows: 8 }"
              :rows="8"
              placeholder="请输入备注，最多200个字"
              maxlength="200"
              class="filter-item"
              style="width: 100%"
            />
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button
            class="cancelClose"
            @click="
              revoke.dialogFormVisible = false;
              get_table_data();
            "
            >关闭</el-button
          >
          <el-button class="success" @click="form_revoke_save()"
            >确认</el-button
          >
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import {
  GetDataByName,
  PostDataByName,
  failproccess,
  ExecDataByConfig,
  GetDataByNames,
  checkButtons,
  calculativeWidth,
  wxpush,
  handleWechatPush,
} from "@/api/common";
import Cookies from "js-cookie";
import { parseTime, json2excel } from "@/utils/index.js";
import Pagination from "@/components/Pagination";
import { MessageBox } from "element-ui";
export default {
  name: "RemoteService",
  components: { Pagination },
  data() {
    return {
      myHeight: document.documentElement.clientHeight - 85 - 220,
      employeid: Cookies.get("employeid"),
      isRoleEdit: [],
      isRemoteAdd: [],
      isRemoteFeed: [],
      isRemoteComplete: [],

      rowData: {},
      isHome: "",

      send_select_list: [
        { name: "getCustomerSelect", offset: 0, pagecount: 0, parammaps: {} },
        {
          name: "getDictListSelect1",
          offset: 0,
          pagecount: 0,
          parammaps: { pid: "54" },
        },
        { name: "getEmployeesSelect", offset: 0, pagecount: 0, parammaps: {} },
      ],
      customerNameList: [], // 客户名称
      groupNameList: [], // 集团
      employeeNameList: [], // 技术人员

      // 下拉框 - 服务状态
      statusNameList: [
        { name: "服务中", id: "服务中" },
        { name: "已完成", id: "已完成" },
        { name: "已撤销", id: "已撤销" },
        { name: "超时", id: "超时" },
      ],

      // 下拉框 - 款项状态
      moneyNameList: [
        { name: "未收款", id: "未收款" },
        { name: "已收款", id: "已收款" },
        { name: "无需收款", id: "无需收款" },
      ],
      // 下拉框 - 款项状态
      moneyStatusList: [
        { name: "需要收款", id: "需要收款" },
        { name: "无需收款", id: "无需收款" },
      ],

      //表格 - 列表 - 查询
      tableObj: {
        getdataListParm: {
          name: "getRemote",
          page: 1,
          offset: 1,
          pagecount: parseInt(Cookies.get("pagecount")),
          returntype: "Map",
          parammaps: {
            roleId: Cookies.get("g_roleId"),
            userId: Cookies.get("g_userId"),
            remoteCode: "",
            customerId: "",
            customerName: "",
            groupId: "",
            statusName: "",

            inputDatetime1: "",
            inputDatetime2: "",
            inputDatetime3: "",
            inputDatetime4: "",

            beginRemoteBeginDate: "",
            endRemoteBeginDate: "",
            beginRemoteEndDate: "",
            endRemoteEndDate: "",
            beginPayDate: "",
            endPayDate: "",
            beginCollectDate: "",
            endCollectDate: "",

            employeeId: "",
            receiverName: "",
            receiverId: "",
            costStatus: "",
            beginRemoteCost: "",
            endRemoteCost: "",
          },
        },
        tableKey: 0,
        list: [
          {
            id: 1,
          },
        ],
        total: 0,
        listLoading: false,
        temp: {},
      },
      tableSumMoney: 1000,

      download: {
        getdataListParm: {
          name: "getRemote",
          page: 1,
          offset: 1,
          pagecount: 0,
          returntype: "Map",
          parammaps: {
            roleId: Cookies.get("g_roleId"),
            userId: Cookies.get("g_userId"),
            remoteCode: "",
            customerId: "",
            customerName: "",
            groupId: "",
            statusName: "",

            inputDatetime1: "",
            inputDatetime2: "",
            inputDatetime3: "",
            inputDatetime4: "",

            beginRemoteBeginDate: "",
            endRemoteBeginDate: "",
            beginRemoteEndDate: "",
            endRemoteEndDate: "",
            beginPayDate: "",
            endPayDate: "",
            beginCollectDate: "",
            endCollectDate: "",

            employeeId: "",
            receiverName: "",
            receiverId: "",
            costStatus: "",
            beginRemoteCost: "",
            endRemoteCost: "",
          },
        },
        tableKey: 0,
        list: [
          {
            id: 1,
          },
        ],
        total: 0,
        listLoading: false,
        temp: {},
      },

      // 新增/编辑
      create: {
        dialogFormVisible: false,
        dialogStatus: "",
        temp: {
          customerId: "",
          groupId: "",
          groupName: "",
          remoteBeginDate: parseTime(new Date(), "{y}-{m}-{d}"),
          employeeId: "",
          receiverId: "",
          receiverName: "",
          content: "",
          remark: "",
          visitId: "",
          telvisitId: "",
          modifyName: "add",
          receiverChoose: "true",
        },

        rules: {
          customerId: [{ required: true, message: "必填", trigger: "blur" }],
          // groupId: [{ required: true, message: '必填', trigger: 'blur' }],
          remoteBeginDate: [
            { required: true, message: "必填", trigger: "blur" },
          ],
          visiterId: [{ required: true, message: "必填", trigger: "blur" }],

          receiverName: [{ required: true, message: "必填", trigger: "blur" }],
          content: [
            {
              type: "string",
              required: true,
              message: "必填",
              trigger: "blur",
            },
          ],
        },
        // 客户对接人
        getdataListParm1: {
          name: "getContacts",
          returntype: "Map",
          parammaps: { customerId: "" },
        },
        receiverNameList: [], // 客户对接人
        // 客户名称
        getdataListParmCust: {
          name: "getCustomerByGroupId",
          returntype: "Map",
          parammaps: { groupId: "" },
        },
        customerNameList: [],
        // 拜访记录
        getdataListParm3: {
          name: "getVisitByCustomerId",
          returntype: "Map",
          parammaps: { customerId: "" },
        },
        visitNameList: [], // 拜访记录
        // 回访记录
        getdataListParm4: {
          name: "getTelvisitByCustomerId",
          returntype: "Map",
          parammaps: { customerId: "" },
        },
        telvisitNameList: [], // 回访记录
      },
      // 查看/反馈
      createSee: {
        dialogFormVisible: false,
        dialogStatus: "",
        temp: {
          customerId: "",
          groupId: "",
          groupName: "",
          remoteBeginDate: parseTime(new Date(), "{y}-{m}-{d}"),
          employeeId: "",
          receiverId: "",
          receiverName: "",
          content: "",
          remark: "",
          visitId: "",
          telvisitId: "",
          modifyName: "add",
          receiverChoose: "true",
        },

        rules: {},
      },

      // 撤销
      revoke: {
        dialogFormVisible: false,
        dialogStatus: "",
        temp: { revokeReason: "", id: "" },
        rules: {
          revokeReason: [{ required: true, message: "必填", trigger: "blur" }],
        },
      },

      // 完成
      complete: {
        dialogFormVisible: false,
        dialogStatus: "",
        temp: {
          costStatus: "需要收款",
          remoteCost: "",
          payDate: "",
          remoteSummary: "",
          id: "",
        },
        rules: {
          // revokeReason: [{ required: true, message: '必填', trigger: 'blur' }],
        },
      },
      moneyShow: true,
      //获取反馈记录
      getFeedRecordParm: {
        name: "getRemoteFeedbackById",
        page: 1,
        offset: 1,
        pagecount: 10,
        returntype: "Map",
        parammaps: { id: "" },
      },
      //保存反馈记录
      feedRecordTemp: {
        name: "insertRemoteFeedback",
        page: 1,
        offset: 1,
        pagecount: 1000,
        returntype: "Map",
        parammaps: {
          remoteId: "",
          createrId: "",
          remark: "",
        },
      },
      //反馈记录
      feedRecordList: [
        // {id:1, num: 1, txt: '主板缺失零件，疫情关系，无法采购，延期1天',   director:'epans', date:"2022-12-01"},
        // {id:1, num: 1, txt: '主板缺失零件，疫情关系，无法采购，延期1天',   director:'epans', date:"2022-12-01"},
        // {id:1, num: 1, txt: '主板缺失零件，疫情关系，无法采购，延期1天',   director:'epans', date:"2022-12-01"},
      ],

      textMap: {
        create: "新增",
        see: "查看",
        update: "编辑",
      },
      autoWidth: 130,
      requestParam: {},
      isokDisable: false,
      selectList: [],
      rowStyle: { maxHeight: 50 + "px", height: 45 + "px" },
      cellStyle: { padding: 0 + "px" },
    };
  },

  created() {
    this.get_select_list();
    this.get_auto_buttons();

    var rowData = this.$route.params.rowData;
    var isHome = this.$route.params.isHome;
    var codeNum = this.$route.params.codeNum;

    console.log(
      "rowData",
      rowData,
      "======isHome",
      isHome,
      "======codeNum",
      codeNum
    );

    if (isHome == "home") {
      this.rowData = rowData;
      this.isHome = isHome;
      this.tableObj.getdataListParm.parammaps.remoteCode = codeNum;
      this.get_table_data();
    } else {
      this.rowData = {};
      this.isHome = "";
      this.codeNum = "";
      this.tableObj.getdataListParm.parammaps.remoteCode = "";
      this.get_table_data();
    }
  },

  methods: {
    //获取按钮权限
    get_auto_buttons() {
      const Edit = "RemoteService";
      const isRoleEdit = checkButtons(
        JSON.parse(sessionStorage.getItem("buttons")),
        Edit
      );
      this.isRoleEdit = isRoleEdit;

      const RemoteAdd = "business:remote:add";
      const isRemoteAdd = checkButtons(
        this.$store.state.user.buttons,
        RemoteAdd
      );
      this.isRemoteAdd = isRemoteAdd;

      const RemoteFeed = "business:remote:feedback";
      const isRemoteFeed = checkButtons(
        this.$store.state.user.buttons,
        RemoteFeed
      );
      this.isRemoteFeed = isRemoteFeed;

      const RemoteComplete = "business:remote:complete";
      const isRemoteComplete = checkButtons(
        this.$store.state.user.buttons,
        RemoteComplete
      );
      this.isRemoteComplete = isRemoteComplete;

      //操作的宽度
      // var widthCount = calculativeWidth(isRemoteFeed,isRemoteAdd,isRemoteAdd,isRemoteAdd,isRemoteComplete)
      // this.autoWidth = widthCount
    },
    //获取所有下拉框的内容
    get_select_list() {
      GetDataByNames(this.send_select_list).then((response) => {
        this.create.customerNameList = response.data.getCustomerSelect.list;
        console.log("客户名称下拉框", this.create.customerNameList);
        this.groupNameList = response.data.getDictListSelect1.list;
        console.log("集团下拉框", this.groupNameList);
        this.employeeNameList = response.data.getEmployeesSelect.list;
        console.log("技术人员下拉框", this.visiterNameList);
      });
    },
    //加载表格
    get_table_data() {
      var me = this;
      this.tableObj.listLoading = true;
      console.log(
        "this.tableObj.getdataListParm======>",
        this.tableObj.getdataListParm
      );
      GetDataByName(this.tableObj.getdataListParm).then((response) => {
        console.log("table数据======>", response.data.list);
        if (response.data.list !== null) {
          this.tableObj.list = response.data.list;
          this.tableObj.pageNum = response.data.pageNum;
          this.tableObj.pageSize = response.data.pageSize;
          this.tableObj.total = response.data.total;

          //计算操作栏宽度
          var btnNum = 0;
          var arrList = response.data.list;
          arrList.forEach(function (row) {
            var itemBtnNum = 0;
            if (me.isRemoteFeed && row.isFeedBack == "1") {
              itemBtnNum = itemBtnNum + 1;
            }
            if (me.isRemoteAdd && row.isModify == "1") {
              itemBtnNum = itemBtnNum + 1;
            }
            if (me.isRemoteAdd && row.isDel == "1") {
              itemBtnNum = itemBtnNum + 1;
            }
            if (me.isRemoteComplete && row.isComplete == "1") {
              itemBtnNum = itemBtnNum + 1;
            }
            if (me.isRemoteAdd && row.isRevoke == "1") {
              itemBtnNum = itemBtnNum + 1;
            }

            console.log(itemBtnNum);
            if (itemBtnNum > btnNum) {
              btnNum = itemBtnNum;
            }
          });
          console.log("btnNum=============", btnNum);
          me.autoWidth = btnNum * 90;
        } else {
          this.tableObj.list = [];
        }
        setTimeout(() => {
          this.tableObj.listLoading = false;
        }, 100);
      });

      var send_price = {
        name: "getRemoteOfPrice",
        parammaps: this.tableObj.getdataListParm.parammaps,
      };

      GetDataByName(send_price).then((response) => {
        console.log("table总价格数据======>", response);
        if (response.data.list !== null) {
          this.tableSumMoney = response.data.list[0].totlePrice;
        } else {
          this.tableSumMoney = "";
        }
      });
    },

    form_search() {
      console.log("点击了查询");

      if (
        this.tableObj.getdataListParm.parammaps.inputDatetime1 !== "" &&
        this.tableObj.getdataListParm.parammaps.inputDatetime1 !== null
      ) {
        this.tableObj.getdataListParm.parammaps.beginRemoteBeginDate =
          parseTime(
            this.tableObj.getdataListParm.parammaps.inputDatetime1[0],
            "{y}-{m}-{d}"
          );
        this.tableObj.getdataListParm.parammaps.endRemoteBeginDate = parseTime(
          this.tableObj.getdataListParm.parammaps.inputDatetime1[1],
          "{y}-{m}-{d}"
        );
      } else {
        this.tableObj.getdataListParm.parammaps.inputDatetime1 = "";
        this.tableObj.getdataListParm.parammaps.beginRemoteBeginDate = "";
        this.tableObj.getdataListParm.parammaps.endRemoteBeginDate = "";
      }

      if (
        this.tableObj.getdataListParm.parammaps.inputDatetime2 !== "" &&
        this.tableObj.getdataListParm.parammaps.inputDatetime2 !== null
      ) {
        this.tableObj.getdataListParm.parammaps.beginRemoteEndDate = parseTime(
          this.tableObj.getdataListParm.parammaps.inputDatetime2[0],
          "{y}-{m}-{d}"
        );
        this.tableObj.getdataListParm.parammaps.endRemoteEndDate = parseTime(
          this.tableObj.getdataListParm.parammaps.inputDatetime2[1],
          "{y}-{m}-{d}"
        );
      } else {
        this.tableObj.getdataListParm.parammaps.inputDatetime2 = "";
        this.tableObj.getdataListParm.parammaps.beginRemoteEndDate = "";
        this.tableObj.getdataListParm.parammaps.endRemoteEndDate = "";
      }

      if (
        this.tableObj.getdataListParm.parammaps.inputDatetime3 !== "" &&
        this.tableObj.getdataListParm.parammaps.inputDatetime3 !== null
      ) {
        this.tableObj.getdataListParm.parammaps.beginPayDate = parseTime(
          this.tableObj.getdataListParm.parammaps.inputDatetime3[0],
          "{y}-{m}-{d}"
        );
        this.tableObj.getdataListParm.parammaps.endPayDate = parseTime(
          this.tableObj.getdataListParm.parammaps.inputDatetime3[1],
          "{y}-{m}-{d}"
        );
      } else {
        this.tableObj.getdataListParm.parammaps.inputDatetime3 = "";
        this.tableObj.getdataListParm.parammaps.endPayDate = "";
        this.tableObj.getdataListParm.parammaps.beginPayDate = "";
      }

      if (
        this.tableObj.getdataListParm.parammaps.inputDatetime4 !== "" &&
        this.tableObj.getdataListParm.parammaps.inputDatetime4 !== null
      ) {
        this.tableObj.getdataListParm.parammaps.beginCollectDate = parseTime(
          this.tableObj.getdataListParm.parammaps.inputDatetime4[0],
          "{y}-{m}-{d}"
        );
        this.tableObj.getdataListParm.parammaps.endCollectDate = parseTime(
          this.tableObj.getdataListParm.parammaps.inputDatetime4[1],
          "{y}-{m}-{d}"
        );
      } else {
        this.tableObj.getdataListParm.parammaps.inputDatetime4 = "";
        this.tableObj.getdataListParm.parammaps.beginCollectDate = "";
        this.tableObj.getdataListParm.parammaps.endCollectDate = "";
      }

      console.log(this.tableObj.getdataListParm.parammaps.beginRemoteCost);
      console.log(this.tableObj.getdataListParm.parammaps.endRemoteCost);

      console.log(
        this.tableObj.getdataListParm.parammaps.beginRemoteCost >
          this.tableObj.getdataListParm.parammaps.endRemoteCost
      );

      if (
        this.tableObj.getdataListParm.parammaps.beginRemoteCost !== "" &&
        this.tableObj.getdataListParm.parammaps.endRemoteCost !== ""
      ) {
        if (
          parseFloat(this.tableObj.getdataListParm.parammaps.beginRemoteCost) >
          parseFloat(this.tableObj.getdataListParm.parammaps.endRemoteCost)
        ) {
          this.$notify({
            title: "失败",
            message: "起始服务费用需要小于终止服务费用!",
            type: "error",
            duration: 2000,
          });
        } else {
          this.tableObj.getdataListParm.offset = 1;
          this.get_table_data();
        }
      } else {
        this.tableObj.getdataListParm.offset = 1;
        this.get_table_data();
      }
    },
    form_clear() {
      console.log("点击了重置");

      this.tableObj.getdataListParm.parammaps.remoteCode = "";
      this.tableObj.getdataListParm.parammaps.customerId = "";
      this.tableObj.getdataListParm.parammaps.customerName = "";
      this.tableObj.getdataListParm.parammaps.groupId = "";
      this.tableObj.getdataListParm.parammaps.statusName = "";
      this.tableObj.getdataListParm.parammaps.inputDatetime1 = "";
      this.tableObj.getdataListParm.parammaps.inputDatetime2 = "";
      this.tableObj.getdataListParm.parammaps.inputDatetime3 = "";
      this.tableObj.getdataListParm.parammaps.inputDatetime4 = "";
      this.tableObj.getdataListParm.parammaps.beginRemoteBeginDate = "";
      this.tableObj.getdataListParm.parammaps.endRemoteBeginDate = "";
      this.tableObj.getdataListParm.parammaps.beginRemoteEndDate = "";
      this.tableObj.getdataListParm.parammaps.endRemoteEndDate = "";
      this.tableObj.getdataListParm.parammaps.beginPayDate = "";
      this.tableObj.getdataListParm.parammaps.endPayDate = "";
      this.tableObj.getdataListParm.parammaps.beginCollectDate = "";
      this.tableObj.getdataListParm.parammaps.endCollectDate = "";
      this.tableObj.getdataListParm.parammaps.employeeId = "";
      this.tableObj.getdataListParm.parammaps.receiverId = "";
      this.tableObj.getdataListParm.parammaps.receiverName = "";
      this.tableObj.getdataListParm.parammaps.costStatus = "";
      this.tableObj.getdataListParm.parammaps.beginRemoteCost = "";
      this.tableObj.getdataListParm.parammaps.endRemoteCost = "";

      this.tableObj.getdataListParm.offset = 1;
      this.get_table_data();
    },

    // 新增
    form_reset() {
      this.create.temp = {
        customerName: "",
        customerId: "",
        groupId: "",
        groupName: "",
        remoteBeginDate: parseTime(new Date(), "{y}-{m}-{d}"),
        employeeId: "",
        receiverName: "",
        receiverName: "",
        content: "",
        remark: "",
        visitId: "",
        telvisitId: "",
        modifyName: "add",
        receiverChoose: "true",
      };
    },

    //客户失去焦点
    customer_search_blur(item) {
      console.log("客户失去焦点");
      this.tableObj.getdataListParm.parammaps.customerId = "";
      this.tableObj.getdataListParm.parammaps.customerName = "";
      this.customerNameList = [];
    },

    //模糊查询客户
    customer_search(queryString, cb) {
      console.log("模糊查询输入值", queryString);
      GetDataByName({
        name: "getCustomerNameFuzzy",
        page: 1,
        offset: 1,
        pagecount: 10,
        returntype: "Map",
        parammaps: { inputvalue: queryString },
      }).then((response) => {
        this.customerNameList = response.data.list;
        console.log("客户名称下拉框", response);
        cb(response.data.list);
      });
    },

    //模糊查询客户选择
    change_customer_select(item) {
      console.log("客户名称模糊查询选中值", item);
      this.tableObj.getdataListParm.parammaps.customerId = item.id;
      this.tableObj.getdataListParm.parammaps.customerName = item.name;
    },

    //清空客户选择
    clear_customer_select(item) {
      document.activeElement.blur();
      this.tableObj.getdataListParm.parammaps.customerId = "";
      this.tableObj.getdataListParm.parammaps.customerName = "";
    },

    //监听 - 集团
    change_group(item) {
      console.log(item);
      console.log(this.create.temp.groupId);
      this.create.temp.groupId = item;
      this.create.getdataListParmCust.parammaps.groupId = item;

      this.create.temp.customerName = "";
      this.create.temp.customerId = "";
      this.create.customerNameList = [];

      this.get_customer_list();
      this.$forceUpdate();
    },
    // 弹窗中的客户
    get_customer_list() {
      GetDataByName(this.create.getdataListParmCust).then((response) => {
        if (response.data.list !== null) {
          this.create.customerNameList = response.data.list;
          console.log("弹窗中的客户数据", response.data.list);
        } else {
          this.create.customerNameList = [];
        }
      });
    },

    //监听 - 下拉中客户名称
    change_customer(item) {
      console.log(item);
      this.create.temp.customerId = item;

      this.create.temp.visitId = "";
      this.create.temp.telvisitId = "";

      // this.create.getdataListParm1.parammaps.customerId = item
      // this.getReceiverNameList()

      this.create.getdataListParm3.parammaps.customerId = item;
      this.getVisitNameList();
      this.create.getdataListParm4.parammaps.customerId = item;
      this.getTelvisitNameList();

      this.get_groupName(item);
    },

    // 获取集团名称
    get_groupName(customerId) {
      var me = this;
      var send_data = {
        name: "getgroupNameById",
        returntype: "Map",
        parammaps: { id: customerId },
      };
      GetDataByName(send_data).then((response) => {
        console.log(response);
        if (response.data.list !== null) {
          me.create.temp.groupName = response.data.list[0].groupName;
          me.create.temp.groupId = response.data.list[0].groupId;
        } else {
          me.create.temp.groupName = "";
          me.create.temp.groupId = "";
        }
      });
    },

    // 客户对接人
    getReceiverNameList() {
      GetDataByName(this.create.getdataListParm1).then((response) => {
        if (response.data.list !== null) {
          this.create.receiverNameList = response.data.list;
          console.log("客户对接人数据", response.data.list);
        } else {
          this.create.receiverNameList = [];
        }
      });
    },
    // 拜访记录
    getVisitNameList() {
      GetDataByName(this.create.getdataListParm3).then((response) => {
        if (response.data.list !== null) {
          this.create.visitNameList = response.data.list;
          console.log("拜访记录数据", response.data.list);
        } else {
          this.create.visitNameList = [];
        }
      });
    },
    // 回访记录
    getTelvisitNameList() {
      GetDataByName(this.create.getdataListParm4).then((response) => {
        if (response.data.list !== null) {
          this.create.telvisitNameList = response.data.list;
          console.log("回访记录数据", response.data.list);
        } else {
          this.create.telvisitNameList = [];
        }
      });
    },

    //监听 - 下拉中客户对接人
    changeReceiver(item) {
      this.create.temp.receiverName = this.create.receiverNameList.find(
        (obj) => obj.id === item
      ).name;
    },

    //新增
    form_add() {
      console.log("点击了新增");
      this.form_reset();

      this.create.temp.employeeId = Cookies.get("g_userId");
      this.create.temp.employeeName = Cookies.get("g_empname");

      this.create.dialogStatus = "create";
      this.create.dialogFormVisible = true;
    },
    //新增保存
    add_dialog_save() {
      console.log("点击了新增保存");
      this.isokDisable = true;
      setTimeout(() => {
        this.isokDisable = false;
      }, 1000);
      this.$refs["temp"].validate((valid) => {
        if (valid) {
          this.isokDisable = true;
          setTimeout(() => {
            this.isokDisable = false;
          }, 1000);

          this.create.temp.createrId = Cookies.get("employeid");
          var send_data = {
            name: "insertRemote",
            parammaps: this.create.temp,
          };

          console.log("新增保存发送参数", send_data);

          PostDataByName(send_data).then((response) => {
            if (response.msg !== "fail") {
              this.$notify({
                title: "成功",
                message: "保存成功",
                type: "success",
                duration: 2000,
              });
              this.create.dialogFormVisible = false;
              this.get_table_data();

              var rowId = response.data.LastInsertId;

              var send_weixin_data1 = {
                name: "getRemindData",
                parammaps: {
                  userId: Cookies.get("g_userId"),
                  remindId: 23,
                  remindTypeName: "远程服务",
                  rowId: rowId,
                },
              };

              handleWechatPush(send_weixin_data1, 23).catch((error) => {
                console.error("微信推送失败:", error);
              });
            } else {
              this.$notify({
                title: "失败",
                message: "保存失败",
                type: "error",
                duration: 2000,
              });
            }
          });
        }
      });
    },
    // 查看
    form_see(row) {
      console.log("点击了查看", row);
      // this.$nextTick(() => {
      //   this.$refs.temp.resetFields()
      // })

      this.createSee.temp = Object.assign({}, row);

      this.createSee.temp.id = row.id;

      this.createSee.dialogFormVisible = true;

      //反馈记录
      this.reset_feedRecord();

      this.getFeedRecordParm.parammaps.id = row.id;
      this.feedRecordTemp.parammaps.remoteId = row.id;
      this.get_feedRecord();
    },

    // 查看中的反馈记录
    get_feedRecord() {
      GetDataByName(this.getFeedRecordParm).then((response) => {
        console.log("查看中的反馈记录", response.data.list);
        if (response.data.list !== null) {
          this.feedRecordList = response.data.list;
        } else {
          this.feedRecordList = [];
        }
      });
    },

    // 反馈记录 - 保存
    feedRecord_save() {
      if (
        this.feedRecordTemp.parammaps.remark == "" ||
        this.feedRecordTemp.parammaps.remark == null
      ) {
        this.$notify({
          title: "反馈失败！",
          message: "请输入反馈内容！",
          type: "warning",
          duration: 2000,
        });
      } else {
        this.feedRecordTemp.parammaps.createrId = Cookies.get("employeid");
        PostDataByName(this.feedRecordTemp).then((response) => {
          if (response.msg === "fail") {
            this.$notify({
              title: "反馈失败",
              message: response.data,
              type: "warning",
              duration: 2000,
            });
          } else {
            this.$notify({
              title: "反馈成功",
              message: "反馈成功",
              type: "success",
              duration: 2000,
            });
            // this.createSee.dialogFormVisible = false
            // this.get_table_data()
            this.get_feedRecord();
            this.feedRecordTemp.parammaps.remark = "";
            this.$forceUpdate();

            var send_weixin_data1 = {
              name: "getRemindData",
              parammaps: {
                userId: Cookies.get("g_userId"),
                remindId: 24,
                remindTypeName: "远程服务",
                rowId: this.getFeedRecordParm.parammaps.id,
              },
            };

            handleWechatPush(send_weixin_data1, 24).catch((error) => {
              console.error("微信推送失败:", error);
            });
          }
        });
      }
    },

    // 反馈 - 重置
    reset_feedRecord() {
      this.feedRecordList = [];
      this.feedRecordTemp.parammaps.remoteId = "";
      this.feedRecordTemp.parammaps.createrId = "";
      this.feedRecordTemp.parammaps.remark = "";
    },

    // 编辑
    form_edit(row) {
      console.log("点击了编辑", row);
      this.create.temp = Object.assign({}, row);

      // this.create.getdataListParmCust.parammaps.groupId = row.groupId
      // this.get_customer_list()

      // this.create.getdataListParm1.parammaps.customerId = row.customerId
      // this.getReceiverNameList()

      this.create.getdataListParm3.parammaps.customerId = row.customerId;
      this.getVisitNameList();
      this.create.getdataListParm4.parammaps.customerId = row.customerId;
      this.getTelvisitNameList();

      this.create.temp.id = row.id;

      this.create.temp.employeeId = Cookies.get("g_userId");
      this.create.temp.employeeName = Cookies.get("g_empname");

      this.create.dialogStatus = "update";
      this.create.dialogFormVisible = true;
    },

    // 编辑保存
    form_edit_save() {
      this.isokDisable = true;
      setTimeout(() => {
        this.isokDisable = false;
      }, 1000);
      this.$refs["temp"].validate((valid) => {
        if (valid) {
          this.isokDisable = true;
          setTimeout(() => {
            this.isokDisable = false;
          }, 1000);

          this.create.temp.createrId = Cookies.get("employeid");
          var send_data = {
            name: "updateRemote",
            parammaps: this.create.temp,
          };

          console.log("编辑保存发送参数", send_data);

          PostDataByName(send_data).then((response) => {
            if (response.msg !== "fail") {
              this.$notify({
                title: "成功",
                message: "保存成功",
                type: "success",
                duration: 2000,
              });
              this.create.dialogFormVisible = false;
              this.get_table_data();

              var send_weixin_data1 = {
                name: "getRemindData",
                parammaps: {
                  userId: Cookies.get("g_userId"),
                  remindId: 23,
                  remindTypeName: "远程服务",
                  rowId: this.create.temp.id,
                },
              };

              handleWechatPush(send_weixin_data1, 23).catch((error) => {
                console.error("微信推送失败:", error);
              });
            } else {
              this.$notify({
                title: "失败",
                message: "保存失败",
                type: "error",
                duration: 2000,
              });
            }
          });
        }
      });
    },

    // 删除
    form_delete(row) {
      MessageBox.confirm("是否确认删除此信息?", {
        confirmButtonText: "确认",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.selectList = [];
          this.requestParam.name = "delRemote";
          this.requestParam.parammaps = {};

          this.requestParam.parammaps.id = row.id;
          PostDataByName(this.requestParam).then((response) => {
            if (response.msg === "fail") {
              this.$notify({
                title: "删除失败",
                message: response.data,
                type: "warning",
                duration: 2000,
              });
            } else {
              this.$notify({
                title: "成功",
                message: "删除成功",
                type: "success",
                duration: 2000,
              });
              this.get_table_data();
            }
          });
        })
        .catch(() => {
          this.$message({ type: "info", message: "已取消删除" });
        });
    },

    // 完成
    form_complete(row) {
      console.log("点击了完成", row);
      this.reset_complete();

      this.complete.temp.id = row.id;
      this.complete.dialogFormVisible = true;
    },
    // 完成 - 重置
    reset_complete() {
      this.complete.temp.costStatus = "需要收款";
      this.complete.temp.remoteCost = "";
      this.complete.temp.id = "";
      this.complete.temp.payDate = "";
      this.complete.temp.remoteSummary = "";

      this.moneyShow = true;
    },

    // 完成 - 确认
    form_complete_save() {
      this.$refs["completetemp"].validate((valid) => {
        if (valid) {
          var send_data = {
            name: "completeRemote",
            parammaps: this.complete.temp,
          };

          var isCost = false;
          if (this.complete.temp.costStatus == "需要收款") {
            if (this.complete.temp.remoteCost == "") {
              isCost = true;
            } else {
              isCost = false;
            }
          } else {
            isCost = false;
          }

          if (isCost) {
            this.$notify({
              title: "失败",
              message: "需要收款时必须填写服务费用！",
              type: "error",
              duration: 2000,
            });
          } else {
            PostDataByName(send_data).then((response) => {
              console.log("完成发送参数", this.requestParam);
              if (response.msg !== "fail") {
                this.$notify({
                  title: "成功",
                  message: "完成成功",
                  type: "success",
                  duration: 2000,
                });
                this.complete.dialogFormVisible = false;
                this.create.dialogFormVisible = false;
                this.createSee.dialogFormVisible = false;
                this.get_table_data();

                var send_weixin_data1 = {
                  name: "getRemindData",
                  parammaps: {
                    userId: Cookies.get("g_userId"),
                    remindId: 27,
                    remindTypeName: "远程服务",
                    rowId: this.complete.temp.id,
                  },
                };

                handleWechatPush(send_weixin_data1, 27).catch((error) => {
                  console.error("微信推送失败:", error);
                });
              } else {
                this.$notify({
                  title: "失败",
                  message: "完成失败" + response.data,
                  type: "error",
                  duration: 2000,
                });
              }
            });
          }
        }
      });
    },

    // 完成 - 款项 - 下拉
    change_money_status(item) {
      console.log(item);

      if (item == "需要收款") {
        this.moneyShow = true;
      } else {
        this.moneyShow = false;
      }
    },

    // 撤销
    form_revoke(row) {
      console.log("点击了撤销", row);
      this.reset_revoke();

      this.revoke.temp.id = row.id;
      this.revoke.dialogFormVisible = true;
    },
    // 撤销 - 重置
    reset_revoke() {
      this.revoke.temp.revokeReason = "";
    },

    // 撤销 - 确认
    form_revoke_save() {
      this.$refs["revoketemp"].validate((valid) => {
        if (valid) {
          var send_data = {
            name: "revokeRemote",
            parammaps: this.revoke.temp,
          };

          this.$confirm("是否撤销该条记录?", "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
          })
            .then(() => {
              PostDataByName(send_data).then((response) => {
                console.log("撤销发送参数", send_data);
                if (response.msg !== "fail") {
                  this.$notify({
                    title: "成功",
                    message: "撤销成功",
                    type: "success",
                    duration: 2000,
                  });
                  this.revoke.dialogFormVisible = false;
                  this.get_table_data();

                  var send_weixin_data1 = {
                    name: "getRemindData",
                    parammaps: {
                      userId: Cookies.get("g_userId"),
                      remindId: 26,
                      remindTypeName: "远程服务",
                      rowId: this.revoke.temp.id,
                    },
                  };

                  handleWechatPush(send_weixin_data1, 26).catch((error) => {
                    console.error("微信推送失败:", error);
                  });
                } else {
                  this.$notify({
                    title: "失败",
                    message: "撤销失败" + response.data,
                    type: "error",
                    duration: 2000,
                  });
                }
              });
            })
            .catch(() => {
              this.$message({
                type: "info",
                message: "已取消删除",
              });
            });
        }
      });
    },

    dialog_complete_close() {
      this.complete.dialogFormVisible = false;
      this.get_table_data();
      if (this.isHome == "home") {
        // 返回首页
        this.$router.push({ name: "Dashboard", params: { isTodo: "remote" } });
      }
    },

    // 导出
    form_export(item) {
      this.download.getdataListParm.parammaps =
        this.tableObj.getdataListParm.parammaps;

      GetDataByName(this.download.getdataListParm).then((response) => {
        if (response.data.list !== null) {
          this.download.list = response.data.list;
        } else {
          this.download.list = [];
        }
        var excelDatas = [
          {
            tHeader: [
              "序号",
              "远程服务编号",
              "服务状态",
              "客户名称",
              "客户集团",
              "客户对接人",
              "款项状态",
              "服务费用",
              "支付时间",
              "收款时间",
              "服务开始时间",
              "服务完成时间",
              "服务内容",
              "技术人员",
              "备注",
              "拜访记录关联",
              "回访记录关联",
              "服务总结",
              "录入日期",
            ],
            filterVal: [
              "sort",
              "remoteCode",
              "statusName",
              "customerName",
              "groupName",
              "receiverName",
              "costStatus",
              "remoteCost",
              "payDate",
              "collectDate",
              "remoteBeginDate",
              "remoteEndDate",
              "content",
              "employeeName",
              "remark",
              "visitName",
              "telvisitName",
              "content",
              "createrDate",
            ],
            tableDatas: this.download.list,
            sheetName: "Sheet1",
          },
        ];
        json2excel(excelDatas, "远程服务", true, "xlsx");
      });
    },

    // 导入
    form_inport() {
      console.log("点击了导入");
    },
  },
};
</script>
<style lang="scss" scoped>
.search {
  padding-top: 10px;
  clear: both;
}
.table {
  margin-top: 10px;
}

/deep/ .el-input.is-disabled .el-input__inner {
  color: #000000 !important;
}
/deep/ .el-textarea.is-disabled .el-textarea__inner {
  color: #000000 !important;
}
/deep/ .el-radio__input.is-disabled + span.el-radio__label {
  color: #000000 !important;
}
/deep/ .el-checkbox__input.is-disabled + span.el-checkbox__label {
  color: #000000 !important;
}
</style>
