vue.draggable拖拽——岗位切换如何判断?

 有一个业务场景:把一个单位的某个岗位的人,从某某市A岗位调离出来后,又拖拽回去,如果是回到某某市A岗位,则没有变化,若是换了岗位,则会把色块变成红色,表示岗位的变化。

方法一:首先思考的是拿到拖拽这个人的index下标,(但是分页的话还要单独的处理)再判断拖拽回去的下标,如果下标一志则表示回到了原岗位。但是会有一个弊端,若是我一次性拖拽了多个人,如何处理他原来的下标?可以通过岗位ID,也就是拖拽的时候,把岗位ID带到拖拽的数据里面,拖回去的时候对岗位ID进行判断。

方法二:在我们点击查看详情的时候,就把人员ID存在一个数组里面。 定义一个cValue.rootCardersId=[],在遍历的时候,把人员IDpush进数组。

  arr.forEach(cValue => {cValue.rootCardersId=[]cValue.SimuCadres.forEach((ccValue, index) => {ccValue.isActive = false;ccValue._index = index;ccValue.isRoot = true;cValue.rootCardersId.push(ccValue.cid)});});

 在拖拽里面写一个逻辑,遍历拖拽行的干部ID数组,进行一个判断,如果id与拖入的干部id一样的话,就给拖入的这个人一个isRoot。

   // 拖入的人来自本岗位,则为true不显示红色底色,不为本岗位则显示红色let isExict=false;draggedItem.rootCardersId.map(item=>{if(item==e.item._underlying_vm_.CadreID){isExict=true;}})e.item._underlying_vm_.isRoot=isExict?true:false

通过isROOT来动态绑定一个class: 

<span :class="{ 'gangweibiandong': !citem.isRoot }">{{ citem.xm  }}</span>.gangweibiandong{background: rgb(182, 66, 74);color: #fff;}

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

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

相关文章

Maven 介绍

文章目录 什么是 maven为什么要选择mavenmaven 仓库什么是maven中央仓库什么是maven本地仓库 idea如何创建出maven项目如何引入第三方库依赖配置国内源 下载 Maven Helper 插件查看各个项目之间的依赖关系 什么是 maven Maven是 Apache 下的一个纯 Java 开发的开源项目&#x…

DDD 系统间的七种关系梳理与实践

系统间的七种关系 本节将根据耦合度从高到低逐一探讨这些关系。耦合度高有时并不是坏事&#xff0c;它能够让团队内部的系统更加内聚&#xff0c;而不是无法整合的碎块。我们应该根据具体情况进行选择。 因为系统间关系往往也是组织架构的反映&#xff0c;此处每种关系除了描…

超卓航科聚国内外专家学者,共推冷喷涂技术的发展与应用

11月24日——26日&#xff0c;冷喷涂技术及其在增材制造中的应用专题会在襄阳召开&#xff0c;来自国内外200多名科技工作者齐聚一堂&#xff0c;共同交流冷喷涂技术的研究与应用。 本次专题研讨会由中国机械工程学会表面工程分会主办&#xff0c;湖北超卓航空科技股份有限公司…

【EasyExcel实践】导出多个sheet到多个excel文件,并压缩到一个zip文件

文章目录 前言正文一、项目依赖二、封装表格实体和Sheet实体2.1 表格实体2.2 Sheet实体 三、核心实现3.1 核心实现之导出为输出流3.2 web导出3.3 导出为字节数组 四、调试4.1 构建调试用的实体类4.2 控制器调用4.3 测试结果 五、注册大数转换器&#xff0c;长度大于15时&#x…

webGL开发虚拟实验室

开发虚拟实验室是一个具有挑战性但也非常有趣和有价值的任务。通过 WebGL&#xff0c;你可以创建交互式、沉浸式的虚拟实验室&#xff0c;使用户能够进行实验和学习。以下是一些步骤和关键考虑因素&#xff0c;帮助你开始开发虚拟实验室&#xff0c;希望对大家有所帮助。北京木…

Unity 通过代码控制Texture进行缩放

在实际应用开发中&#xff0c;有时候需要通过代码对Texture进行缩放。 有两个方法&#xff0c;一个是通过控制宽高进行缩放&#xff0c;另一个是通过比例值进行等比例缩放。 1、控制宽高的方法&#xff1a; /// <summary>/// 纹理缩放方法一&#xff0c;指定宽高/// &…

游戏开发原画的设计方法

游戏原画设计是游戏开发中至关重要的一环&#xff0c;因为它直接影响到游戏的视觉吸引力和用户体验。以下是一些常见的游戏原画设计方法&#xff0c;希望对大家有所帮助。北京木奇移动技术有限公司&#xff0c;专业的软件外包开发公司&#xff0c;欢迎交流合作。 理解游戏概念&…

如何在Python中操作Redis数据库

目录 一、安装redis-py库 二、连接Redis数据库 三、执行操作 1、设置和获取键值对 2、删除键值对 3、获取列表数据 四、处理数据 1、使用哈希表&#xff08;Hash&#xff09;处理关联数据 2、使用列表&#xff08;List&#xff09;处理有序数据 3、使用集合&#xff…

XIAO ESP32S3之AI应用

一、XIAO ESP32S3 AI应用示例 包含 ChatGPT语音助手、关键字识别等 英文:https://wiki.seeedstudio.com/xiao_esp32s3_speech2chatgpt/ 中文:SenseCraft 模型助手部署 | Seeed Studio Wiki 二、XIAO开发板TinyML项目展示 各种XIAO开发板基于Tiny ML的演示项目:XIAO 系列教…

链接共享平台LinkStack

什么是 LinkStack &#xff1f; LinkStack 是一个独特的平台&#xff0c;为在线管理和共享链接提供了高效的解决方案。平台提供了一个类似于 Linktree 的网站&#xff0c;它可以让用户克服社交媒体平台上只能添加一个链接的限制。借助 LinkStack&#xff0c;用户可以轻松链接到…

Jetson AGX XAVIER刷机时提示invalid_request - Authorization flow not allowed

我下的版本是sdkmanager_1.9.2-10899_amd64.deb&#xff0c;安装后后直接在terminal输入 sdkmanager&#xff0c;出来后提示登录有问题&#xff0c;跳到浏览器链接 http://localhost:8080/?error_descriptionAuthorizationflownotallowed&statehttp://localhost:41369&a…

shell_exec 和 exec区别

shell_exec 和 exec 都是用于在 PHP 中执行系统命令的函数&#xff0c;但它们之间有一些区别。 返回值类型&#xff1a;shell_exec 函数返回命令的输出结果作为字符串&#xff0c;而 exec 函数将输出结果存储在数组中。 输出结果&#xff1a;shell_exec 函数返回命令的完整输出…

录音模块:WT588FM01高性能录音语音芯片IC,功能丰富,音质卓越,满足多样化需求

在音频市场日益繁荣的今天&#xff0c;用户对于录音模块的需求也日益多样化。唯创知音针对这一市场趋势&#xff0c;推出了高性能录音语音芯片模块WT588FM01。凭借其远距离录音、优质音质以及多样化的功能&#xff0c;它成为了众多电子产品中的首选之一。 WT588FM01是深圳唯创…

8 有损压缩的.jpg图片文件格式详解,解封装拆包

有损压缩的.jpg文件 作者将狼才鲸创建日期2023-11-28 1&#xff09;简述 JPEG文件描述 JPEG协议格式分为JPEG、渐进式JPEG&#xff08;图片先显示一部分再显示全部&#xff09;、JPEG2000&#xff08;压缩品质更好&#xff0c;压缩率更高&#xff09;压缩模式&#xff1a;顺序…

苹果mac屏幕投屏镜像工具AirServer2024

airserver 是什么软件&#xff1f;AirServer 是一款 Airplay Mac屏幕镜像应用&#xff0c;AirServer可以通过 mac 实时接收iPhone、iPad以及Android设备的实时屏幕画面。AirServer 可以将一个简单的大屏幕或投影仪变成一个通用的屏幕镜像接收器。在您的大屏幕上启用 AirServer …

Databend 开源周报第 121 期

Databend 是一款现代云数仓。专为弹性和高效设计&#xff0c;为您的大规模分析需求保驾护航。自由且开源。即刻体验云服务&#xff1a;https://app.databend.cn 。 Whats On In Databend 探索 Databend 本周新进展&#xff0c;遇到更贴近你心意的 Databend 。 支持追加流 Da…

11月27日,每日信息差

今天是2023年11月27日&#xff0c;以下是为您准备的20条信息差 第一、阿里达摩院AI突破胰腺癌早筛难题。通过平扫CT&#xff0c;在2万多真实世界连续病人群体中发现了31例临床漏诊病变&#xff0c;其中2例早期胰腺癌病患已完成手术治愈 第二、丰田汽车将于11月29日恢复丰田车…

python之pyqt专栏7-信号与槽3

在上一篇文章中python之pyqt专栏6-信号与槽2-CSDN博客中&#xff0c;我们可以了解到对象可以使用内置信号&#xff0c;这些信号来自于类定义或者继承过来的。我们可以对这些信号可以通过connect连接槽函数。 需求 现在有一个需求&#xff0c;有两个UI界面“untitled.ui”和“u…

深度解析异常值在数据分析中的重要性与应对策略

写在前面 在数据分析的过程中&#xff0c;异常值的存在常常是一个需要认真对待的问题。异常值可能影响分析的准确性&#xff0c;导致误导性的结论。本文将深入探讨以下异常值的应对策略&#xff0c;旨在为数据科学家们提供全面、易读、严谨的一些建议。 1.什么是异常值 异常…

Linux 安装 Minio 配置 HTTPS

安装 创建目录 [roott2 local]# mkdir minio [roott2 local]# cd minio [roott2 minio]# mkdir data下载 [roott2 minio]# wget https://dl.min.io/server/minio/release/linux-amd64/minio [roott2 minio]# chmod x minio # 赋权设置账号密码 minio 默认账号密码为 minio…