<template>
  <div class="index-container height-100">
    <fl-table :config="state.tableConfig"
              :refreshCount="state.tableConfig.refreshCount"
              @triggerRowActions="handleRowActions"
              @triggerActionUrlSuccess="handleActionUrlSuccess">
    </fl-table>
  </div>

  <a-modal v-model:visible="state.rejectVisible"
           title="请填写驳回理由"
           :confirm-loading="state.btnLoading"
           centered
           @ok="handleDialogConfirm">
    <div class="row">
      <div class="col-3 fl-my-sm">可选择项</div>
      <div class="col-9 fl-my-sm">
        <fl-form-item type="select"
                      field="remark"
                      multiple="multiple"
                      :val="state.rejectData.remark"
                      :config="{
            options: state.rejectOptions,
          }"
                      @triggerValChange="handleValChange" />
      </div>
      <div class="col-3 fl-my-sm">补充说明</div>
      <div class="col-9 fl-my-sm">
        <fl-form-item type="textarea"
                      :pageType="state.pageType"
                      field="remark2"
                      :rows="4"
                      :val="state.rejectData.remark2"
                      @triggerValChange="handleValChange" />
      </div>
    </div>
  </a-modal>
</template>
<script setup>
import {
  ref,
  reactive,
  onBeforeMount,
  onMounted,
  getCurrentInstance,
  watch,
  nextTick,
} from "vue";
import { useStore } from "vuex";
const store = useStore();
import flTable from "@/components/layout/table/commonTable.vue";
import flFormItem from "@/components/layout/form/formItem.vue";
import { getParamsByObj } from "@/utils/helper/form";

const currentInstance = getCurrentInstance();
const { $request } = currentInstance.appContext.config.globalProperties;
import { processError } from "@/utils/helper/message";

const state = reactive({
  clickData: {},

  rejectOptions: [
    {
      label: "*内容不足，需添加",
      value: "*内容不足，需添加",
    },
  ],
  rejectData: {
    remark: [],
    remark2: "",
  },
  rejectVisible: false,
  btnLoading: false,
  tableConfig: {
    rowKey: "id",
    refreshCount: 0,
    listUrl: {
      url: "api/backend/artshow/artistSupplement/getSupplementRecords",
      params: [],
    },
    // 画家姓名
    searchConfig: [
      {
        type: "text",
        label: "画家姓名",
        field: "artistName",
      },
    ],
    columns: [
      {
        label: "画家姓名",
        field: "artistShowCount",
      },
      {
        label: "画家编号",
        field: "tnum",
      },
      { type: "tooltip", label: "个人简介", field: "artistProfile" },
      { type: "tooltip", label: "参展/获奖信息", field: "honor" },
      {
        type: "select",
        label: "国家美术师级别",
        field: "countryArtLevel",
        options: [
          {
            label: "国家一级美术师",
            value: 2,
          },
          {
            label: "国家二级美术师",
            value: 3,
          },
          {
            label: "无",
            value: 1,
          },
        ],
      },
      {
        type: "image",
        label: "国家美术师证书",
        field: "artistCertPic",
      },
      {
        label: "开户行",
        field: "bankName",
      },
      {
        label: "开户行账号",
        field: "bankNum",
      },
      {
        label: "数据创建时间",
        field: "createdAt",
      },
    ],
  },
});
onBeforeMount(() => { });

onMounted(() => { });

const handleRowActions = (btnConfig, rowData) => {
  if (btnConfig.actionType === "reject") {
    handleReject(rowData);
  }
};
const handleReject = (rowData) => {
  state.rejectData = {
    remark: [],
    remark2: "",
  };
  state.clickData = rowData;
  state.rejectVisible = true;
};
const handleValChange = (val, field) => {
  state.rejectData[field] = val;
};
const handleActionUrlSuccess = () => {
  getArtistappNum();
};
const handleDialogConfirm = () => {
  if (
    state.rejectData.remark.length === 0 &&
    state.rejectData.remark2.length === 0
  ) {
    processError("请选择或填写理由！");
    return;
  }
  let url = "api/backend/artshow/artistSupplement/auditSupplement";
  let params = getParamsByObj(
    {},
    [
      { type: "Array", label: "artistSupplementIds", field: "id" },
      {
        label: "auditStatus",
        value: 3,
      },
    ],
    state.clickData
  );
  params.auditMark1 = state.rejectData.remark.join(",");
  params.auditMark2 = state.rejectData.remark2;
  state.btnLoading = true;
  $request.HTTP.components.postDataByParams(url, params).then(
    (res) => {
      if (res.status === 0) {
        state.rejectVisible = false;
        state.tableConfig.refreshCount++;
        getArtistappNum();
      } else {
        processError(res.msg);
      }
      state.btnLoading = false;
    },
    (err) => {
      state.btnLoading = false;
      processError(err.response.data.msg);
    }
  );
};
const getArtistappNum = () => {
  let url = "api/artshow/UnfinishedAuditStatistics";
  let params = {};
  $request.HTTP.components.postDataByParams(url, params).then(
    (res) => {
      if (res.status === 0) {
        store.commit("GET_ARTISTAPP_NUM", { artistappNum: res.data });
      } else {
        processError(res.msg);
      }
    },
    (err) => {
      state.btnLoading = false;
      processError(err.response.data.msg);
    }
  );
};
</script>
<style scoped></style>
