概述
效果图
数据库设计
网站类型表
DROP TABLE IF EXISTS `website`;
CREATE TABLE `website` (`websiteId` int(11) NOT NULL AUTO_INCREMENT,`websiteImg` longtext,`websiteName` varchar(255) DEFAULT NULL,`websiteUrl` longtext,`websiteDesc` varchar(255) DEFAULT NULL,`websiteTypeId` int(11) DEFAULT NULL,PRIMARY KEY (`websiteId`)
) ENGINE=InnoDB AUTO_INCREMENT=33 DEFAULT CHARSET=utf8mb4;网站表
DROP TABLE IF EXISTS `website_type`;
CREATE TABLE `website_type` (`websiteTypeId` int(11) NOT NULL AUTO_INCREMENT,`websiteTypeName` varchar(255) DEFAULT NULL,PRIMARY KEY (`websiteTypeId`)
) ENGINE=InnoDB AUTO_INCREMENT=15 DEFAULT CHARSET=utf8mb4;实体类设计
WebsiteType
package jkw.pojo;import com.baomidou.mybatisplus.annotation.TableField;
import com.baomidou.mybatisplus.annotation.TableId;
import lombok.Data;import java.io.Serializable;
import java.util.List;/*** 网站类型*/
@Data
public class WebsiteType implements Serializable {@TableIdprivate Integer websiteTypeId;private String websiteTypeName;//类型名@TableField(exist = false)private List<Website> websites;
}Website
package jkw.pojo;import com.baomidou.mybatisplus.annotation.TableId;
import lombok.Data;import java.io.Serializable;/*** 网站*/
@Data
public class Website implements Serializable {@TableIdprivate Integer websiteId;private String websiteImg;//图片private String websiteName;//名称private String websiteUrl;//urlprivate String websiteDesc;//描述private Integer websiteTypeId;//类型
}Mapper层开发
WebsiteTypeMapper
package jkw.mapper;import com.baomidou.mybatisplus.core.mapper.BaseMapper;
import jkw.pojo.WebsiteType;public interface WebsiteTypeMapper extends BaseMapper<WebsiteType> {
}WebsiteMapper
package jkw.mapper;import com.baomidou.mybatisplus.core.mapper.BaseMapper;
import jkw.pojo.Website;public interface WebsiteMapper extends BaseMapper<Website> {
}Service层开发
WebsiteTypeService
package jkw.service;import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import jkw.pojo.WebsiteType;import java.util.List;public interface WebsiteTypeService {void add(WebsiteType WebsiteType);void update(WebsiteType WebsiteType);void delete(Integer id);WebsiteType findById(Integer id);List<WebsiteType> findAll();Page<WebsiteType> search(String search, int page, int size);
}WebsiteTypeServiceImpl
package jkw.service.impl;import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import jkw.mapper.WebsiteTypeMapper;
import jkw.pojo.WebsiteType;
import jkw.service.WebsiteTypeService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;import java.util.List;@Service
@Transactional
public class WebsiteTypeServiceImpl implements WebsiteTypeService {@Autowiredprivate WebsiteTypeMapper WebsiteTypeMapper;@Overridepublic void add(WebsiteType WebsiteType) {WebsiteTypeMapper.insert(WebsiteType);}@Overridepublic void update(WebsiteType WebsiteType) {WebsiteTypeMapper.updateById(WebsiteType);}@Overridepublic void delete(Integer id) {WebsiteTypeMapper.deleteById(id);}@Overridepublic WebsiteType findById(Integer id) {return WebsiteTypeMapper.selectById(id);}@Overridepublic List<WebsiteType> findAll() {return WebsiteTypeMapper.selectList(null);}@Overridepublic Page<WebsiteType> search(String search, int page, int size) {QueryWrapper queryWrapper = new QueryWrapper();if (search != null) {}return WebsiteTypeMapper.selectPage(new Page<>(page, size), queryWrapper);}
}WebsiteService
package jkw.service;import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import jkw.pojo.Website;import java.util.List;public interface WebsiteService {void add(Website Website);void update(Website Website);void delete(Integer id);Website findById(Integer id);List<Website> findAll();Page<Website> search(String search, int page, int size);//根据typeId查询List<Website> findAllByWebsiteTypeId(Integer id);
}WebsiteServiceImpl
package jkw.service.impl;import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import jkw.pojo.Website;
import jkw.service.WebsiteService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;import java.util.List;@Service
@Transactional
public class WebsiteServiceImpl implements WebsiteService {@Autowiredprivate jkw.mapper.WebsiteMapper WebsiteMapper;@Overridepublic void add(Website Website) {WebsiteMapper.insert(Website);}@Overridepublic void update(Website Website) {WebsiteMapper.updateById(Website);}@Overridepublic void delete(Integer id) {WebsiteMapper.deleteById(id);}@Overridepublic Website findById(Integer id) {return WebsiteMapper.selectById(id);}@Overridepublic List<Website> findAll() {return WebsiteMapper.selectList(null);}@Overridepublic Page<Website> search(String search, int page, int size) {QueryWrapper queryWrapper = new QueryWrapper();if (search != null) {}return WebsiteMapper.selectPage(new Page<>(page, size), queryWrapper);}@Overridepublic List<Website> findAllByWebsiteTypeId(Integer id) {QueryWrapper<Website> queryWrapper = new QueryWrapper<>();queryWrapper.eq("websiteTypeId", id);return WebsiteMapper.selectList(queryWrapper);}
}控制层开发
WebsiteTypeCon
package jkw.controller.back;import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import jkw.pojo.WebsiteType;
import jkw.service.WebsiteTypeService;
import jkw.vo.BaseResult;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.security.access.prepost.PreAuthorize;
import org.springframework.web.bind.annotation.*;import java.util.List;@RequestMapping("/back/websiteType")
@RestController
@CrossOrigin
public class WebsiteTypeCon {@Autowiredprivate WebsiteTypeService WebsiteTypeService;/*** 新增** @param WebsiteType* @return*/@PostMapping("/add")@PreAuthorize("hasAnyAuthority('/website/website')")public BaseResult add(WebsiteType WebsiteType) {WebsiteTypeService.add(WebsiteType);return BaseResult.ok();}/*** 修改** @param WebsiteType* @return*/@PostMapping("/update")@PreAuthorize("hasAnyAuthority('/website/website')")public BaseResult update(WebsiteType WebsiteType) {WebsiteTypeService.update(WebsiteType);return BaseResult.ok();}/*** 删除** @param websiteTypeId* @return*/@DeleteMapping("/delete")@PreAuthorize("hasAnyAuthority('/website/website')")public BaseResult delete(Integer websiteTypeId) {WebsiteTypeService.delete(websiteTypeId);return BaseResult.ok();}/*** 根据id查询** @param websiteTypeId* @return*/@GetMapping("/findById")@PreAuthorize("hasAnyAuthority('/website/website')")public BaseResult findById(Integer websiteTypeId) {WebsiteType WebsiteType = WebsiteTypeService.findById(websiteTypeId);return BaseResult.ok(WebsiteType);}/*** 查询所有** @return*/@GetMapping("/findAll")@PreAuthorize("hasAnyAuthority('/website/website')")public BaseResult findAll() {List<WebsiteType> all = WebsiteTypeService.findAll();return BaseResult.ok(all);}/*** 分页查询** @param page* @param size* @return*/@GetMapping("/search")@PreAuthorize("hasAnyAuthority('/website/website')")public BaseResult search(String search, int page, int size) {Page<WebsiteType> brandPage = WebsiteTypeService.search(search, page, size);return BaseResult.ok(brandPage);}
}WebsiteCon
package jkw.controller.back;import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import jkw.pojo.Website;
import jkw.vo.BaseResult;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.security.access.prepost.PreAuthorize;
import org.springframework.web.bind.annotation.*;import java.util.List;@RestController
@RequestMapping("/back/website")
@CrossOrigin
public class WebsiteCon {@Autowiredprivate jkw.service.WebsiteService WebsiteService;/*** 新增** @param Website* @return*/@PostMapping("/add")@PreAuthorize("hasAnyAuthority('/website/website')")public BaseResult add(Website Website) {WebsiteService.add(Website);return BaseResult.ok();}/*** 修改** @param Website* @return*/@PostMapping("/update")@PreAuthorize("hasAnyAuthority('/website/website')")public BaseResult update(Website Website) {WebsiteService.update(Website);return BaseResult.ok();}/*** 删除** @param websiteId* @return*/@DeleteMapping("/delete")@PreAuthorize("hasAnyAuthority('/website/website')")public BaseResult delete(Integer websiteId) {WebsiteService.delete(websiteId);return BaseResult.ok();}/*** 根据id查询** @param websiteId* @return*/@GetMapping("/findById")@PreAuthorize("hasAnyAuthority('/website/website')")public BaseResult findById(Integer websiteId) {Website Website = WebsiteService.findById(websiteId);return BaseResult.ok(Website);}/*** 查询所有** @return*/@GetMapping("/findAll")@PreAuthorize("hasAnyAuthority('/website/website')")public BaseResult findAll() {List<Website> all = WebsiteService.findAll();return BaseResult.ok(all);}/*** 分页查询** @param page* @param size* @return*/@GetMapping("/search")@PreAuthorize("hasAnyAuthority('/website/website')")public BaseResult search(String search, int page, int size) {Page<Website> brandPage = WebsiteService.search(search, page, size);return BaseResult.ok(brandPage);}
}FrontWebsiteCon
package jkw.controller.front;import jkw.pojo.Website;
import jkw.pojo.WebsiteType;
import jkw.service.WebsiteService;
import jkw.service.WebsiteTypeService;
import jkw.vo.BaseResult;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.CrossOrigin;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;import java.util.List;@RequestMapping("/front/website")
@RestController
@CrossOrigin
public class FrontWebsiteCon {@Autowiredprivate WebsiteService websiteService;@Autowiredprivate WebsiteTypeService websiteTypeService;/*** 查询所有网站类型以及对应的网站** @return*/@GetMapping("/findAllTypes")public BaseResult findAllTypeWithWebsite() {List<WebsiteType> websiteTypeList = websiteTypeService.findAll();for (WebsiteType websiteType : websiteTypeList) {List<Website> websiteList = websiteService.findAllByWebsiteTypeId(websiteType.getWebsiteTypeId());websiteType.setWebsites(websiteList);}return BaseResult.ok(websiteTypeList);}}后台ui设计
WebsiteType.vue
<template><div class="data-container"><!--添加 start--><div class="data-header"><el-input class="input" @keyup.enter="searchHandle" v-model="searchInfo" size="large"placeholder="请输入关键字"></el-input><el-button @click="searchHandle" class="button" size="large" type="primary" plain>搜索</el-button><el-button round @click="addHander" size="large" type="primary"><el-icon><DocumentAdd/></el-icon><span>新增</span></el-button></div><!--添加 end--><!--表格数据展示 start--><div class="data-table"><el-table :data="dataList.list" style="width: 550px;"><el-table-column show-overflow-tooltip label="类型名" prop="websiteTypeName" align="center" width="300"></el-table-column><el-table-column label="操作" align="center" width="220"><template #default="scope"><el-button size="small" type="primary" @click="handleEdit(scope.$index, scope.row)">编辑</el-button><el-button size="small" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button></template></el-table-column></el-table><!--分页 start--><div class="page"><el-pagination backgroundlayout="prev,pager,next,jumper":default-page-size="defaultPageSize":total="totalData"@current-change="currentChangeHaddler"></el-pagination></div><!--分页 end--></div><!--表格数据展示 end--><!--添加对话框 start--><el-dialog draggable destroy-on-close v-model="dialogAddVisible" title="添加" width="35%" center><el-form inline :model="addFormInfo" label-width="150px"><el-form-item label="类型名"><el-input v-model="addFormInfo.websiteTypeName"></el-input></el-form-item></el-form><template #footer><span class="dialog-footer"><el-button @click="dialogAddVisible = false">取消</el-button><el-button type="primary" @click="sureHandler">确定</el-button></span></template></el-dialog><!--添加对话框 end--><!--编辑对话框 start--><!--destroy-on-close:每次关闭对话框时直接销毁对话框，没有缓存--><el-dialogdraggabledestroy-on-closev-model="dialogEditorVisible"title="编辑"width="35%"center><el-form inline :model="editorFormInfo" label-width="150px"><el-form-item label="类型名"><el-input v-model="editorFormInfo.websiteTypeName"></el-input></el-form-item></el-form><template #footer><span class="dialog-footer"><el-button @click="dialogEditorVisible = false">取消</el-button><el-button type="primary" @click="sureEditorHandler">确定</el-button></span></template></el-dialog><!--编辑对话框 end--></div>
</template><script setup>
import axios from "../../api/index.js"
import {onMounted, reactive, ref} from "vue";
import {ElMessage} from "element-plus";
//初始化分页查询数据
const dataList = reactive({list: []
})
//初始化总条数
const totalData = ref(0)
//当前页
const currentPage = ref(1)
//初始化分页显示条数
const defaultPageSize = ref(10)
//搜索初始化状态
const searchInfo = ref("")
//添加添加对话框控制器
const dialogAddVisible = ref(false)
//初始化添加对话框状态
const addFormInfo = reactive({websiteTypeName: "",
})
//编辑对话框控制器
const dialogEditorVisible = ref(false)
//初始化编辑对话框状态
const editorFormInfo = reactive({websiteTypeId: '',websiteTypeName: "",
})
/*** 网路请求：分页查询* */
const http = (search, page, size) => {axios.website_type_search({search: search,page: page,size: size}).then(res => {if (res.data.code == 200) {dataList.list = res.data.data.recordstotalData.value = res.data.data.total} else {ElMessage.error(res.data.message)}})
}
onMounted(() => {http(searchInfo.value, currentPage.value, defaultPageSize.value)
})
/*** 分页*/
const currentChangeHaddler = (nowPage) => {http(searchInfo.value, nowPage, defaultPageSize.value)currentPage.value = nowPage
}
/*** 搜索按钮*/
const searchHandle = () => {http(searchInfo.value, currentPage.value, defaultPageSize.value)
}
/*** 添加对话框弹出事件*/
const addHander = () => {dialogAddVisible.value = true
}
/*** 添加对话框 确定事件*/
const sureHandler = () => {axios.website_type_add({websiteTypeName: addFormInfo.websiteTypeName,}).then(res => {if (res.data.code == 200) {dialogAddVisible.value = falsehttp(searchInfo.value, currentPage.value, defaultPageSize.value)} else {ElMessage.error(res.data.message)}})
}
/*** 编辑对话框 弹出事件* */
const handleEdit = (index, row) => {dialogEditorVisible.value = trueaxios.website_type_findById({websiteTypeId: row.websiteTypeId}).then(res => {if (res.data.code == 200) {editorFormInfo.websiteTypeId = res.data.data.websiteTypeId;editorFormInfo.websiteTypeName = res.data.data.websiteTypeName;} else {ElMessage.error(res.data.data.message)}})}
/*** 编辑对话框 确定事件*/
const sureEditorHandler = () => {axios.website_type_update({websiteTypeId: editorFormInfo.websiteTypeId,websiteTypeName: editorFormInfo.websiteTypeName,}).then(res => {if (res.data.code == 200) {dialogEditorVisible.value = falsehttp(searchInfo.value, currentPage.value, defaultPageSize.value)} else {ElMessage.error(res.data.message)}})
}
/**删除 */
const handleDelete = (index, row) => {ElMessageBox.confirm('确定删除么','删除',{confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning',}).then(() => {//确认删除axios.website_type_delete({websiteTypeId: row.websiteTypeId}).then(res => {if (res.data.code == 200) {ElMessage({type: 'success',message: "删除成功！！！",})//刷新http(searchInfo.value, currentPage.value, defaultPageSize.value)} else {ElMessage({type: 'error',message: res.data.message,})}})}).catch(error => {ElMessage({type: 'info',message: "取消删除",})})}
</script>
<style scoped>
.data-container {background: linear-gradient(left, rgb(89, 234, 233) 27%, rgb(131, 231, 218) 44%, rgb(69, 150, 216) 88%);background: -o-linear-gradient(left, rgb(89, 234, 233) 27%, rgb(131, 231, 218) 44%, rgb(69, 150, 216) 88%);background: -ms-linear-gradient(left, rgb(89, 234, 233) 27%, rgb(131, 231, 218) 44%, rgb(69, 150, 216) 88%);background: -moz-linear-gradient(left, rgb(89, 234, 233) 27%, rgb(131, 231, 218) 44%, rgb(69, 150, 216) 88%);background: -webkit-linear-gradient(left, rgb(89, 234, 233) 27%, rgb(131, 231, 218) 44%, rgb(69, 150, 216) 88%);height: 800px;
}.data-header {padding: 20px;
}.data-header .input {width: 300px;
}.data-table {padding: 20px;
}.page {position: fixed;right: 10px;bottom: 10px;
}
</style>Website.vue
<template><div class="data-container"><!--添加 start--><div class="data-header"><el-input class="input" @keyup.enter="searchHandle" v-model="searchInfo" size="large"placeholder="请输入关键字"></el-input><el-button @click="searchHandle" class="button" size="large" type="primary" plain>搜索</el-button><el-button round @click="addHander" size="large" type="primary"><el-icon><DocumentAdd/></el-icon><span>新增</span></el-button></div><!--添加 end--><!--表格数据展示 start--><div class="data-table"><el-table :data="dataList.list" style="width: 1100px;"><el-table-column label="图片" prop="websiteImg" align="center"><template #default="scope"><img :src="scope.row.websiteImg" style="height:60px"/></template></el-table-column><el-table-column label="类型" prop="websiteTypeId" align="center"><template #default="scope"><span v-for="item in typeList.list" :key="item.websiteTypeId">{{ scope.row.websiteTypeId == item.websiteTypeId ? item.websiteTypeName : '' }}</span></template></el-table-column><el-table-column show-overflow-tooltip label="名称" prop="websiteName" align="center"></el-table-column><el-table-column show-overflow-tooltip label="url" prop="websiteUrl" align="center"></el-table-column><el-table-column show-overflow-tooltip label="描述" prop="websiteDesc" align="center"></el-table-column><el-table-column label="操作" align="center" width="220"><template #default="scope"><el-button size="small" type="primary" @click="handleEdit(scope.$index, scope.row)">编辑</el-button><el-button size="small" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button></template></el-table-column></el-table><!--分页 start--><div class="page"><el-pagination backgroundlayout="prev,pager,next,jumper":default-page-size="defaultPageSize":total="totalData"@current-change="currentChangeHaddler"></el-pagination></div><!--分页 end--></div><!--表格数据展示 end--><!--添加对话框 start--><el-dialog draggable destroy-on-close v-model="dialogAddVisible" title="添加" width="35%" center><el-form inline :model="addFormInfo" label-width="150px"><el-form-item label="图片"><el-upload list-type="picture-card":action="uploadStore.fastdfsUploadUrl":on-success="onHeadImageAddSuccess":on-remove="onHeadImageAddRemove"><el-icon></el-icon></el-upload></el-form-item><el-form-item label="类型"><el-select v-model="addFormInfo.websiteTypeId" placeholder="请选择类型" size="large"><el-option v-for="item in typeList.list" :key="item.websiteTypeId":label="item.websiteTypeName":value="item.websiteTypeId"></el-option></el-select></el-form-item><el-form-item label="名称"><el-input v-model="addFormInfo.websiteName"></el-input></el-form-item><el-form-item label="url"><el-input v-model="addFormInfo.websiteUrl"></el-input></el-form-item><el-form-item label="描述"><el-input type="textarea" rows="6" style="width: 200px" v-model="addFormInfo.websiteDesc"></el-input></el-form-item></el-form><template #footer><span class="dialog-footer"><el-button @click="dialogAddVisible = false">取消</el-button><el-button type="primary" @click="sureHandler">确定</el-button></span></template></el-dialog><!--添加对话框 end--><!--编辑对话框 start--><!--destroy-on-close:每次关闭对话框时直接销毁对话框，没有缓存--><el-dialogdraggabledestroy-on-closev-model="dialogEditorVisible"title="编辑"width="35%"center><el-form inline :model="editorFormInfo" label-width="150px"><el-form-item label="头图"><el-upload list-type="picture-card":action="uploadStore.fastdfsUploadUrl":on-success="onHeadImageEditSuccess"><el-image :src="editorFormInfo.websiteImg"/></el-upload></el-form-item><el-form-item label="类型"><el-select v-model="editorFormInfo.websiteTypeId" placeholder="请选择类型" size="large"><el-option v-for="item in typeList.list" :key="item.websiteTypeId":label="item.websiteTypeName":value="item.websiteTypeId"></el-option></el-select></el-form-item><el-form-item label="名称"><el-input v-model="editorFormInfo.websiteName"></el-input></el-form-item><el-form-item label="url"><el-input v-model="editorFormInfo.websiteUrl"></el-input></el-form-item><el-form-item label="描述"><el-input type="textarea" rows="6" style="width: 200px" v-model="editorFormInfo.websiteDesc"></el-input></el-form-item></el-form><template #footer><span class="dialog-footer"><el-button @click="dialogEditorVisible = false">取消</el-button><el-button type="primary" @click="sureEditorHandler">确定</el-button></span></template></el-dialog><!--编辑对话框 end--></div>
</template><script setup>
import axios from "../../api/index.js"
import {onMounted, reactive, ref} from "vue";
import {ElMessage} from "element-plus";
import {useUploadStore} from "../../stores/uploadStore.js"const uploadStore = useUploadStore()
//初始化分页查询数据
const dataList = reactive({list: []
})
//初始化类型列表
const typeList = reactive({list: []
})
//初始化总条数
const totalData = ref(0)
//当前页
const currentPage = ref(1)
//初始化分页显示条数
const defaultPageSize = ref(5)
//搜索初始化状态
const searchInfo = ref("")
//添加添加对话框控制器
const dialogAddVisible = ref(false)
//初始化添加对话框状态
const addFormInfo = reactive({websiteImg: "",websiteName: "",websiteUrl: "",websiteDesc: "",websiteTypeId: ''
})
//编辑对话框控制器
const dialogEditorVisible = ref(false)
//初始化编辑对话框状态
const editorFormInfo = reactive({websiteId: '',websiteImg: "",websiteName: "",websiteUrl: "",websiteDesc: "",websiteTypeId: ''
})
/*** 网路请求：分页查询* */
const http = (search, page, size) => {axios.website_search({search: search,page: page,size: size}).then(res => {if (res.data.code == 200) {dataList.list = res.data.data.recordstotalData.value = res.data.data.total} else {ElMessage.error(res.data.message)}})
}
onMounted(() => {http(searchInfo.value, currentPage.value, defaultPageSize.value)axios.website_type_findAll().then(res => {if (res.data.code == 200) {typeList.list = res.data.data}})
})
/*** 分页*/
const currentChangeHaddler = (nowPage) => {http(searchInfo.value, nowPage, defaultPageSize.value)currentPage.value = nowPage
}
/*** 搜索按钮*/
const searchHandle = () => {http(searchInfo.value, currentPage.value, defaultPageSize.value)
}
/*** 添加对话框弹出事件*/
const addHander = () => {dialogAddVisible.value = true
}
//上传成功的钩子
const onHeadImageAddSuccess = (response, uploadFile) => {addFormInfo.websiteImg = response.dataElMessage.success("上传成功")
}
//移除图片的钩子
const onHeadImageAddRemove = (response, uploadFile) => {axios.fastdfs_delete({filePath: addFormInfo.websiteImg}).then(res => {if (res.data.code == 200) {ElMessage.success("移除成功")}})
}
/*** 添加对话框 确定事件*/
const sureHandler = () => {axios.website_add({websiteImg: addFormInfo.websiteImg,websiteName: addFormInfo.websiteName,websiteUrl: addFormInfo.websiteUrl,websiteDesc: addFormInfo.websiteDesc,websiteTypeId: addFormInfo.websiteTypeId,}).then(res => {if (res.data.code == 200) {dialogAddVisible.value = falsehttp(searchInfo.value, currentPage.value, defaultPageSize.value)} else {ElMessage.error(res.data.message)}})
}
/*** 编辑对话框 弹出事件* */
const handleEdit = (index, row) => {dialogEditorVisible.value = trueaxios.website_findById({websiteId: row.websiteId}).then(res => {if (res.data.code == 200) {editorFormInfo.websiteId = res.data.data.websiteId;editorFormInfo.websiteImg = res.data.data.websiteImg;editorFormInfo.websiteName = res.data.data.websiteName;editorFormInfo.websiteUrl = res.data.data.websiteUrl;editorFormInfo.websiteDesc = res.data.data.websiteDesc;editorFormInfo.websiteTypeId = res.data.data.websiteTypeId;} else {ElMessage.error(res.data.data.message)}})}
/*** 编辑对话框 头图修改时图片上传成功事件*///上传成功的钩子
const onHeadImageEditSuccess = (response, uploadFile) => {//删除以前图片axios.fastdfs_delete({filePath: editorFormInfo.websiteImg}).then(res => {if (res.data.code == 200) {ElMessage.success("fastdfs移除原图片成功")}})//替换为现在的图片editorFormInfo.websiteImg = response.dataElMessage.success("上传成功")}
/*** 编辑对话框 确定事件*/
const sureEditorHandler = () => {axios.website_update({websiteId: editorFormInfo.websiteId,websiteImg: editorFormInfo.websiteImg,websiteName: editorFormInfo.websiteName,websiteUrl: editorFormInfo.websiteUrl,websiteDesc: editorFormInfo.websiteDesc,websiteTypeId: editorFormInfo.websiteTypeId,}).then(res => {if (res.data.code == 200) {dialogEditorVisible.value = falsehttp(searchInfo.value, currentPage.value, defaultPageSize.value)} else {ElMessage.error(res.data.message)}})
}
/**删除 */
const handleDelete = (index, row) => {ElMessageBox.confirm('确定删除么','删除',{confirmButtonText: '确定',cancelButtonText: '取消',type: 'warning',}).then(() => {//确认删除axios.website_delete({websiteId: row.websiteId}).then(res => {if (res.data.code == 200) {ElMessage({type: 'success',message: "删除成功！！！",})//刷新http(searchInfo.value, currentPage.value, defaultPageSize.value)} else {ElMessage({type: 'error',message: res.data.message,})}})}).catch(error => {ElMessage({type: 'info',message: "取消删除",})})}
</script>
<style scoped>
.data-container {background: linear-gradient(left, rgb(89, 234, 233) 27%, rgb(131, 231, 218) 44%, rgb(69, 150, 216) 88%);background: -o-linear-gradient(left, rgb(89, 234, 233) 27%, rgb(131, 231, 218) 44%, rgb(69, 150, 216) 88%);background: -ms-linear-gradient(left, rgb(89, 234, 233) 27%, rgb(131, 231, 218) 44%, rgb(69, 150, 216) 88%);background: -moz-linear-gradient(left, rgb(89, 234, 233) 27%, rgb(131, 231, 218) 44%, rgb(69, 150, 216) 88%);background: -webkit-linear-gradient(left, rgb(89, 234, 233) 27%, rgb(131, 231, 218) 44%, rgb(69, 150, 216) 88%);height: 800px;
}.data-header {padding: 20px;
}.data-header .input {width: 300px;
}.data-table {padding: 20px;
}.page {position: fixed;right: 10px;bottom: 10px;
}
</style>
![[RF学习记录][参数读取]从yaml文件读取参数变量](https://img-blog.csdnimg.cn/301c738fb90e43fda86a3464ddf05ec6.png)
