点击编辑变完成

在这里插入图片描述
在这里插入图片描述

<template><div><button @click="dialogshow=true">添加部门</button><div>部门列表</div><el-table ref="multipleTable" :data="form" tooltip-effect="dark" style="width: 100%"><el-table-column type="selection" width="55"></el-table-column><el-table-column prop="id" label="id" width="120"></el-table-column><el-table-column prop="name" label="姓名" width="120"><template slot-scope="scope"><span v-if="!scope.row.isshow">{{scope.row.name}}</span><el-input v-else v-model="scope.row.name"></el-input></template></el-table-column><el-table-column label="操作"><template slot-scope="scope"><el-button size="mini" v-if="!scope.row.isshow" @click="handleEdit(scope.row)">编辑</el-button><el-button v-else size="mini" type="success" @click="over(scope.row)">完成</el-button><el-button size="mini" type="danger" @click="handleDelete(scope.row)">删除</el-button></template></el-table-column></el-table><el-pagination@size-change="handleSizeChange"@current-change="handleCurrentChange":current-page.sync="pagination.page":page-sizes="[10, 20, 30, 40]":page-size.sync="pagination.pageSize":total.sync="total"></el-pagination><el-dialog title="收货地址" :visible.sync="dialogshow"><el-form><el-form-item label="添加部门"><el-input v-model="name"></el-input></el-form-item></el-form><div slot="footer" class="dialog-footer"><el-button @click="dialogshow = false">取 消</el-button><el-button type="primary" @click="addsumbie">确 定</el-button></div></el-dialog></div>
</template><script>
import { deList, dedDel, adddep, depEdit } from "../api/account.api";export default {data() {return {form: [],pagination: {page: 1,pageSize: 5},id: "",name: "",dialogshow: false,ison: {}};},methods: {addsumbie() {console.log(this.name);adddep(this.name).then(res => {if (res.data.code === 0) {this.dialogshow = false;this.getlist();}});},// 请求员工列表方式getlist() {deList(this.pagination).then(res => {this.total = res.data.total;this.form = res.data.data.map(item => {item.isshow = false;return item;});});},//  编辑handleEdit(val) {console.log(this.form);val.isshow = true;},// 完成over(val) {this.ison = val;depEdit(this.ison).then(res => {if (res.data.code === 0) {val.isshow = false;this.getlist();}});},// 页面handleSizeChange(val) {this.pagination.pageSize = val;this.getlist();},handleCurrentChange(val) {this.pagination.page = val;this.getlist();},handleSelectionChange(val) {this.multipleSelection = val;},handleDelete(row) {this.id = row.id;dedDel(this.id).then(res => {if (res.data.code === 0) {getlist();}});}},created() {this.getlist();}// 编辑
};
</script><style lang="less" scoped>
</style>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/55133.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

解决https页面加载http资源报错

为什么会报错&#xff1f; HTTPS页面加载HTTP资源会报错的原因是出于安全性考虑。 HTTPS&#xff08;HyperText Transfer Protocol Secure&#xff09;是一种通过使用SSL/TLS加密通信来保护数据传输的协议&#xff0c;它确保了客户端和服务器之间的安全连接。 当HTTPS页面尝试加…

钉钉群消息推送

1. 添加钉钉群机器人 PC端登录&#xff08;当前版本手机端无法进行推送关键词设置&#xff09;&#xff0c;群设置--> 机器人 --> webhook进行安全设置复制webhook对应的url 2. 群消息推送 钉钉群消息支持纯文本和markdown类型 2.1 调用示例源码 import com.alibaba.…

Python小白学习:超级详细的字典介绍(字典的定义、存储、修改、遍历元素和嵌套)

目录 一、字典简介1.1 创建字典1.2 访问字典中的值1.3 添加键值对1.4 修改字典中的值实例 1.5 删除键值对1.6 由多个类似对象组成的字典1.7 使用get()访问值1.8 练习题 二、遍历字典2.1 遍历所有键值对实例 2.2 遍历字典中的所有键2.3 按照特定顺序遍历字典中的所有键2.4 遍历字…

简要记录下long long 乘 size_t类型是ull

以后注意用到 .size() 都给强制类型转换&#xff0c;力扣上 size_t 是unsigned long&#xff0c;跟longlong 想乘会变成 unsigned long long

Portraiture 4.0.3 for windows/Mac简体中文版(ps人像磨皮滤镜插件)

Imagenomic Portraiture系列插件作为PS磨皮美白必备插件&#xff0c;可以说是最强&#xff0c;今天它更新到了4.0.3版本。但是全网都没有汉化包&#xff0c;经过几个日夜汉化&#xff0c;终于汉化完成可能是全网首个Portraiture 4的汉化包&#xff0c;请大家体验&#xff0c;有…

ROS添加发布者和订阅者机制实现

一. ROS的节点和包 ✨Node&#xff1a; ROS的基本单位&#xff0c;实现某个功能的节点。比如实现超声波传感器就是一个节点&#xff0c;雷达传感器就可以是一个节点 ✨Package&#xff1a; 多个有联系的节点组成的单位&#xff0c;比如你要控制无人机姿态&#xff0c;可能需要…

在java中操作redis_Data

1.引入依赖 <dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-data-redis</artifactId></dependency> 2.配置Redis数据源 redis:host: ${sky.redis.host}port: ${sky.redis.port}password: ${sk…

GPIO实验

一、GPIO GPIO&#xff08;General-purpose input/output&#xff09;即通用型输入输出&#xff0c;GPIO可以控制连接在其之上的引脚实现信号的输入和输出 芯片的引脚与外部设备相连&#xff0c;从而实现与外部硬件设备的通讯、控制及信号采集等功能 LED实验步骤 最终目的&am…

无涯教程-Perl - do...while 语句函数

与 for 和 while 循环不同&#xff0c;它在循环的顶部测试循环条件&#xff0c;而 do ... while 循环在以下位置检查其条件:循环的底部。 do ... while 循环与while循环相似&#xff0c;除了保证do ... while循环至少执行一次。 do...while - 语法 do {statement(s); }while(…

Devops系统中jira平台迁移

需求:把aws中的devops系统迁移到华为云中,其中主要是jira系统中的数据迁移,主要方法为在华为云中建立一套 与aws相同的devops平台,再把数据库和文件系统中的数据迁移,最后进行测试。 主要涉及到的服务集群CCE、数据库mysql、弹性文件服务SFS、数据复制DRS、弹性负载均衡ELB。 迁…

pytorch学习——如何构建一个神经网络——以手写数字识别为例

目录 一.概念介绍 1.1神经网络核心组件 1.2神经网络结构示意图 1.3使用pytorch构建神经网络的主要工具 二、实现手写数字识别 2.1环境 2.2主要步骤 2.3神经网络结构 2.4准备数据 2.4.1导入模块 2.4.2定义一些超参数 2.4.3下载数据并对数据进行预处理 2.4.4可视化数…

华为QinQ技术的基本qinq和灵活qinq 2种配置案例

基本qinq配置&#xff1a; 运营商pe设备在收到同一个公司的ce发来的的包&#xff0c;统一打上同样的vlan &#xff0c;如上图&#xff0c;同一个家公司两边统一打上vlan 2&#xff0c;等于在原内网vlan 10或20过来的包再统一打上vlan 2的标签&#xff0c;这样传输就不会和其它…