<template>
  <div>
    <div class="title">
      岗位管理
      <div class="title_time">{{ currentDate }}</div>
    </div>
    <div class="card">
      <div class="screen">
        <div>
          岗位编码&ensp;&ensp;<el-input v-model="postCode" style="width: 300px" size="large" placeholder="输入岗位编码" />
        </div>
        <div>
          &ensp;&ensp;&ensp;&ensp;岗位名称&ensp;&ensp;<el-input
            v-model="postName"
            style="width: 300px"
            size="large"
            placeholder="输入岗位名称"
          />
        </div>
        <div>
          &ensp;&ensp;&ensp;&ensp;岗位状态&ensp;&ensp;<el-select
            v-model="status"
            placeholder="请选择"
            size="large"
            style="width: 240px"
          >
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" />
          </el-select>
        </div>
        &ensp;&ensp; &ensp;&ensp;
        <div>
          <el-button type="primary" size="large" color="#0052d9" @click="query(0)">查询</el-button>
          <el-button size="large" @click="query(1)">重置</el-button>&ensp;&ensp;
        </div>
      </div>
      <div class="screen1"></div>
    </div>
    <div class="card cardbottom">
      <el-button type="primary" v-if="BUTTONS.postedit" size="large" color="#0052d9" @click="newaddition">新增</el-button>

      <div>&ensp;</div>
      <el-table :data="tableData" style="width: 100%" border>
        <el-table-column prop="id" label="岗位编号" />
        <el-table-column prop="postName" label="岗位名称" />
        <el-table-column prop="remark" label="备注" />
        <el-table-column prop="updateBy" label="创建者" />
        <el-table-column prop="postSort" label="显示顺序" />
        <el-table-column prop="status" label="状态" align="center">
          <template #default="scope">
            <div v-if="scope.row.status == 0">正常</div>
            <div v-else>停用</div>
          </template>
        </el-table-column>
        <el-table-column prop="updateTime" label="创建时间" />
        <el-table-column label="操作" align="center">
          <template #default="scope">
            <el-button color="#0052d9" v-if="BUTTONS.postedit" type="primary" @click="newition(scope.row)">编辑</el-button>
            <el-button v-if="BUTTONS.postdelete" @click="onremove(scope.row)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>
<!--      
                                                                                                                                                                                                                                     
--->
<script setup lang="ts">
import { platformpostlist, platformpostremove } from "@/api/home/Multisite";
import { useHandleData } from "@/hooks/useHandleData";
import { onMounted, ref } from "vue";
import { useAuthButtons } from "@/hooks/useAuthButtons";
const { BUTTONS } = useAuthButtons();
import { useRouter } from "vue-router";
const router = useRouter();
const options = ref([
  {
    value: "",
    label: "全部"
  },
  {
    value: "1",
    label: "停用"
  },
  {
    value: "2",
    label: "正常"
  }
]);

const query = (val: any) => {
  if (val == 0) {
    getplatformuserlist();
  } else {
    (postCode.value = ""), (postName.value = ""), (status.value = "");

    getplatformuserlist();
  }
};

// 新增
const newaddition = () => {
  router.push({
    path: "/post/addition",
    query: {
      type: "岗位新增", // 传递的参数
      id: ""
    }
  });
};
// 编辑
const newition = (row: { id: any }) => {
  router.push({
    path: "/post/addition",
    query: {
      type: "岗位编辑", // 传递的参数
      id: row.id
    }
  });
};
// 删除
const onremove = async (row: { id: any }) => {
  await useHandleData(platformpostremove, { ids: row.id }, "删除");
  await getplatformuserlist();
};
const tableData = ref();
const postCode = ref("");
const postName = ref("");
const status = ref("");
const getplatformuserlist = async () => {
  let obj = {
    postCode: postCode.value,
    postName: postName.value,
    status: status.value,
    pn: 1,
    ps: 10
  };
  const { data } = await platformpostlist(obj);
  tableData.value = data;
};
const currentDate = ref();
onMounted(() => {
  const current = localStorage.getItem("currentDate");
  if (current) {
    currentDate.value = current;
  }
  getplatformuserlist();
});
</script>
<style scoped lang="scss">
@import "./index.scss";
</style>
