From 72ed98dc002b3ba773fba5a7422839dabdc5a6c0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=A6=96=E5=A7=90?= <2981176548@qq.com>
Date: Wed, 31 Jan 2024 21:40:37 +0800
Subject: [PATCH] =?UTF-8?q?=E8=BD=AE=E6=92=AD=E5=9B=BE=E4=BF=AE=E6=94=B92?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/Manager/components/Carousel.vue        |  73 ++++-
 src/Manager/components/TeamInformation.vue | 354 ++++++++++++++++++++-
 2 files changed, 415 insertions(+), 12 deletions(-)

diff --git a/src/Manager/components/Carousel.vue b/src/Manager/components/Carousel.vue
index 8a711af..1354d5b 100644
--- a/src/Manager/components/Carousel.vue
+++ b/src/Manager/components/Carousel.vue
@@ -8,7 +8,8 @@
         </a-space>
     </div>
 
-    <a-table :row-selection="rowSelection" :columns="columns" :data-source="states.data" :scroll="{ y: 400 }">
+    <a-table :row-selection="rowSelection" :columns="columns"  :data-source="states.data" :scroll="{ y: 400 }" style="width: 85vw;">
+
 
         <template #bodyCell="{ column, record }">
 
@@ -19,8 +20,8 @@
 
             <template v-else-if="column.key === 'action'">
               <span style="margin-left: 10px">
-              <a-button type="primary" @click="showModal(record)" size="small">详情</a-button>
-              <a-button type="dashed" @click="showDeleteConfirm" size="small">删除</a-button>
+                  <a-button  type="text" @click="showModal(record)" size="small" style=" color: dodgerblue;"><EditOutlined />修改</a-button>
+              <a-button  type="text" @click="showDeleteConfirm(record)" size="small" style=" color: dodgerblue;"><DeleteOutlined />删除</a-button>
               </span>
             </template>
 
@@ -34,7 +35,7 @@
     </div>
 
 <!--详情对话框-->
-    <a-modal v-model:open="open" title="详情" ok-text="确认" cancel-text="取消" @ok="hideModal">
+    <a-modal v-model:open="open" title="详情" ok-text="确认" cancel-text="取消" @ok="EditHeaderImage">
         <a-form-item label="图片详情">
 <!--            <a-input v-model:value="formState.author" />-->
 
@@ -130,7 +131,13 @@
 </template>
 <script setup>
 import {createVNode, onMounted, reactive, ref} from 'vue';
-import {ExclamationCircleOutlined, PlusOutlined, SearchOutlined} from '@ant-design/icons-vue';
+import {
+    DeleteOutlined,
+    EditOutlined,
+    ExclamationCircleOutlined,
+    PlusOutlined,
+    SearchOutlined
+} from '@ant-design/icons-vue';
 import {Form, message, Modal} from 'ant-design-vue';
 import requests from "../../public/request.js";
 
@@ -146,6 +153,16 @@ const addopen = ref(false);
 const showAddModal = () => {
     addopen.value = true;
 };
+
+// // 翻页
+
+
+
+
+
+
+
+
 const showModal = (record) => {
     // formState.author = record.author;
     updateId.value = record.id
@@ -164,11 +181,13 @@ const addOk = e => {
     addopen.value = false;
 };
 const states = reactive({
-    data:[]
+    data:[],
+
 })
+
 //删除
 
-const showDeleteConfirm = () => {
+const showDeleteConfirm = (record) => {
     console.log("delete Dialog")
     Modal.confirm({
         title: 'Confirm',
@@ -176,6 +195,22 @@ const showDeleteConfirm = () => {
         content: '确认删除这条数据吗',
         okText: '确认',
         cancelText: '取消',
+        onOk: () => {
+
+            const id = record.id;
+           requests.infoDeleteHeaderImage(id, token.value)
+                .then(response => {
+                    // 处理删除成功的响应
+                    console.log('删除成功');
+                    message.success("删除成功")
+                })
+                .catch(error => {
+                    // 处理删除失败的响应
+                    console.error('删除失败', error);
+                    message.error("删除失败")
+                })
+        }
+
     });
 
 };
@@ -207,7 +242,7 @@ const {  validateInfos } = useForm(
     }),
 );
 const fileList = ref([]);
-const loading = ref(false);
+// const loading = ref(false);
 const imageUrl = ref('');
 
 
@@ -308,6 +343,7 @@ const columns = [
         title: '状态',
         key: 'isActive',
         dataIndex: 'isActive',
+        width: 80,
     },
     {
         title: '操作',
@@ -356,10 +392,9 @@ function getAll() {
 // const hideModal = () => {
 // };
 // 编辑
-function hideModal(){
+function EditHeaderImage(){
     open.value = false;
-  console.log(updateId.value)
-    requests.infoEditHeaderImage(updateId.value,formState,token.value).then((res)=>{
+    requests.infoEditHeaderImage(updateId,formState,token.value).then((res)=>{
         console.log("editResult:",res)
         // console.log("updateData:",updateData)
         // if (res.data.code === 200) {
@@ -374,4 +409,20 @@ function hideModal(){
     })
 
 }
+
+
+// 删除
+// const infoDeleteHeaderImage = (id, token) => {
+//     return axios({
+//         url: api + "/info/header-image/del",
+//         method: "delete",
+//         params: id,
+//         headers: {
+//             'Authorization':'Bearer '+token,
+//             'Content-Type': 'application/json;charset=utf-8',
+//             'Timestamp': getCurrentTimestamp()
+//         }
+//     })
+// }
 </script>
+
diff --git a/src/Manager/components/TeamInformation.vue b/src/Manager/components/TeamInformation.vue
index 5367b96..b89cac0 100644
--- a/src/Manager/components/TeamInformation.vue
+++ b/src/Manager/components/TeamInformation.vue
@@ -1,3 +1,355 @@
+<!--<template>-->
+<!--    <a-table-->
+<!--        :row-selection="rowSelection"-->
+<!--        :scroll="{ y: 400 }"-->
+<!--        :columns="columns"-->
+<!--        :row-key="record => record.login.uuid"-->
+<!--        :data-source="states.data"-->
+<!--        :pagination="pagination"-->
+<!--        :loading="loading"-->
+<!--        @change="handleTableChange"-->
+<!--    >-->
+<!--        <template #bodyCell="{ column, record }">-->
+
+<!--            <template v-if="column.key === 'isActive'">-->
+<!--                <a-tag :bordered="false" color="success" v-if="record.isActive === true">展示</a-tag>-->
+<!--                <a-tag :bordered="false" color="error"  v-if="record.isActive === false">未展示</a-tag>-->
+<!--            </template>-->
+
+<!--            <template v-else-if="column.key === 'action'">-->
+<!--              <span style="margin-left: 10px">-->
+<!--                  <a-button class="button2" type="text" @click="showModal(record)" size="small"><EditOutlined />修改</a-button>-->
+<!--              <a-button class="button1" type="text" @click="showDeleteConfirm" size="small"><DeleteOutlined />删除</a-button>-->
+<!--              </span>-->
+<!--            </template>-->
+
+<!--            <template v-else-if="column.key === 'photo'">-->
+<!--                <img :src="record.image" alt="" style="width: 50px;height: 50px;text-align: center">-->
+<!--            </template>-->
+<!--        </template>-->
+
+<!--    </a-table>-->
+<!--</template>-->
+<!--<script setup>-->
+<!--import { computed } from 'vue';-->
+<!--import { usePagination } from 'vue-request';-->
+<!--import axios from 'axios';-->
+
+
+<!--const queryData = params => {-->
+<!--    return axios.get('https://randomuser.me/api?noinfo', {-->
+<!--        params,-->
+<!--    });-->
+<!--};-->
+<!--const {-->
+<!--    data: dataSource,-->
+<!--    run,-->
+<!--    loading,-->
+<!--    current,-->
+<!--    pageSize,-->
+<!--} = usePagination(queryData, {-->
+<!--    formatResult: res => res.data.results,-->
+<!--    pagination: {-->
+<!--        currentKey: 'page',-->
+<!--        pageSizeKey: 'results',-->
+<!--    },-->
+<!--});-->
+<!--const pagination = computed(() => ({-->
+<!--    total: 200,-->
+<!--    current: current.value,-->
+<!--    pageSize: pageSize.value,-->
+<!--}));-->
+<!--const handleTableChange = (pag, filters, sorter) => {-->
+<!--    run({-->
+<!--        results: pag.pageSize,-->
+<!--        page: pag?.current,-->
+<!--        sortField: sorter.field,-->
+<!--        sortOrder: sorter.order,-->
+<!--        ...filters,-->
+<!--    });-->
+<!--};-->
+
+
+
+
+
+
+<!--    import {createVNode, onMounted, reactive, ref} from 'vue';-->
+<!--    import {-->
+<!--    DeleteOutlined,-->
+<!--    EditOutlined,-->
+<!--    ExclamationCircleOutlined,-->
+<!--    PlusOutlined,-->
+<!--    SearchOutlined-->
+<!--} from '@ant-design/icons-vue';-->
+<!--    import {Form, message, Modal} from 'ant-design-vue';-->
+<!--    import requests from "../../public/request.js";-->
+
+
+<!--    const current1 = ref(1);-->
+<!--    const current2 = ref(2);-->
+<!--    const onChange = pageNumber => {-->
+<!--    console.log('Page: ', pageNumber);-->
+<!--};-->
+<!--    const open = ref(false);-->
+<!--    const addopen = ref(false);-->
+
+<!--    const showAddModal = () => {-->
+<!--    addopen.value = true;-->
+<!--};-->
+
+<!--    // // 翻页-->
+
+
+
+
+
+
+
+
+<!--    const showModal = (record) => {-->
+<!--    // formState.author = record.author;-->
+<!--    updateId.value = record.id-->
+<!--    formState.description = record.description-->
+<!--    formState.photo = record.photo;-->
+<!--    formState.title=record.title;-->
+<!--    // formState.createdAt =record.createdAt;-->
+<!--    formState.image = record.image;-->
+<!--    formState.displayOrder = record.displayOrder;-->
+<!--    formState.isActive = record.isActive;-->
+
+<!--    open.value = true;-->
+<!--};-->
+<!--    const addOk = e => {-->
+<!--    console.log(e);-->
+<!--    addopen.value = false;-->
+<!--};-->
+<!--    const states = reactive({-->
+<!--    data:[{-->
+<!--           dataSource,-->
+<!--            run,-->
+<!--            loading,-->
+<!--            current,-->
+<!--            pageSize,-->
+<!--        } = usePagination(queryData, {-->
+<!--            formatResult: res => res.data.results,-->
+<!--            pagination: {-->
+<!--                currentKey: 'page',-->
+<!--                pageSizeKey: 'results',-->
+
+<!--            }})-->
+<!--    ],-->
+
+<!--})-->
+
+<!--    //删除-->
+
+<!--    const showDeleteConfirm = () => {-->
+<!--    console.log("delete Dialog")-->
+<!--    Modal.confirm({-->
+<!--    title: 'Confirm',-->
+<!--    icon: createVNode(ExclamationCircleOutlined),-->
+<!--    content: '确认删除这条数据吗',-->
+<!--    okText: '确认',-->
+<!--    cancelText: '取消',-->
+<!--});-->
+
+<!--};-->
+<!--    // 新增-->
+
+<!--    const useForm = Form.useForm;-->
+<!--    const value2 = ref('mysite');-->
+<!--    const modelRef = reactive({-->
+<!--    name: '',-->
+<!--    sub: {-->
+<!--    name: '',-->
+<!--},-->
+<!--});-->
+<!--    const {  validateInfos } = useForm(-->
+<!--    modelRef,-->
+<!--    reactive({-->
+<!--    name: [-->
+<!--{-->
+<!--    required: true,-->
+<!--    message: 'Please input name',-->
+<!--},-->
+<!--    ],-->
+<!--    'sub.name': [-->
+<!--{-->
+<!--    required: true,-->
+<!--    message: 'Please input sub name',-->
+<!--},-->
+<!--    ],-->
+<!--}),-->
+<!--    );-->
+<!--    const fileList = ref([]);-->
+<!--    // const loading = ref(false);-->
+<!--    const imageUrl = ref('');-->
+
+
+<!--    function getBase64(img, callback) {-->
+<!--    const reader = new FileReader();-->
+<!--    reader.addEventListener('load', () => callback(reader.result));-->
+<!--    reader.readAsDataURL(img);-->
+<!--}-->
+
+<!--    const handleChange = info => {-->
+<!--    if (info.file.status === 'uploading') {-->
+<!--    loading.value = true;-->
+<!--    return;-->
+<!--}-->
+<!--    if (info.file.status === 'done') {-->
+<!--    // Get this url from response in real world.-->
+<!--    getBase64(info.file.originFileObj, base64Url => {-->
+<!--    imageUrl.value = base64Url;-->
+<!--    loading.value = false;-->
+<!--});-->
+<!--}-->
+<!--    if (info.file.status === 'error') {-->
+<!--    loading.value = false;-->
+<!--    message.error('upload error');-->
+<!--}-->
+<!--};-->
+<!--    const beforeUpload = file => {-->
+<!--    const isJpgOrPng = file.type === 'image/jpeg' || file.type === 'image/png';-->
+<!--    if (!isJpgOrPng) {-->
+<!--    message.error('You can only upload JPG file!');-->
+<!--}-->
+<!--    const isLt2M = file.size / 1024 / 1024 < 2;-->
+<!--    if (!isLt2M) {-->
+<!--    message.error('Image must smaller than 2MB!');-->
+<!--}-->
+<!--    return isJpgOrPng && isLt2M;-->
+<!--};-->
+
+<!--    // 状态-->
+<!--    const updateId = ref(-1);-->
+<!--    const formState = reactive({-->
+<!--    // author:'',-->
+<!--    description: '',-->
+<!--    photo:'',-->
+<!--    title:'',-->
+<!--    // createdAt:'',-->
+<!--    image:'',-->
+<!--    displayOrder:'',-->
+<!--    isActive: false,-->
+<!--});-->
+
+
+
+<!--    const columns = [-->
+
+<!--    {-->
+<!--        title: '作者',-->
+<!--        dataIndex: 'author',-->
+<!--        key: 'author',-->
+<!--        resizable: true,-->
+<!--        width: 100,-->
+<!--        minWidth: 100,-->
+<!--        maxWidth: 200,-->
+<!--    },-->
+<!--    {-->
+<!--        title:'图片',-->
+<!--        key: 'photo',-->
+<!--        dataIndex: 'photo',-->
+<!--        resizable: true,-->
+<!--        width: 150,-->
+
+<!--    },-->
+<!--    {-->
+<!--        title: '标题',-->
+<!--        dataIndex: 'title',-->
+<!--        key: 'title',-->
+<!--        width:150,-->
+<!--    },-->
+<!--    {-->
+<!--        title: '创建时间',-->
+<!--        dataIndex: 'createdAt',-->
+<!--        key: 'createdAt',-->
+<!--        width:200,-->
+<!--    },-->
+<!--    {-->
+<!--        title: '图片地址',-->
+<!--        dataIndex: 'image',-->
+<!--        key: 'image',-->
+<!--        width:250,-->
+<!--    },-->
+<!--    {-->
+<!--        title: '排序',-->
+<!--        dataIndex: 'displayOrder',-->
+<!--        key: 'displayOrder',-->
+<!--        width:80,-->
+<!--    },-->
+<!--    {-->
+<!--        title: '状态',-->
+<!--        key: 'isActive',-->
+<!--        dataIndex: 'isActive',-->
+<!--    },-->
+<!--    {-->
+<!--        title: '操作',-->
+<!--        key: 'action',-->
+<!--    },-->
+<!--    ]-->
+<!--    // function handleResizeColumn(w, col) {-->
+<!--//     col.width = w;-->
+<!--// }-->
+
+
+<!--    const rowSelection = {-->
+<!--    onChange: (selectedRowKeys, selectedRows) => {-->
+<!--    console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);-->
+<!--},-->
+<!--    getCheckboxProps: record => ({-->
+<!--    disabled: record.name === 'Disabled User',-->
+<!--    // Column configuration not to be checked-->
+<!--    name: record.name,-->
+<!--}),-->
+<!--};-->
+
+
+<!--    const token = ref("eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiIxMyIsImV4cCI6MTcwNjU1MzIxNn0.KW3tSyK1nbSW4V-js1gJCmo1L3CuU1eI2Y8jX7-IqXY");-->
+
+
+<!--// 接口-->
+<!--    onMounted(() => {-->
+<!--    getAll()-->
+<!--})-->
+<!--// 获取所有数据-->
+<!--    function getAll() {-->
+
+<!--    requests.infoGetHeaderImage(null,token).then((res)=>{-->
+<!--    console.log(res)-->
+<!--    states.data = res.data.data.data-->
+<!--    // // console.log(res.data.data)-->
+<!--    // loadingTable.value = false-->
+<!--    // for (let i = 0; i < res.data.data.data.length; i++) {-->
+<!--    //     states.data[i] = res.data.data.data[i].user-->
+<!--    // }-->
+<!--    // // console.log("getAll:",states.data)-->
+<!--})-->
+<!--}-->
+
+<!--// const hideModal = () => {-->
+<!--// };-->
+<!--// 编辑-->
+<!--    function hideModal(){-->
+<!--    open.value = false;-->
+<!--    requests.infoEditHeaderImage(updateId,formState,token.value).then((res)=>{-->
+<!--    console.log("editResult:",res)-->
+<!--    // console.log("updateData:",updateData)-->
+<!--    // if (res.data.code === 200) {-->
+<!--    //     getAll()-->
+<!--    //     message.success('修改成功')-->
+<!--    // }-->
+<!--    // else {-->
+<!--    //     loadingTable.value = false-->
+<!--    //     message.error('修改失败')-->
+<!--    //-->
+<!--    // }-->
+<!--})-->
+
+<!--}-->
+<!--</script>-->
 <template>
-团队信息
+    团队信息
 </template>
\ No newline at end of file