<template>
  <div class="white_bg burt-container">
    <div class="title-div">保险公司信息</div>
    <a-table
      :columns="columns"
      :data-source="dataList"
      :scroll="{ x: 'max-content' }"
      :pagination="false"
    >
      <div
        v-for="col in columns"
        :slot="col.dataIndex"
        slot-scope="text, record, index"
        :key="col.dataIndex"
      >
        <template v-if="col.dataIndex == 'operation'">
          <a-button type="link" @click.stop="editEvt(record, index)">{{
            record.edit ? "保存" : "修改"
          }}</a-button>
          <a-button type="link" class="success">新增</a-button>
          <a-button type="link" class="danger" @click.stop="delRecord(index)"
            >删除</a-button
          >
        </template>
        <template v-else>
          <a-input
            v-if="record.edit"
            placeholder="请输入"
            v-model="record[col.dataIndex]"
          />
          <span v-else>{{ text }}</span>
        </template>
      </div>
    </a-table>
    <!--分页-->
    <BurtPagination :pagination="pagination" @pageChange="getData" />
  </div>
</template>

<script>
import BurtPagination from "@/components/CUSTOMER/pagation";
const columns = [
  {
    title: "序号",
    dataIndex: "id",
    width: 120,
  },
  {
    title: "保险公司名称",
    dataIndex: "longName",
    ellipsis: true,
    scopedSlots: { customRender: "longName" },
    width: 130,
  },
  {
    title: "医生英文名",
    dataIndex: "englishName",
    ellipsis: true,
    scopedSlots: { customRender: "englishName" },
    width: 105,
  },
  {
    title: "联系电话",
    dataIndex: "contactPhone",
    ellipsis: true,
    width: 125,
  },
  {
    title: "联系地址",
    dataIndex: "address",
    ellipsis: true,
    scopedSlots: { customRender: "address" },
    width: 180,
  },
  {
    title: "Protal链接",
    dataIndex: "portalUrl",
    ellipsis: true,
    scopedSlots: { customRender: "portalUrl" },
    width: 155,
  },
  {
    title: "联系人",
    dataIndex: "contactPerson",
    ellipsis: true,
    scopedSlots: { customRender: "contactPerson" },
    width: 100,
  },
  {
    title: "操作",
    dataIndex: "operation",
    scopedSlots: { customRender: "operation" },
    fixed: "right",
    width: "170px",
  },
];
export default {
  data() {
    return {
      columns,
      pagination: {
        pageNum: 1,
        pageSize: 10,
        total: 0,
      },
      dataList: [],
    };
  },
  components: {
    BurtPagination,
  },
  created() {
    this.getData();
  },
  methods: {
    //获取列表
    getData() {
      this.$apis
        .PAYORLIST({
          pageNum: this.pagination.pageNum,
          pageSize: this.pagination.pageSize,
        })
        .then((res) => {
          if (res.returnCode == "0000") {
            let content = res.content || {};
            this.pagination.total = content.total || 0;
            this.dataList = (content.list || []).map((item) => {
              return {
                ...item,
                edit: false,
              };
            });
          } else {
            this.$message.error(res.returnMsg);
          }
        });
    },
    //编辑
    editEvt(record, index) {
      this.dataList.forEach((item, i) => {
        if (index != i) {
          item.edit = false;
        }
      });
      record.edit = !record.edit;
      //保存
      if (!record.edit) {
        this.$apis.PAYORUPDATE(record).then((res) => {
          if (res.returnCode == "0000") {
            this.$message.success("编辑成功");
          } else {
            this.$message.error(res.returnMsg);
          }
        });
      }
    },
    //删除
    delRecord(index) {
      this.$modal.confirm({
        title: "删除",
        content: "确定删除该条记录？",
        okText: "确定",
        cancelText: "取消",
        onOk: () => {
          this.$apis
            .PAYORDELETE({
              id: this.dataList[index].id,
            })
            .then((res) => {
              if (res.returnCode == "0000") {
                this.$message.success("删除成功");
                this.dataList.splice(index, 1);
              } else {
                this.$message.error(res.returnMsg);
              }
            });
        },
      });
    },
  },
};
</script>

<style lang="less" scoped>
.title-div {
  line-height: 52px;
  color: #252631;
  font-weight: bold;
}
</style>
