<template>
  <div class="app-container">
    <el-form
      :model="queryParams"
      ref="queryForm"
      size="small"
      :inline="true"
      v-show="showSearch"
      label-width="100px"
    >
      <el-form-item label="客户名称" prop="customerName">
        <el-input
          placeholder="请输入客户名称"
          v-model="queryParams.customerName"
        >
        </el-input>
      </el-form-item>
      <el-form-item label="状态" prop="invoiceStatus">
        <el-select
          v-model="queryParams.invoiceStatus"
          placeholder="请选择投放类型"
          clearable
          style="width: 240px"
          disabled
        >
          <el-option
            v-for="item in queryParamsList.accountStatusList"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item>

      <el-form-item>
        <el-button
          type="primary"
          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"
          plain
          icon="el-icon-document-add"
          size="mini"
          @click="handleAllocation"
          >新增客户</el-button
        >
      </el-col>
    </el-row>
    <el-table
      v-loading="loading"
      :data="typeList"
      @selection-change="handleSelectionChange"
      ref="multipleTable"
    >
      <el-table-column label="客户名称" align="center" prop="customerName">
      </el-table-column>
      <el-table-column label="快手ID" align="center" prop="ksId">
      </el-table-column>
      <el-table-column label="销售" align="center" prop="saleLeader">
      </el-table-column>
      <el-table-column label="联系方式" align="center" prop="phone" />
      <el-table-column label="发票信息" align="center" prop="invoiceStatus">
        <template slot-scope="scope">
          <span
            v-if="scope.row.invoiceStatus == 1"
            style="color: rgb(24, 144, 255)"
          >
            已上传
          </span>
          <span v-else style="color: rgb(217, 0, 19)">未上传</span>
        </template>
      </el-table-column>
      <el-table-column label="类型" align="center" prop="launchType">
        <template slot-scope="scope">
          {{ scope.row.launchType | accountTypeChinese }}
        </template>
      </el-table-column>
      <!-- <el-table-column label="状态" align="center" prop="invoiceStatus">
      </el-table-column> -->
      <el-table-column
        label="操作"
        align="center"
        class-name="small-padding fixed-width"
      >
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            @click="handleAllocationOne(scope.row)"
            >编辑</el-button
          >
          <el-button size="mini" type="text" @click="handleAdd(scope.row)"
            >新增账户</el-button
          >

          <el-button
            size="mini"
            type="text"
            @click="handlePersonVisible(scope.row)"
            >上传发票信息</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"
    />

    <!-- 添加或修改参数配置对话框 -->
    <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
      <el-form
        ref="form"
        :model="form"
        :rules="rules"
        label-width="100px"
        :inline="true"
      >
        <el-form-item
          label="账户类型"
          prop="accountType"
          style="width: 100%"
          class="entire-line"
        >
          <el-select
            v-model="form.accountType"
            placeholder="选择账户类型"
            clearable
            style="width: 240px"
            :disabled="edit"
          >
            <el-option
              v-for="(item, index) in queryParamsList.accountTypeList"
              :key="index"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
        <el-form-item
          label="快手昵称"
          prop="ksName"
          style="width: 100%"
          class="entire-line"
        >
          <el-input
            placeholder="请输入快手昵称"
            v-model="form.ksName"
            :disabled="edit"
          >
          </el-input>
          <!-- <el-select
            v-model="form.salesLeadsType"
            placeholder="选择类别"
            clearable
            style="width: 240px"
          >
            <el-option
              v-for="item in formList.salesLeadsTypeList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select> -->
        </el-form-item>
        <el-form-item label="快手ID" prop="ksId" class="entire-line">
          <el-input placeholder="请输入快手ID" v-model="form.ksId" disabled>
          </el-input>
        </el-form-item>
        <el-form-item label="账户名称" prop="accountName" class="entire-line">
          <el-input
            placeholder="请输入账户名称"
            v-model="form.accountName"
            :disabled="edit"
          >
          </el-input>
        </el-form-item>
        <el-form-item
          label="账户ID"
          :prop="form.accountType == 'cp' ? 'accountIdFalse' : 'accountId'"
          class="entire-line"
        >
          <el-input
            placeholder="请输入账户ID"
            v-model="form.accountId"
            :disabled="edit"
          >
          </el-input>
        </el-form-item>

        <!-- <el-form-item label="投放类型" prop="putType">
          <el-select
            v-model="form.putType"
            placeholder="请选择投放类型"
            clearable
            multiple
            style="width: 240px"
          >
            <el-option
              v-for="item in queryParamsList.putTypeList"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item> -->
        <el-form-item label="运营负责人" prop="operatorLeaderId">
          <el-select
            v-model="form.operatorLeaderId"
            placeholder="请选择运营"
            clearable
            value-key="value"
            style="width: 240px"
          >
            <el-option
              v-for="item in queryParamsList.operatorLeaderList"
              :key="item.value"
              :label="item.label"
              :value="item"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="销售负责人" prop="saleLeaderId">
          <el-select
            v-model="form.saleLeaderId"
            placeholder="请选择销售"
            clearable
            value-key="value"
            style="width: 240px"
          >
            <el-option
              v-for="item in queryParamsList.saleLeaderList"
              :key="item.value"
              :label="item.label"
              :value="item"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="设计负责人" prop="designerLeaderId">
          <el-select
            v-model="form.designerLeaderId"
            placeholder="请选择设计负责人"
            clearable
            value-key="value"
            style="width: 240px"
          >
            <el-option
              v-for="item in queryParamsList.designerLeaderList"
              :key="item.value"
              :label="item.label"
              :value="item"
            />
          </el-select>
        </el-form-item>
        <el-form-item label="协作人" prop="collaboratorList">
          <el-select
            v-model="form.collaboratorList"
            placeholder="请选择协作人"
            clearable
            multiple
            value-key="value"
            style="width: 240px"
          >
            <el-option
              v-for="item in queryParamsList.allPersonList"
              :key="item.value"
              :label="item.label"
              :value="item"
            />
          </el-select>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm" :loading="confirmLoading"
          >确 定</el-button
        >
        <el-button @click="cancel">取 消</el-button>
      </div>
    </el-dialog>

    <!-- 添加直播 -->
    <el-dialog
      title="上传发票信息"
      :visible.sync="openAllocation"
      width="800px"
      append-to-body
    >
      <el-form
        ref="formBroadcast"
        :model="formBroadcast"
        :rules="rulesBroadcast"
        label-width="100px"
        :inline="true"
      >
        <el-form-item
          label="资质主体"
          prop="mainBodyName"
          style="width: 100%"
          class="entire-line"
        >
          <el-input
            placeholder="请输入资质主体"
            v-model="formBroadcast.mainBodyName"
            style="width: 450px"
          >
          </el-input>
        </el-form-item>

        <el-form-item label="上传资质" prop="type" class="entire-line">
          <el-radio-group v-model="formBroadcast.type">
            <el-radio-button label="1">专票</el-radio-button>
            <el-radio-button label="2">普票</el-radio-button>
          </el-radio-group>
        </el-form-item>
        <el-form-item
          label="开户许可证链接"
          prop="permitUrl"
          class="entire-line"
          v-if="formBroadcast.type == '1'"
        >
          <vueUpload ref="permitUrl" :multiple="false"></vueUpload>
        </el-form-item>
        <el-form-item
          label="纳税人证明链接"
          prop="taxpayerUrl"
          class="entire-line"
          v-if="formBroadcast.type == '1'"
        >
          <vueUpload ref="taxpayerUrl" :multiple="false"></vueUpload>
        </el-form-item>
        <el-form-item
          label="开户银行"
          prop="bank"
          style="width: 100%"
          class="entire-line"
        >
          <el-input
            placeholder="请输入开户银行"
            v-model="formBroadcast.bank"
            style="width: 450px"
          >
          </el-input>
        </el-form-item>
        <el-form-item
          label="银行账号"
          prop="bankCode"
          style="width: 100%"
          class="entire-line"
        >
          <el-input
            placeholder="请输入银行账号"
            v-model="formBroadcast.bankCode"
            style="width: 450px"
          >
          </el-input>
        </el-form-item>
        <el-form-item
          label="纳税人识别号"
          prop="taxpayerIdentificationNumber"
          style="width: 100%"
          class="entire-line"
        >
          <el-input
            placeholder="请输入纳税人识别号"
            v-model="formBroadcast.taxpayerIdentificationNumber"
            style="width: 450px"
          >
          </el-input>
        </el-form-item>
        <el-form-item
          label="地址"
          prop="address"
          style="width: 100%"
          class="entire-line"
        >
          <el-input
            placeholder="请输入地址"
            v-model="formBroadcast.address"
            style="width: 450px"
          >
          </el-input>
        </el-form-item>
        <el-form-item
          label="电话"
          prop="phone"
          style="width: 100%"
          class="entire-line"
        >
          <el-input
            placeholder="请输入电话"
            v-model="formBroadcast.phone"
            style="width: 450px"
          >
          </el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button
          type="primary"
          @click="submitFormBroadcast"
          :loading="confirmLoading"
          >确 定</el-button
        >
        <el-button
          @click="
            confirmLoading = false;
            openAllocation = false;
            reset();
          "
          >取 消</el-button
        >
      </div>
    </el-dialog>

    <!-- 上传账户 -->
    <el-dialog
      title="上传账户"
      :visible.sync="openFp"
      width="800px"
      append-to-body
    >
      <el-form ref="formFp" :model="formFp" label-width="100px">
        <el-form-item label="账户上传">
          <file-upload
            ref="fileUploadDialog"
            v-if="openFp"
            :count="1"
          ></file-upload>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button
          type="primary"
          @click="submitFormFp"
          :loading="confirmLoading"
          >确 定</el-button
        >
        <el-button
          @click="
            openFp = false;
            confirmLoading = false;
          "
          >取 消</el-button
        >
      </div>
    </el-dialog>

    <!-- 查看人员 -->
    <el-dialog
      title="查看人员"
      :visible.sync="personVisible"
      width="800px"
      append-to-body
      @close="
        personVisible = false;
        personList = [];
        resetQuery();
      "
    >
      <el-tag
        v-for="tag in personList"
        :key="tag.userId"
        closable
        style="margin-right: 10px"
        @close="deletePerson(tag)"
      >
        {{ tag.name }}{{ " | " + tag.roleName }}
      </el-tag>
    </el-dialog>
  </div>
</template>

<script>
import { refreshCache } from "@/api/system/dict/type";
import vueUpload from "../trader/components/vueUpload";
import FileUpload from "../trader/components/upload";
import {
  getQueryRolesList,
  getQueryNicknameList,
  getQueryAccountList,
  addAccount,
  getById,
  editAccount,
  addBroadcast,
  replayAccount,
  getPersonList,
  deletePerson,
  getCustomerList,
  customerUpload,
} from "@/api/trader/trader";
export default {
  name: "account-list",
  components: {
    vueUpload,
    FileUpload,
  },
  data() {
    return {
      // 遮罩层
      loading: true,
      ksInfo: undefined,
      // 选中数组
      ids: null,
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 字典表格数据
      typeList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 是否为编辑
      edit: false,
      // 分配销售
      openAllocation: false,
      // 选择的销售id
      saleId: undefined,
      // 销售列表
      saleList: [],
      // 分配销售确定loading
      confirmLoadingSale: false,
      openFp: false,
      personVisible: false,
      personData: null,
      personList: [],
      formFp: {},
      fileType: [".xls", ".xlsx", ".csv"],
      // 日期范围
      dateRange: [],
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        invoiceStatus: undefined,
        customerName: undefined,
      },
      //页面所有的下拉数据
      queryParamsList: {
        ksList: [], //快手昵称下拉
        accountList: [], //账户列表下拉
        accountTypeList: [
          { value: "cljn", label: "磁力金牛" },
          { value: "cljnydd", label: "磁力金牛移动端" },
          { value: "cp", label: "操盘" },
          { value: "xxl", label: "信息流" },
        ], //账户类型下拉
        accountStatusList: [
          { value: "0", label: "未开户" },
          { value: "1", label: "已开户" },
        ],
        putTypeList: [
          { value: "cljn", label: "磁力金牛" },
          { value: "cp", label: "操盘" },
          { value: "fws", label: "服务商" },
        ], //投放类型下拉
        saleLeaderList: [], //销售列表
        operatorLeaderList: [], //运营列表
        designerLeaderList: [], //设计列表
        allPersonList: [], //所有人
        liveLevelList: [
          { value: "S", label: "S" },
          { value: "A", label: "A" },
          { value: "B", label: "B" },
        ], // 直播间级别
      },
      // 表单参数
      form: {},
      formBroadcast: {
        type: "1",
      },
      //上传报表下拉数据
      formList: {
        salesLeadsTypeList: [
          { value: 1, label: "50W低潜" },
          { value: 2, label: "50W中高潜" },
          { value: 3, label: "200W高潜" },
          { value: 4, label: "200W~500W" },
          { value: 5, label: "500W以上" },
        ], //销售线索类型
      },
      fileList: [],
      //获取销售线索文件流
      dateFile: null,
      //销售线索上传loading
      confirmLoading: false,
      // 表单校验
      rules: {
        ksName: [
          { required: true, message: "快手昵称不能为空", trigger: "blur" },
          {
            min: 3,
            max: 50,
            message: "快手昵称最多50个字,最少3个字",
            trigger: "blur",
          },
        ],
        ksId: [
          { required: true, message: "快手ID不能为空", trigger: "blur" },
          {
            type: "number",
            message: "快手ID只能输入数字",
            trigger: "change",
            transform(value) {
              return +value;
            },
          },
        ],
        accountName: [
          { required: true, message: "快手账户不能为空", trigger: "blur" },
          {
            min: 3,
            max: 50,
            message: "快手账户最多50个字,最少3个字",
            trigger: "blur",
          },
        ],
        accountId: [
          {
            required: true,
            message: "快手账户ID不能为空",
            trigger: "blur",
          },
          {
            required: false,
            type: "number",
            message: "快手账户ID只能输入数字",
            trigger: "change",
            transform(value) {
              if (!!value) {
                return +value;
              } else {
                return undefined;
              }
            },
          },
        ],
        accountIdFalse: [
          {
            required: false,
            message: "快手账户ID不能为空",
            trigger: "blur",
          },
          {
            required: false,
            type: "number",
            message: "快手账户ID只能输入数字",
            trigger: "change",
            transform(value) {
              if (!!value) {
                return +value;
              } else {
                return undefined;
              }
            },
          },
        ],
        accountType: [
          { required: true, message: "账户类型必选", trigger: "change" },
        ],
        putType: [
          { required: true, message: "投放类型必选", trigger: "change" },
        ],
        saleLeaderId: [
          { required: true, message: "销售负责人必选", trigger: "change" },
        ],
        operatorLeaderId: [
          { required: true, message: "运营负责人必选", trigger: "change" },
        ],
      },
      rulesBroadcast: {
        mainBodyName: [
          {
            required: true,
            message: "资质主体必填",
            trigger: "blur",
          },
          {
            min: 5,
            max: 100,
            message: "资质主体最少输入5个字符",
            trigger: "change",
          },
        ],
        type: [
          {
            required: true,
            message: "资质必选",
            trigger: "change",
          },
        ],
        bank: [
          {
            required: true,
            message: "开户银行必填",
            trigger: "blur",
          },
          {
            min: 5,
            max: 100,
            message: "开户银行最少输入5个字符",
            trigger: "change",
          },
        ],
        bankCode: [
          {
            required: true,
            message: "开户银行账户必填",
            trigger: "blur",
          },
          {
            min: 5,
            max: 100,
            message: "开户银行最少输入5个字符",
            trigger: "change",
          },
        ],
        taxpayerIdentificationNumber: [
          {
            required: true,
            message: "纳税人识别号必填",
            trigger: "blur",
          },
          {
            min: 5,
            max: 100,
            message: "纳税人识别号最少输入5个字符",
            trigger: "change",
          },
        ],
      },
      // 分配销售展示列表
      userId: null,
    };
  },
  created() {
    this.userId = this.$store.getters.userId;
    this.getSaleList();
    this.getOperatorList();
    this.getQueryNicknameList();
    this.getList();
  },
  filters: {
    accountTypeChinese(status) {
      const statusMap = {
        cljn: "磁力金牛",
        cljnydd: "磁力金牛移动端",
        cp: "操盘",
        xxl: "信息流",
      };
      return statusMap[status];
    },
    putTypeChinese(status) {
      const statusMap = {
        cljn: "磁力金牛",
        cp: "操盘",
        fws: "服务商",
        xxl: "信息流",
      };
      return statusMap[status];
    },
  },
  methods: {
    // 获取销售
    getSaleList() {
      getQueryRolesList({ type: 2 })
        .then((res) => {
          this.queryParamsList.saleLeaderList = res.data.map((item) => {
            return {
              value: item.userId,
              label: item.nickName,
            };
          });
        })
        .catch((error) => {});

      getQueryRolesList({ type: 3 })
        .then((res) => {
          this.queryParamsList.designerLeaderList = res.data.map((item) => {
            return {
              value: item.userId,
              label: item.nickName,
            };
          });
        })
        .catch((error) => {});

      getQueryRolesList({ type: null })
        .then((res) => {
          this.queryParamsList.allPersonList = res.data.map((item) => {
            return {
              value: item.userId,
              label: item.nickName,
            };
          });
        })
        .catch((error) => {});
    },
    // 获取运营列表
    getOperatorList() {
      getQueryRolesList({ type: 1 })
        .then((res) => {
          this.queryParamsList.operatorLeaderList = res.data.map((item) => {
            return {
              value: item.userId,
              label: item.nickName,
            };
          });
        })
        .catch((error) => {});
    },
    // 获取快手昵称列表
    getQueryNicknameList() {
      getQueryNicknameList()
        .then((res) => {
          this.queryParamsList.ksList = res.rows.map((item) => {
            return {
              value: item.ksId,
              label: item.ksName,
            };
          });
        })
        .catch((error) => {});
    },
    // 获取快手账户列表
    getQueryAccountList(ksId) {
      this.queryParams.accountId = undefined;
      if (!!ksId) {
        getQueryAccountList({ ksId })
          .then((res) => {
            this.queryParamsList.accountList = res.rows.map((item) => {
              return {
                value: item.accountId,
                label: item.accountName,
              };
            });
          })
          .catch((error) => {});
      } else {
        this.queryParamsList.accountList = [];
      }
    },
    handleExceed(files, fileList) {
      this.$message.warning(
        `当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${
          files.length + fileList.length
        } 个文件`
      );
    },
    beforeRemove(file, fileList) {
      return false;
    },
    /** 删除文件 */
    handleRemove(file, fileList) {
      console.log(file, fileList);
    },
    /** 上传文件 */
    handlePreview(file) {
      console.log(file);
    },
    /** 上传文件前验证 */
    handleBeforeUpload(file) {
      console.log(file);
      const fileSuffix = ["xlsx", "xls", "csv"];
      const fileName = file.name;
      const fileStrArr = fileName.split(".");
      const suffix = fileStrArr[fileStrArr.length - 1];

      let result = fileSuffix.some((item) => {
        return item === suffix;
      });

      if (!result) {
        this.$message.error("不支持该文件类型");
        this.loadDisabled = false;
        return false;
      }
      this.dateFile = file;
      return false;
    },
    /** 查询字典类型列表 */
    getList() {
      this.loading = true;
      getCustomerList({ ...this.queryParams, userId: this.userId }).then(
        (response) => {
          this.typeList = response.rows;
          this.total = response.total;
          this.loading = false;
        }
      );
    },
    // 取消按钮
    cancel() {
      this.open = false;
      this.confirmLoading = false;
      this.reset();
    },
    // 表单重置
    reset() {
      this.form = {};
      this.formBroadcast = { type: "1" };
      this.dateFile = null;
      this.resetForm("form");
      this.resetForm("formBroadcast");
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.dateRange = [];
      this.queryParams.uploadDate = undefined;
      this.resetForm("queryForm");
      this.handleQuery();
    },
    /** 新增按钮操作 */
    handleAdd(item) {
      this.reset();
      this.ids = null;
      this.open = true;
      this.edit = false;
      this.title = "新增账户";
      this.$set(this.form, "ksId", item.ksId);
      this.$set(this.form, "ksName", item.ksName);
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.sellerId);
    },
    /** 编辑 */
    handleAllocationOne(item) {
      this.$router.replace({
        path: "/account/create",
        query: { id: item.ksId },
      });
    },
    handleAllocation() {
      this.$router.replace({ path: "/account/create" });
    },
    /** 上传发票信息 */
    handlePersonVisible(item) {
      this.openAllocation = true;
      this.ksInfo = item.ksId;
    },
    deletePerson(item) {
      var params = {};
      params.ksId = +this.personData.ksId;
      params.accountId = this.personData.accountId
        ? +this.personData.accountId
        : null;
      params.role = item.role;
      params.userId = item.userId;
      deletePerson(params)
        .then((res) => {
          this.getPersonList();
        })
        .catch((error) => {});
    },
    getPersonList() {
      // getPersonList, deletePerson;
      var params = {};
      params.ksId = +this.personData.ksId;
      params.accountId = this.personData.accountId
        ? +this.personData.accountId
        : null;
      getPersonList(params)
        .then((res) => {
          this.personList = res.data;
        })
        .catch((error) => {});
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.reset();
    },
    // 失去焦点金额格式化
    inputMoney(el) {
      let temp = Number(el.target.value) || null;
      this.formBroadcast.goalGmv = this.priceFormat(temp);
    },
    // 获得焦点金额去掉格式
    uninputMoney(el) {
      if (!!el.target.value) {
        this.formBroadcast.goalGmv = this.delcommafy(el.target.value);
      }
    },
    priceFormat(num, n) {
      n = n || 2;
      let symbol = ",";
      if (num === null) return num;
      if (typeof num !== "number")
        throw new TypeError("num参数应该是一个number类型");
      if (n < 0) throw new Error("参数n不应该小于0");
      let hasDot = parseInt(num) != num; //这里检测num是否为小数，true表示小数
      let m = n != undefined && n != null ? n : 1;
      num =
        m == 0
          ? num.toFixed(m) + "."
          : hasDot
          ? n
            ? num.toFixed(n)
            : num
          : num.toFixed(m);
      symbol = symbol || ",";
      num = num
        .toString()
        .replace(/(\d)(?=(\d{3})+\.)/g, function (match, p1, p2) {
          return p1 + symbol;
        });
      if (n == 0 || (!hasDot && !n)) {
        //如果n为0或者传入的num是整数并且没有指定整数的保留位数，则去掉前面操作中的小数位
        num = num.substring(0, num.indexOf("."));
      }
      return num;
    },
    //去除千分位中的‘，’
    delcommafy(num) {
      if (!num) return num;
      num = num.toString();
      num = num.replace(/,/gi, "");
      if (num.indexOf(".00") > 0) num = parseInt(num);
      return num;
    },
    submitFormFp() {
      this.$refs["formFp"].validate((valid) => {
        if (valid) {
          var fileList = this.$refs.fileUploadDialog.fileList;
          if (fileList.length == 0) {
            this.$message.error("请上传文件");
            return;
          } else {
            this.confirmLoading = true;
            let formData = new FormData();
            fileList.forEach((file) => formData.append("file", file.raw));
            formData.append("createrId", this.userId);
            replayAccount(formData)
              .then((res) => {
                this.confirmLoading = false;
                this.$message.success("上传成功");
                this.openFp = false;
                this.ids = null;
                this.cancel();
                this.handleQuery();
              })
              .catch((err) => {
                this.confirmLoading = false;
              });
          }
          console.log(fileList, dapanUrls);
        }
      });
    },

    /** 新增直播确定按钮 */
    submitFormBroadcast: function () {
      this.$refs["formBroadcast"].validate((valid) => {
        if (valid) {
          let params = { ...this.formBroadcast };
          var permitUrl = this.$refs.permitUrl.fileList;
          var taxpayerUrl = this.$refs.taxpayerUrl.fileList;

          if (this.formBroadcast.type == "1") {
            if (permitUrl.length == 0 || taxpayerUrl.length == 0) {
              this.$message.error("专票的开户许可证和纳税人证明必须上传");
              return;
            } else {
              params.permitUrl = permitUrl[0].url;
              params.taxpayerUrl = taxpayerUrl[0].url;
            }
          }
          this.confirmLoading = true;

          params.createrId = this.userId;
          params.ksId = this.ksInfo;

          customerUpload(params)
            .then((res) => {
              this.confirmLoading = false;
              this.$message.success("新增成功");
              this.openAllocation = false;
              this.cancel();
              this.handleQuery();
            })
            .catch((err) => {
              this.confirmLoading = false;
            });
        }
      });
    },
    /** 提交按钮 */
    submitForm: function () {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          console.log(this.form);
          this.confirmLoading = true;
          let formData = {};
          formData.createrId = this.userId;
          formData.ksId = this.form.ksId;
          formData.ksName = this.form.ksName;
          formData.accountId = this.form.accountId;
          formData.accountName = this.form.accountName;
          formData.accountType = this.form.accountType;
          // formData.putType = this.form.putType.join();
          formData.designerLeaderId = !!this.form.designerLeaderId
            ? this.form.designerLeaderId.value
            : "";
          formData.designerLeader = !!this.form.designerLeaderId
            ? this.form.designerLeaderId.label
            : "";
          formData.operatorLeaderId = this.form.operatorLeaderId.value;
          formData.operatorLeader = this.form.operatorLeaderId.label;
          formData.saleLeaderId = this.form.saleLeaderId.value;
          formData.saleLeader = this.form.saleLeaderId.label;
          formData.collaboratorList = !!this.form.collaboratorList
            ? JSON.stringify(
                this.form.collaboratorList.map((item) => {
                  return {
                    userId: item.value,
                    nickName: item.label,
                  };
                })
              )
            : "[]";
          if (!this.ids) {
            addAccount(formData)
              .then((res) => {
                this.confirmLoading = false;
                this.$message.success("新增成功");
                this.ids = null;
                this.cancel();
                this.handleQuery();
              })
              .catch((err) => {
                this.confirmLoading = false;
              });
          } else {
            formData.id = this.ids;
            editAccount(formData)
              .then((res) => {
                this.confirmLoading = false;
                this.$message.success("修改成功");
                this.ids = null;
                this.cancel();
                this.handleQuery();
              })
              .catch((err) => {
                this.confirmLoading = false;
              });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {},
    /** 导出按钮操作 */
    handleExport() {
      this.download(
        "system/dict/type/export",
        {
          ...this.queryParams,
        },
        `type_${new Date().getTime()}.xlsx`
      );
    },
    /** 刷新缓存按钮操作 */
    handleRefreshCache() {
      refreshCache().then(() => {
        this.$modal.msgSuccess("刷新成功");
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.entire-line {
  width: 100%;
  ::v-deep .el-form-item__content {
    width: 60%;
  }
}
::v-deep .el-form-item__label {
  white-space: nowrap;
}
</style>
