<template>
  <div class="app-container">
    <card-table :modal-data="tableData" :searchParams="queryParams" @pagination="getList" :loading="loading"
                :tableSearch="true" @columnSearch="handleQuery" @resetList="resetQuery">
      <template #operations="{selections}">
        <Row :gutter="20">
          <el-col :span="1.5">
            <CustomButton label="relatedCase.addMenu" @handleClick="toAdd"/>
<!--            <CustomButton label="DEBUGGER QUERY" @handleClick="query111"/>-->
          </el-col>
        </Row>
      </template>

      <Column type="index" label="No"/>
      <!--      规则名称-->
      <Column :label="$t('relatedCase.caseName')" prop="caseName" :searchParams="queryParams" :showSearch="true"/>
      <Column :label="$t('relatedCase.conditionContent')" prop="logicStr"/>
      <Column :label="$t('relatedCase.resultContent')" prop="actionStr"/>
      <Column :label="$t('validation.status')" prop="status" :min-width="80">
        <template #default="{row}">
          <el-switch v-model="row.status" :active-value="'0'" :inactive-value="'1'"
                     @change="val=> handleRowStatus(val,row)"/>
        </template>
      </Column>
      <Column :label="$t('validation.relationElevatorNum')" prop="elevatorCount"/>
      <Column :label="$t('common.operate')" :showSearch="true" search-type="operate">
        <template #default="{row}">
          <CustomLink label="common.view" @handleClick="toView(row)"/>
          <CustomLink label="validation.seeElevator" @handleClick="toViewElevator(row)"/>
          <CustomLink label="common.edit" @handleClick="toEdit(row)"/>
          <CustomLink label="common.delete" @handleClick="deleteRow(row)"/>
        </template>
      </Column>

    </card-table>


    <Dialog ref="seeElevator" :title="$t('validation.seeElevator')" @close="dialogParams={  pageNum: 1,
        pageSize: 10,},dialogModalData=[]">
      <CardTable :modal-data="dialogModalData" :searchParams="dialogParams" @pagination="getDialogList"
                 :loading="dialogModalLoading">
        <Column type="index" label="No"/>
        <Column :label="$t('elevatorModel.areaName')" prop="areaName"/>
        <Column label="区域（英）" prop="areaNameES"/>
        <Column label="区域（俄）" prop="areaNameRU"/>
        <Column label="区域（西）" prop="areaNameUS"/>
        <Column :label="$t('elevatorModel.elevatorModel')" prop="elevatorModel"/>
      </CardTable>
    </Dialog>

  </div>
</template>

<script>

import Row from "../../../components/CustomElement/layout/Row.vue";
import CustomLink from "../../../components/CustomElement/CustomLink.vue";
import Column from "../../../components/element/table/Column.vue";
import CardTable from "../../../components/element/table/CardTable.vue";
import CustomButton from "../../../components/CustomElement/CustomButton.vue";
import {getRelationByIdValidation, listValidation} from "../../../api/business/crm/paraValidation/paraValidation";
import {
  changeStatusCase, deleteCase, getInfoByTpElevatorModelId,
  getRelationByIdCase,
  getTableListCase
} from "../../../api/business/crm/paraRelatedCase/relatedCase";

export default {
  name:"ParamRelatedCase",
  components: {CustomButton, CardTable, Column, CustomLink, Row},
  data() {
    return {
      tableData: [],
      queryParams: {
        pageNum: 1,
        pageSize: 10,
      },
      loading: false,
      dialogModalData: [],
      dialogModalLoading: false,
      dialogParams: {
        pageNum: 1,
        pageSize: 10,
      }
    };
  },
  computed: {},
  watch: {},
  methods: {
    getDialogList(val) {
      this.dialogModalLoading = true;
      getRelationByIdCase({
        ...this.dialogParams,
      }).then(res => {
        if (res && res.rows) {
          this.dialogModalData = res.rows
          this.dialogParams.total = parseInt(res.total);
        }

      }).finally(() => {
        this.dialogModalLoading = false;

      })

    },

    handleRowStatus(val,row){
      let msg = row.status === '1' ? this.$t('relatedCase.enbaleConfrim') : this.$t('relatedCase.enbaleConfrim');
      this.$confirm(msg, this.$t('common.tips'), {
        confirmButtonText: this.$t('common.yes'),
        cancelButtonText: this.$t('common.no'),
        type: 'warning'
      }).then(() => {
        changeStatusCase({id: row.id, status: row.status, updateTime: row.updateTime}).then(res => {
          if (res) {
            let operationMsg = row.status === '1' ? this.$t('common.enableSuccess') : this.$t('common.deactivatSuccess');
            this.$message.success(operationMsg);
            this.handleQuery();
          }
        })
      }).finally(()=>{
        this.$set(row, 'status', val === '1' ? '0' : '1');
      })
    },
    query111(){
      getInfoByTpElevatorModelId(2).then(res=>{
        console.log(res)
      })
    },

    toAdd(){
      this.$tab.openPage(this.$t('relatedCase.addMenu'), '/param/paramRelatedCase/secondaryPage/0', {type: 1})
    },
    toView(row){
      this.$tab.openPage(this.$t('relatedCase.viewMenu'), '/param/paramRelatedCase/secondaryPage/'+row.id, {type: 4,id:row.id})
    },
    toViewElevator(row){
      this.$refs.seeElevator.open();
      this.$set(this.dialogParams, 'id', row.id);
      this.getDialogList()
    },
    toEdit(row){
      this.$tab.openPage(this.$t('relatedCase.editMenu'), '/param/paramRelatedCase/secondaryPage/'+row.id, {type: 2,id:row.id})
    },
    deleteRow(row){
      this.$confirm(this.$t('common.isDelete'), this.$t('common.tips'), {
        confirmButtonText: this.$t('common.yes'),
        cancelButtonText: this.$t('common.no'),
        type: 'warning'
      }).then(() => {
        deleteCase({id: row.id, updateTime: row.updateTime||null}).then(res => {
          if (res) {
            this.$message.success(this.$t('common.deleteSuccess'));
            this.handleQuery();
          }
        })
      })
    },
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    resetQuery() {
      this.queryParams = {
        pageNum: 1,
        pageSize: 10,
        total: 0,
      }
      this.handleQuery();
    },
    getList() {
      this.loading = true;
      getTableListCase(this.queryParams).then(res=>{
        if(res){
           this.tableData=res.rows;
           this.queryParams.total=parseInt(res.total) ;
        }
      }).finally(()=>{
        this.loading=false
      })

    },
  },


  created() {

  },
  mounted() {

  },


}


</script>

<style scoped>

</style>

