<template>
  <div class="rights">
    <!-- 待选择 -->
    <div class="right0">
      <div class="titleBox">
        <div class="title">待选择</div>
        <div class="searchBox">
          <el-input placeholder="名称" v-model="listQuery.lawName" style="width: 190px;margin-right:10px;"></el-input>
          <MOSTY.DictTree v-if="props.types == '01'" :zdbh="'LAW_TYPE'" v-model="listQuery.lawType"
            :placeholder='"请选择法律法规类型"' :disabled='false' style="width: 160px;margin-right:10px;" />
          <el-button type="primary" @click="searchlist">
            <el-icon>
              <Search />
            </el-icon>
            <span>搜索</span>
          </el-button>
          <!-- 当前登录的是安全科 -->
          <el-button type="primary" @click="addsblist" v-if="addshowbrn">
            <el-icon>
              <CirclePlus />
            </el-icon>
            <span>添加</span>
          </el-button>
        </div>
      </div>
      <!-- 表格 -->
      <div class="tabBox">
        <el-table ref="multipleTableRef" v-loading="tableloading" element-loading-text="数据加载中..." :data="tableData"
          stripe style="width:100%" @selection-change="handleSelectionChange" border>
          <el-table-column type="selection" v-if="addshowbrn" />
          <el-table-column label="法律法规名称" property="lawname" v-if="props.types == '01'"></el-table-column>
          <el-table-column label="标准名称" property="filename" v-else></el-table-column>
          <el-table-column label="法律法规类型" property="lawType" v-if="props.types == '01'" show-overflow-tooltip>
            <template #default="{ row }">
              <dict-tag :options="LAW_TYPE" :value="row.lawType" :tag="false" :isTree="true" />
            </template></el-table-column>
          <el-table-column label="标准编码" property="shortid" v-else show-overflow-tooltip></el-table-column>
          <el-table-column label="法律法规等级" property="lawLevel" v-if="props.types == '01'" show-overflow-tooltip>
            <template #default="{ row }">
              <dict-tag :options="LAW_LEVEL" :value="row.lawLevel" :tag="false" :isTree="true" />
            </template></el-table-column>
          <el-table-column label="录入单位" property="orgname" v-else show-overflow-tooltip></el-table-column>
          <el-table-column label="发布单位" property="promulgationcompany" v-if="props.types == '01'"></el-table-column>
          <el-table-column label="录入单位" property="orgName" v-if="props.types == '01'"></el-table-column>
        </el-table>
        <div class="fenye">
          <el-pagination class="pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange"
            :current-page="listQuery.pageCurrent" :page-sizes="[2, 5, 10, 20]" :page-size="listQuery.pageSize"
            layout="total, prev, pager, next, sizes, jumper" :total="total"></el-pagination>
        </div>
      </div>
    </div>
    <div class="right1">
      <div class="titleBox">
        <div class="title">已选择</div>
        <el-button type="primary" @click="deletebtn" v-if="addshowbrn">
          <el-icon>
            <Delete />
          </el-icon>
          <span>删除</span>
        </el-button>
      </div>
      <!-- 表格 -->
      <div class="tabBox">
        <el-table ref="multipleTableRef" :data="tableDatas" style="width:100%" v-loading="tableloadings"
          element-loading-text="数据加载中..." stripe @selection-change="handleSelectionChanges" border>
          <el-table-column type="selection" v-if="addshowbrn" />
          <el-table-column label="法律法规名称" property="lawname" v-if="props.types == '01'"></el-table-column>
          <el-table-column label="标准名称" property="filename" v-else></el-table-column>
          <el-table-column label="法律法规类型" property="lawType" v-if="props.types == '01'" show-overflow-tooltip>
            <template #default="{ row }">
              <dict-tag :options="LAW_TYPE" :value="row.lawType" :tag="false" :isTree="true" />
            </template></el-table-column>
          <el-table-column label="标准编码" property="shortid" v-else show-overflow-tooltip></el-table-column>
          <el-table-column label="法律法规等级" property="lawLevel" v-if="props.types == '01'" show-overflow-tooltip>
            <template #default="{ row }">
              <dict-tag :options="LAW_LEVEL" :value="row.lawLevel" :tag="false" :isTree="true" />
            </template></el-table-column>
          <el-table-column label="录入单位" property="orgname" v-else show-overflow-tooltip></el-table-column>
          <el-table-column label="发布单位" property="promulgationcompany" v-if="props.types == '01'"></el-table-column>
          <el-table-column label="录入单位" property="orgName" v-if="props.types == '01'"></el-table-column>
        </el-table>
        <div class="fenye">
          <el-pagination class="pagination" @size-change="handleSizeChanges" @current-change="handleCurrentChanges"
            :current-page="listQuerys.pageCurrent" :page-sizes="[2, 5, 10, 20]" :page-size="listQuerys.pageSize"
            layout="total, prev, pager, next, sizes, jumper" :total="totals"></el-pagination>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup>
// 引入
import { ref, reactive, defineProps, watch, getCurrentInstance } from "vue";
import { getApi, postApi } from "@/api/tobAcco_api.js";
import { ElMessage } from "element-plus";
import * as MOSTY from "@/components/MyComponents/index";
import { getItem } from "@/utils/storage";
const ssdept = getItem("deptId")
const tableloading = ref(false)
const { proxy } = getCurrentInstance();
const tableloadings = ref(false)
const { D_TB_FLLB, LAW_LEVEL, LAW_TYPE } = proxy.$dict("D_TB_FLLB", "LAW_LEVEL", "LAW_TYPE");
const addshowbrn = ref(false)
const listQuery = reactive({
  pageCurrent: 1,
  pageSize: 20,
})
const listQuerys = reactive({
  pageCurrent: 1,
  pageSize: 20,
})
// 数据
const total = ref(0)
const totals = ref(0)
const tableData = ref([])
const tableDatas = ref([])
const lawIdList = ref([])//添加识别id
const delId = ref([])//添加识别id
const props = defineProps({
  total: {
    type: Number,
    default: 0
  },
  depedata: {
    type: Object,
    default: 0
  },
  types: {
    type: String,
    default: null
  }
})
watch(
  () => props.depedata,
  (val) => {
    listQuery.orgcode = val.id.replace('XN', '')
    listQuerys.orgcode = val.id.replace('XN', '')
    console.log(val, 'val');

    if (props.types == '01') {
      if ((val.id == ssdept.ssdwid || val.id == ssdept.ssdwid + 'XN') && (ssdept.orgBizType == '04' || ssdept.orgBizType == '52')) {
        addshowbrn.value = true
      } else if (val.id == ssdept.ssbmid) {
        addshowbrn.value = true
      }
      else {
        addshowbrn.value = false
      }
    } else {
      if ((val.id == ssdept.ssbmid || val.id == ssdept.ssbmid + 'XN') && (ssdept.orgBizType == '04' || ssdept.orgBizType == '52')) {
        addshowbrn.value = true
      } else if (val.id == ssdept.ssbmid) {
        addshowbrn.value = true
      } else {
        addshowbrn.value = false
      }
    }
    getWsbList();
    getYsbList()
  },
  { deep: true }
);

//搜索
function searchlist() {
  listQuery.pageCurrent = 1
  listQuerys.pageCurrent = 1
  listQuerys.lawName = listQuery.lawName
  listQuerys.lawType = listQuery.lawType
  getWsbList();
  getYsbList()
}
//获取列表数据
function getWsbList() {
  tableloading.value = true
  if (props.types == '01') {
    //法律法规识别获取
    getApi(listQuery, '/mosty-jcgl/lawDistr/getWsbList').then((res) => {
      if (res.records) {
        tableloading.value = false;
        tableData.value = res.records;
        total.value = res.total;
      }
    }).catch(() => {
      tableData.value = []
      tableloading.value = false;
    })
  } else {
    //规章制度未识别获取
    let parmas = {
      pageSize: listQuery.pageSize,
      pageCurrent: listQuery.pageCurrent,
      depart: listQuery.orgcode,
      filename: listQuery.lawName,
      type: '1', //文件类型 1.规章制度 2. 操作规程
    }
    if (props.types == '02') {
      parmas.type = '1'
    }
    if (props.types == '03') {
      parmas.type = '2'
    }
    getApi(parmas, '/mosty-jcgl/regulationsrules/getWsbList').then((res) => {
      if (res.records) {
        tableloading.value = false;
        tableData.value = res.records;
        total.value = res.total;
      }
    }).catch(() => {
      tableData.value = []
      tableloading.value = false;
    })
  }
}
//已识别
function getYsbList() {
  tableloadings.value = true
  if (props.types == '01') {
    getApi(listQuerys, '/mosty-jcgl/lawDistr/getYsbList').then((res) => {
      if (res.records) {
        tableloadings.value = false;
        tableDatas.value = res.records;
        totals.value = res.total;
      }
    }).catch(() => {
      tableDatas.value = []
      tableloadings.value = false;
    })
  } else {
    //规章制度已识别获取
    let parmas = {
      pageSize: listQuery.pageSize,
      pageCurrent: listQuery.pageCurrent,
      depart: listQuery.orgcode,
      filename: listQuery.lawName,
      type: '1',//文件类型 1.规章制度 2. 操作规程
    }
    if (props.types == '02') {
      parmas.type = '1'
    }
    if (props.types == '03') {
      parmas.type = '2'
    }
    getApi(parmas, '/mosty-jcgl/regulationsrules/getYsbList').then((res) => {
      if (res.records) {
        tableloadings.value = false;
        tableDatas.value = res.records;
        totals.value = res.total;
      }
    }).catch(() => {
      tableDatas.value = []
      tableloadings.value = false;
    })
  }
}
//选项添加项
const handleSelectionChange = (val) => {
  lawIdList.value = val.map((item) => {
    return item.id
  })
}
//选择删除项
const handleSelectionChanges = (val) => {
  delId.value = val.map((item) => {
    return item.id
  })
}
//添加识别数据
function addsblist() {
  if (lawIdList.value.length < 1) {
    ElMessage.warning("请选择识别项！！！");
  } else {
    tableloading.value = true
    tableloadings.value = true
    if (props.types == '01') {
      postApi({ lawIdList: lawIdList.value }, '/mosty-jcgl/lawDistr/addDistr').then(() => {
        ElMessage.success("新增成功");
        getWsbList();
        getYsbList()
        tableloading.value = true
        tableloadings.value = false
      }).finally(() => {
        tableloading.value = true
        tableloadings.value = false
      })
    } else {
      let data = { depart: listQuery.orgcode, libraryidList: lawIdList.value }
      postApi(data, '/mosty-jcgl/regulationsrules/addRules').then(() => {
        ElMessage.success("新增成功");
        getWsbList();
        getYsbList()
        tableloading.value = true
        tableloadings.value = false
      }).finally(() => {
        tableloading.value = true
        tableloadings.value = false
      })
    }
  }
}
//取消识别数据
function deletebtn() {
  if (delId.value.length < 1) {
    ElMessage.warning("请选择识别项！！！");
  } else {
    tableloading.value = true
    tableloadings.value = true
    if (props.types == '01' && delId.value) {
      postApi({ lawIdList: delId.value }, '/mosty-jcgl/lawDistr/delDistr').then(() => {
        ElMessage.success("删除成功");
        getWsbList();
        getYsbList()
        tableloading.value = true
        tableloadings.value = true
      }).finally(() => {
        tableloading.value = false
        tableloadings.value = false
      })
    } else {
      postApi({ depart: listQuery.orgcode, libraryidList: delId.value }, '/mosty-jcgl/regulationsrules/delRules').then(() => {
        ElMessage.success("删除成功");
        getWsbList();
        getYsbList()
        tableloading.value = true
        tableloadings.value = true
      }).finally(() => {
        tableloading.value = false
        tableloadings.value = false
      })
    }
  }
}

//分页
const handleSizeChange = (currentSize) => {
  listQuery.pageSize = currentSize;
  getWsbList();
};
const handleCurrentChange = (currentPage) => {
  listQuery.pageCurrent = currentPage;
  getWsbList();
};
const handleSizeChanges = (currentSize) => {
  listQuerys.pageSize = currentSize;
  getYsbList();
};
const handleCurrentChanges = (currentPage) => {
  listQuerys.pageCurrent = currentPage;
  getYsbList();
};
</script>

<style lang="scss" scoped>
.rights {

  padding: 0 10px;
  display: flex;

  .right0 {
    margin-right: 30px;
    width: 50%;
  }

  .right1 {
    width: 50%;
  }

  .tabBox {

    .el-table {
      height: calc(100vh - 306px);
    }


  }

  .titleBox {
    display: flex;
    align-items: center;
    margin: 5px 10px;
    // width: 745px;
    // border-left: 1px solid green;
  }

  .searchBox {
    // width: 452px;
    display: flex;
    justify-content: space-around;
    border: 0;
    padding: 0px !important;

    .el-input {
      width: 220px;
    }

    .el-select {
      width: 150px;
    }
  }

  .title {
    width: 80px;
    height: 60px;
    line-height: 60px;
    font-size: 18px;
    font-weight: 400;
    color: #0f3916;
    display: flex;
    justify-content: space-between;
    align-items: center;

    .el-icon {
      cursor: pointer;
    }
  }
}

::v-deep .el-pagination {
  --el-pagination-font-size: 13px !important;
  --el-pagination-button-width: 25px !important;
  padding: 1px 0px !important;
}
</style>