<template>
  <div>
    <div class="bigBox">
      <div class="zy-right">
        <div class="titleBox">
          <div class="title">安全方针、滚动标语</div>
        </div>
        <!-- 表格 -->
        <section class="eltabh">
          <MOSTY.Table :table-columns="pageData.tableColumns" :tableData="pageData.tableData"
            :tableloading="tableloading" :tableHeight="'100%'" :isSelect="false" style="width: 100%;" :isSort="true"
            @handleSelecTable="handleSelecTable">
            <template #state="{ row }">
              <span> {{ row.state == '02' ? '已发布' : '未发布' }}</span>
            </template>
            <template #actions="{ row }">
              <!--  v-if="orgid == row.orgid && (filterqx('isaqbm') || filterqx('isldbz'))" -->
              <span class="operedit" @click="handlexg(row)">
                <el-icon>
                  <EditPen />
                </el-icon>编辑</span>
              <span class="operesee" @click="handleSee(row)">
                <el-icon>
                  <View />
                </el-icon>查看</span>
              <span class="operesee" @click="handleHistory(row)">
                <el-icon>
                  <Compass />
                </el-icon>历史修改记录</span>
            </template>
          </MOSTY.Table>
        </section>
      </div>
    </div>
    <!-- 修改信息 -->
    <div v-if="addShow" class="dialog-box">
      <UpdateAqfz @close="close" :title="title" :isShow="isShow" :obj="formData" :isHistory="false" />
    </div>
    <!-- 历史记录 -->
    <div v-if="historyShow" class="dialog-box">
      <AqfzHistory @closeHistory="closeHistory" :obj="formData" />
    </div>
  </div>
</template>

<script setup>
import { onMounted, ref, reactive } from "vue";
import * as MOSTY from "@/components/MyComponents/index";
import { getItem } from "@/utils/storage";
import UpdateAqfz from './compon/updateAqfz.vue'
import AqfzHistory from './compon/aqfzHistory.vue'
import { getApi } from "@/api/tobAcco_api.js";
const formData = ref({});
const historyShow = ref(false)
import { filterqx } from "@/utils/auth.js"
const orgid = ref('')
const orglevel = ref('')
const tableloading = ref(false)
const addShow = ref(false)
const title = ref('')
const isShow = ref(false)
const pageData = reactive({
  tableColumns: [

    {
      title: "所属单位",
      prop: "orgname"
    },
    {
      title: "安全方针",
      prop: "policy"
    },
    {
      title: "安全滚动标语",
      prop: "slogan"
    },
    {
      title: "状态",
      prop: "state",
      slot: true
    },
    {
      title: "操作",
      prop: "actions",
      slot: true
    }
  ],
  tableData: []
})
// 初始化
onMounted(() => {
  let dept = getItem("deptId")
  orgid.value = dept.sssgsid || dept.ssdwid
  orglevel.value = dept.orgLevel.substring(0, 1);
  getList();
});
const handleSelecTable = () => {

}
const closeHistory = () => {
  historyShow.value = false
  formData.value = null
}
const close = () => {
  addShow.value = false;
  formData.value = null
  getList()
};
const handleHistory = (row) => {
  formData.value = row
  historyShow.value = true
}
const handleSee = (row) => {
  title.value = "查看安全方针、滚动标语";
  formData.value = row
  addShow.value = true
  isShow.value = true
}
// 修改
const handlexg = (row) => {
  addShow.value = true
  title.value = "修改安全方针、滚动标语";
  formData.value = row
  isShow.value = false
};
// 获取数据
const getList = () => {
  tableloading.value = true
  getApi({ orgid: orgid.value }, "/mosty-jcgl/safetyPolicy/getList").then(res => {
    pageData.tableData = res
  }).finally(() => {
    tableloading.value = false
  })
}
</script>

<style lang="scss" scoped>
.zy-right {
  width: 100%;
}

.eltabh {
  height: calc(100vh - 204px);
}
</style>