<template>
    <div>
        <TableSearch :query="query" :options="searchOpt" :search="handleSearch" :refresh="GetPermissPolicy" />
        <div class="container">
            <TableCustom :columns="columns" :tableData="tableData" :total="page.total" :viewFunc="handleView"
                :delFunc="handleDelete" :changePage="changePage" :currentPage="page.index" :editFunc="handleEdit" :refresh="GetPermissPolicy">
                <template #toolbarBtn>
                    <el-button type="warning" :icon="CirclePlusFilled" @click="visible_add = true">新增</el-button>
                </template>
            </TableCustom>

        </div>
        <el-dialog :title="isEdit ? '编辑': '编辑'" v-model="visible" width="700px" destroy-on-close
            :close-on-click-modal="false" @close="closeDialog">
            <TableEdit :form-data="rowData" :options="options_edit" :edit="isEdit" :update="updateData" />
        </el-dialog>
        <el-dialog :title="isAdd ? '新增' : '新增'" v-model="visible_add" width="700px" destroy-on-close
            :close-on-click-modal="false" @close="closeDialog">
            <TableEdit :form-data="rowData" :options="options" :edit="isAdd" :update="addData" />
        </el-dialog>
        <el-dialog title="查看详情" v-model="visible1" width="700px" destroy-on-close>
            <TableDetail :data="viewData"></TableDetail>
        </el-dialog>
    </div>
</template>
<script lang="ts" setup>
//获取query参数
import { onMounted,ref, reactive } from 'vue';
import { CirclePlusFilled } from '@element-plus/icons-vue';
import {PermissPolicyResponseData, PolicyUserRange} from '@/types/permiss_policy';
import {GetPermissPolicyService, DelPermissPolicyService, UpdatePermissPolicyService, AddPermissPolicyService} from '@/api/permiss_policy';
import { ElMessage } from 'element-plus';
import { FormOption, FormOptionList } from '@/types/form-option';
import { all } from 'axios';
import { t } from '@wangeditor/editor';

const tableData = ref<PolicyUserRange[]>([]);
const allData = ref<PolicyUserRange[]>([]);
const visible = ref(false);
const visible_add = ref(false);
const isEdit = ref(false);
const isAdd = ref(false);
const rowData = ref<PolicyUserRange>({} as PolicyUserRange);
// 查询相关
const query = reactive({
    name: '',
});
const page = reactive({
    index: 1,
    size: 10,
    total: 122,
});
const searchOpt = {};
const viewData = ref({
    row: {},
    list: [

    ]
});
// 查看详情弹窗相关
const visible1 = ref(false);

onMounted(async () => {
    // 获取query参数
    GetPermissPolicy();

});
const closeDialog = () => {
    visible.value = false;
    visible_add.value = false;
    isEdit.value = false;
};

const handleAddPermissPolicy = async () => {
    // 添加权限策略
    let req = {
        "policy_name": "测试策略",
        "user_range": [{'id':1}]
    };
    try {
        const response = await AddPermissPolicyService(req);
        if (response['code'] !== 0) {
            ElMessage.error('添加权限策略失败:' + response["message"]);
            return;
        }
        ElMessage.success('添加权限策略成功');
    } catch (error) {
        console.error('获取权限策略失败:', error);
    }

};

const handleUpdatePermissPolicy = async () => {
    // 更新权限策略
    let req = {
        "id": 1,
        "policy_name": "测试策略",
        "user_range": [{'id':1}]
    };
        try {
        const response = await UpdatePermissPolicyService(req);
        if (response['code'] !== 0) {
            ElMessage.error('更新权限策略失败:' + response["message"]);
            return;
        }
        ElMessage.success('更新权限策略成功');
    } catch (error) {
        console.error('更新权限策略失败:', error);
    }

};
const handleDeletePermissPolicy = async () => {
    // 删除权限策略
    let req = {
        "id": 1,
    };
    try {
        const response = await DelPermissPolicyService(req);
        if (response['code'] !== 0) {
            ElMessage.error('删除权限策略失败:' + response["message"]);
            return;
        }
        ElMessage.success('删除权限策略成功');
    } catch (error) {
        console.error('删除权限策略失败:', error);
    }
};
const GetPermissPolicy = async () => {
    try {
        const response = await GetPermissPolicyService();
        if (response['code'] !== 0) {
            console.error('获取权限策略失败:', response["message"]);
            return;
        }
        // allData.value = response.data;
        allData.value = [];
        for (let i = 0; i < response.data.length; i++) {
            let temp: PermissPolicyResponseData = response.data[i];
            let temp_ :PolicyUserRange = {
                ID: temp.policy.ID,
                CreatedAt: temp.policy.CreatedAt,
                UpdatedAt: temp.policy.UpdatedAt,
                DeletedAt: temp.policy.DeletedAt,
                name: temp.policy.name,
                info: temp.policy.info,
                redis: temp.policy.redis, // Redis 相关权限
                run_shell: temp.policy.run_shell, // 运行 Shell 相关权限
                upload: temp.policy.upload, // 上传相关权限
                cid: temp.policy.cid, // 同上
                file: temp.policy.file, // 同上
                device: temp.policy.device, // 设备相关权限
                upload_size: temp.policy.upload_size, // 同上
                upload_max_size: temp.policy.upload_max_size, // 同上
                send_mail: temp.policy.send_mail, // 发送邮件相关权限
                range: temp.range,
            };
            allData.value.push(temp_);
        }
        page.total = allData.value.length;
        page.index = 1;
        // 分页
        let start = (page.index - 1) * page.size;
        let end = start + page.size;
        if (end > page.total) {
            end = page.total;
        }
        if (start > page.total) {
            start = page.total;
        }
        tableData.value = allData.value.slice(start, end);
        console.log("allData:", allData.value);
    } catch (error) {
        console.error('获取权限策略失败:', error);
    }
};
const handleEdit = async (row: PolicyUserRange) => {
    let data = row;
    rowData.value = data;
    //console.log("edit_row_data:", rowData.value);
    isEdit.value = true;
    visible.value = true;
};

const addData = async (data) => {
    let model_id =[]
    console.log("model update:",data)
    let model_id_list= data["ModelIDS"]
    for (let i = 0; i < model_id_list.length; i++) {
        model_id.push({"id":model_id_list[i]})
    }
    let model_ids = JSON.stringify(model_id)
    let result ={}
      try{
        let req={
            token:localStorage.getItem("token"),
            name: data.Name,
            model_id: model_id_list[0],
            model_ids: model_ids,
            function: data.Function,
            info: data.Info
        }
        result = await AddPermissPolicyService(req);
        if (result['code'] === 0) {
          ElMessage.success("新增成功");
        } else {
          ElMessage.error("新增失败");
        }

      }catch(e){
        console.log(e);
      }
    closeDialog();
};

const updateData = async (data) => {

    let result ={}
      try{
        let req={
            token:localStorage.getItem("token"),
            id: data.ID,
        };
        result = await UpdatePermissPolicyService(req);
        if (result['code'] === 0) {
          ElMessage.success("更新成功");
        } else {
          ElMessage.error("更新失败");
        }

      }catch(e){
        console.log(e);
      }
      closeDialog();
};
const handleSearch = async () => {
    // query.name是否是数字
    if (isNaN(Number(query.name))) {
        ElMessage.error('请输入数字');
        return;
    }
    let req={
        token: localStorage.getItem('token'),
        type: "ID",
        id: parseInt(query.name) || 1
    }
    await GetPermissPolicy();
    page.total = allData.value.length;
    page.index = 1;
    // 分页
    let start = (page.index - 1) * page.size;
    let end = start + page.size;
    if (end > page.total) {
        end = page.total;
    }
    if (start > page.total) {
        start = page.total;
    }
    tableData.value = allData.value.slice(start, end);
};

// 表格相关
let columns = ref([
    // { type: 'index', label: '序号', width: 55, align: 'center' },
    { prop: 'ID', label: '权限策略ID' },
    {prop: 'name', label: '名称'},
    { prop: 'info', label: '描述信息' },
    { prop: 'CreatedAt', label: '创建时间',type: 'date' },
    { prop: 'operator', label: '操作', width: 250 , operate: { view: true, edit: true, delete: true,push: {link: false,label:"继续该会话"},gen: {show: false,label:"下载文件"}, genv2:{type:"", label:"", show:false} }},
])

// 新增弹窗
let options = ref<FormOption>({
    labelWidth: '100px',
    span: 12,
    list: [
        { type: 'input', label: '名称', prop: 'Name', required: true },
        { type: 'input', label: '描述', prop: 'Info', required: true },
    ]
})

//编辑弹窗
let options_edit = ref<FormOption>({
    labelWidth: '100px',
    span: 12,
    list: [
        { type: 'input', label: '名称', prop: 'Name', required: true },
        { type: 'input', label: '描述', prop: 'Info', required: true },
    ]
})

const handleView =async (row: Function) => {
    viewData.value.row = row;
    viewData.value.list = [
        {
            prop: 'ID',
            label: '权限策略ID',
        },
        {
            prop: 'Name',
            label: '名称',
        },
        {
            prop: 'Info',
            label: '描述',
        },
        {
            prop: 'CreatedAt',
            label: '创建时间',
            type: 'date'
        },
        {
            prop: 'UpdatedAt',
            label: '更新时间',
            type: 'date'
        },
    ]
    visible1.value = true;
};

// 删除相关
const handleDelete = async (row: PermissPolicyResponseData) => {
    let req={
        token: localStorage.getItem('token'),
        id: row.policy.ID,
    }
    try{
        let result = await DelPermissPolicyService(req);
        if(result['code'] === 0){
            ElMessage.success("删除成功");
            GetPermissPolicy();
        }else{
            ElMessage.error("删除失败");
        }
    }catch(e){
        console.log(e);
    }
}

const changePage = (val: number) => {
    page.index = val;
    //分页
    let start = (page.index - 1) * page.size;
    let end = start + page.size;
    if (end > page.total) {
        end = page.total;
    }
    if (start > page.total) {
        start = page.total;
    }
    tableData.value = allData.value.slice(start, end);
};

</script>