5.1 iHRM人力资源 - 员工管理

news2025/10/31 8:43:05

iHRM人力资源 - 员工管理 - 左右侧主体展示

文章目录

  • iHRM人力资源 - 员工管理 - 左右侧主体展示
  • 一、页面主体结构
  • 二、页面左树加载
    • 2.1 加载左树数据
    • 2.2 记录树的切换节点
  • 三、右侧员工列表
    • 3.1 列表结构
    • 3.2 员工数据获取
    • 3.3 头像和聘用形式
    • 3.4 数据分页
    • 3.5 员工模糊搜索

一、页面主体结构

最终效果图如下所示

典型的，左边是树，右边是表的页面结构

image-20240331223459878

结构如下图所示

代码

image-20240331225859741

下面的代码其实就是将页面分成了左右两个部分

<template>
  <div class="container">
    <div class="app-container">
      <div class="left">
        <el-input style="margin-bottom:10px" type="text" prefix-icon="el-icon-search" size="small" placeholder="输入员工姓名全员搜索" />
        <!-- 树形组件 -->
      </div>
      <div class="right">
        <el-row class="opeate-tools" type="flex" justify="end">
          <el-button size="mini" type="primary">添加员工</el-button>
          <el-button size="mini">excel导入</el-button>
          <el-button size="mini">excel导出</el-button>
        </el-row>
        <!-- 表格组件 -->
        <!-- 分页 -->
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: 'Employee'
}
</script>

<style lang="scss" scoped>
.app-container {
  background: #fff;
  display: flex;
  .left {
    width: 280px;
    padding: 20px;
    border-right: 1px solid #eaeef4;
  }
  .right {
    flex: 1;
    padding: 20px;
    .opeate-tools {
      margin:10px ;
    }
    .username {
      height: 30px;
      width: 30px;
      line-height: 30px;
      text-align: center;
      border-radius: 50%;
      color: #fff;
      background: #04C9BE;
      font-size: 12px;
      display:inline-block;
    }
  }
}

</style>

效果图如下所示

image-20240331224220623

二、页面左树加载

效果图如下所示

image-20240331224608213

流程如下图所示

image-20240331225226378

2.1 加载左树数据

我们之前写过获取组织架构列表的接口

image-20240331225805057

/**
 *  获取组织架构数据
 */
export function getDepartment() {
  // request发送登录请求，会得到一个promise结果并将其返回
  return request({
    // 请求地址
    url: '/company/department',
    // 请求方式
    method: 'GET'
    // 请求参数,但是这里没有请求参数
    // data: Data
    // 在ES6中上面data: Data可以简写为 data
  })
}

左侧树页面

      <div class="left">
        <el-input style="margin-bottom:10px" type="text" prefix-icon="el-icon-search" size="small"
                  placeholder="输入员工姓名全员搜索"
        />
        <!-- 树形组件 -->
        <!-- :default-expand-all="true" 展开所有节点-->
        <!-- highlight-current高亮所选节点-->
        <el-tree :data="depts" :props="defaultProps" :default-expand-all="true" :highlight-current="true"></el-tree>
      </div>

数据

data() {
  return {
    // 组织架构数据
    depts: [],
    // 树形结构中的数据
    defaultProps: {
      label: 'name',
      children: 'children'
    }
  }
}

方法

created() {
  this.getDepartment()
},
methods: {
  // 获取组织架构数据
  async getDepartment() {
    // 递归方法将列表转换成树形结构
    this.depts = transListToTreeData(await getDepartment(), 0)
  }
}

工具类方法

/**
 * 列表数据转树形数据
 * rootValue: 其实就是pid（父id）
 */
export function transListToTreeData(list, rootValue) {
  const arr = []
  list.forEach(item => {
    if (item.pid === rootValue) {
      // 找到了匹配的节点
      arr.push(item)
      // 当前节点的id和当前节点的字节点的pid相等
      // 下面的方法其实就是找当前节点的子节点
      const children = transListToTreeData(list, item.id) // 找到的节点的子节点
      item.children = children // 将子节点赋值给当前节点
      // 我们先push再赋值childern也没关系，因为是一个对象，地址是一样的
    }
  })
  return arr
}

2.2 记录树的切换节点

默认选中“传智教育”节点，并且会在右侧展示“传智教育”下面所有员工的数据

当我们切换左侧节点的时候，右侧展示的员工数据也会发生改变

这就是左树右表的一个联动效果

image-20240401202750944

实现思路

其实也很简单

当我们获取获取数据的时候，找到“传智教育”节点，并且把这个节点记录下来，并且选中这个节点，然后查询“传智教育”下的员工数据

image-20240401203243392

  1. 获取首个节点并记录
data() {
  return {
    // 组织架构数据
    depts: [],
    // 存储查询参数
    queryParams: {
      // 当前选中节点id
      departmentId: null
    }
      ........
  }
},
methods: {
  // 获取组织架构数据
  async getDepartment() {
    // 递归方法将列表转换成树形结构
    this.depts = transListToTreeData(await getDepartment(), 0)
    // 将树形结构的首节点id赋值给departmentId
    this.queryParams.departmentId = this.depts[0].id
  }
}
  1. 选中首节点

树结构，多了 ref=“deptTree” node-key="id"方法

我们需要调用el-tree组件中的setCurrentKey方法来选中某个节点

<!-- 树形组件 -->
<!-- :default-expand-all="true" 展开所有节点-->
<!-- highlight-current高亮所选节点-->
<!--  node-key树形，每个树节点用来作为唯一标识的属性，是唯一的-->
<el-tree :data="depts" :props="defaultProps"
         :default-expand-all="true" :highlight-current="true"
         ref="deptTree" node-key="id"
></el-tree>

方法

// 获取组织架构数据
async getDepartment() {
  // 递归方法将列表转换成树形结构
  this.depts = transListToTreeData(await getDepartment(), 0)
  // 将树形结构的首节点id赋值给departmentId
  this.queryParams.departmentId = this.depts[0].id
  // 选中首个节点
  // this.$refs.deptTree.setCurrentKey(this.queryParams.departmentId) 在这里执行是不合适的
  // 这个地方涉及到一个同步异步的问题
  // 树组件的渲染是异步的，我们需要等渲染完毕后再选中首个节点
  this.$nextTick(() => {
    // 此时意味着树的渲染已经完毕了
    this.$refs.deptTree.setCurrentKey(this.queryParams.departmentId)
  })
}
  1. 选中节点的时候记录节点

我们切换节点的时候怎么记录节点呢？

可以看一下element-ui，看看树形组件是怎么去监听节点切换事件的

下面两个事件都是当前节点变化时触发，用哪个都行

image-20240401210253188

image-20240401210309374

事件

<!--树形组件-->
<!--:default-expand-all="true" 展开所有节点-->
<!--highlight-current高亮所选节点-->
<!--node-key树形，每个树节点用来作为唯一标识的属性，是唯一的-->
<!--@current-change监听，当前节点变化时触发此事件-->
<el-tree
  ref="deptTree"
  node-key="id"
  :data="depts"
  :props="defaultProps"
  :default-expand-all="true"
  :highlight-current="true"
  @current-change="selectNode"
></el-tree>

方法

// 参数1：当前节点数据；
selectNode(node) {
  // 当前选中节点的id
  this.queryParams.departmentId = node.id
}

三、右侧员工列表

实现右侧员工列表

如下图所示

image-20240401211032997

3.1 列表结构

      <div class="right">
        <el-row class="opeate-tools" type="flex" justify="end">
          <el-button size="mini" type="primary">添加员工</el-button>
          <el-button size="mini">excel导入</el-button>
          <el-button size="mini">excel导出</el-button>
        </el-row>
        <!-- 表格组件 -->
        <el-table>
          <!--表格中放列-->
          <!--将头像居中操作-->
          <el-table-column label="头像" align="center"></el-table-column>
          <el-table-column label="姓名"></el-table-column>
          <!--sortable表示这一列可以排序来查看-->
          <el-table-column label="手机号" sortable></el-table-column>
          <el-table-column label="工号" sortable></el-table-column>
          <el-table-column label="聘用形式"></el-table-column>
          <el-table-column label="部门"></el-table-column>
          <el-table-column label="入职时间" sortable></el-table-column>
          <el-table-column label="操作" width="280px">
            <template>
              <!--type="text"表示按钮是链接的形式-->
              <el-button size="mini" type="text">查看</el-button>
              <el-button size="mini" type="text">角色</el-button>
              <el-button size="mini" type="text">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <!--type="flex" justify="end"分页设置在尾部-->
        <!--align="middle"表示水平居中-->
        <el-row type="flex" justify="end" align="middle" style="height:60px">
          <!--分页-->
           <el-pagination layout="total,prev,pager,next" :total="1000"></el-pagination>
        </el-row>
      </div>

页面效果

image-20240401224754532

3.2 员工数据获取

首次加载的时候获取员工数据，切换部门的时候加载此部门中员工数据

image-20240401224943565

api请求

/**
 * 获取员工列表
 */
export function getEmployeeList(params) {
  return request({
    url: '/sys/user',
    params: params // 地址参数，查询参数
  })
}

页面

<!-- 表格组件 -->
<!--使用data绑定数据-->
<el-table :data="list">
  <!--表格中放列-->
  <!--将头像居中操作-->
  <el-table-column prop="staffPhoto" label="头像" align="center"></el-table-column>
  <el-table-column prop="username" label="姓名"></el-table-column>
  <!--sortable表示这一列可以排序来查看-->
  <el-table-column prop="mobile" label="手机号" sortable></el-table-column>
  <el-table-column prop="workNumber" label="工号" sortable></el-table-column>
  <el-table-column prop="formOfEmployment" label="聘用形式"></el-table-column>
  <el-table-column prop="departmentName" label="部门"></el-table-column>
  <el-table-column prop="timeOfEntry" label="入职时间" sortable></el-table-column>
  <el-table-column label="操作" width="280px">
    <template>
      <!--type="text"表示按钮是链接的形式-->
      <el-button size="mini" type="text">查看</el-button>
      <el-button size="mini" type="text">角色</el-button>
      <el-button size="mini" type="text">删除</el-button>
    </template>
  </el-table-column>
</el-table>

方法

methods: {
  // 获取组织架构数据
  async getDepartment() {
    // 递归方法将列表转换成树形结构
    this.depts = transListToTreeData(await getDepartment(), 0)
    // 将树形结构的首节点id赋值给departmentId
    this.queryParams.departmentId = this.depts[0].id
    // 选中首个节点
    // this.$refs.deptTree.setCurrentKey(this.queryParams.departmentId) 在这里执行是不合适的
    // 这个地方涉及到一个同步异步的问题
    // 树组件的渲染是异步的，我们需要等渲染完毕后再选中首个节点
    this.$nextTick(() => {
      // 此时意味着树的渲染已经完毕了
      this.$refs.deptTree.setCurrentKey(this.queryParams.departmentId)
    })
    // 这个时候已经记录了id，根据部门的id获取部门人员
    this.getEmployeeList()
  },
  // 参数1：当前节点数据
  selectNode(node) {
    // 当前选中节点的id
    this.queryParams.departmentId = node.id
    // 这个时候已经记录了id，根据部门的id获取部门人员
    this.getEmployeeList()
  },
  async getEmployeeList() {
    // 解构出row数据
    const { rows } = await getEmployeeList(this.queryParams)
    this.list = rows
  }
}

效果

但是我们的头像列和聘用形式列的值不对劲，之后改一下

image-20240401231141419

3.3 头像和聘用形式

要实现下图的效果

image-20240401231323720

内容

image-20240401231422658

  1. 处理头像
<el-table-column prop="staffPhoto" label="头像" align="center">
  <!--自定义插槽-->
  <template v-slot="{row}">
    <!--头像组件-->
    <!--当此用户有头像的时候才显示此组件-->
    <el-avatar v-if="row.staffPhoto" :src="row.staffPhoto" :size="30"></el-avatar>
    <!--当没有头像的时候，就是用户名中的第一次字当头像-->
    <span v-else class="username">{{ row.username.charAt(0) }}</span>
  </template>
</el-table-column>

样式

<style lang="scss" scoped>
.app-container {
  background: #fff;
  display: flex;

  .left {
    width: 280px;
    padding: 20px;
    border-right: 1px solid #eaeef4;
  }

  .right {
    flex: 1;
    padding: 20px;

    .opeate-tools {
      margin: 10px;
    }

    .username {
      height: 30px;
      width: 30px;
      line-height: 30px;
      text-align: center;
      border-radius: 50%;
      color: #fff;
      background: #04C9BE;
      font-size: 12px;
      display: inline-block;
    }
  }
}

</style>

效果

image-20240401232101533

  1. 处理聘用形式
<el-table-column prop="formOfEmployment" label="聘用形式">
  <template v-slot="{row}">
    <span v-if="row.formOfEmployment===1">正式</span>
    <span v-else-if="row.formOfEmployment===2">非正式</span>
    <span v-else>无</span>
  </template>
</el-table-column>

效果

image-20240401232358599

3.4 数据分页

实现员工数据分页

image-20240407231503513

image-20240407232216522

  1. 分页总数
data() {
  return {
      .....
    // 记录当前查询的员工总数
    total: 0
  }
}

初始化总数

async getEmployeeList() {
  // 解构出row数据
  const { rows, total } = await getEmployeeList(this.queryParams)
  this.list = rows
  this.total = total
}

分页组件

<!--type="flex" justify="end"分页设置在尾部-->
<!--align="middle"表示水平居中-->
<el-row type="flex" justify="end" align="middle" style="height:60px">
  <!--分页-->
  <el-pagination layout="total,prev,pager,next" :total="total">
  </el-pagination>
</el-row>
  1. 配置每页的条数和当前页码

查询参数

// 存储查询参数
queryParams: {
  // 当前选中节点id
  departmentId: null,
  // 当前页码
  page: 1,
  // 每页有多少数据
  pagesize: 10
},

绑定到分页组件上

<!--align="middle"表示水平居中-->
<el-row type="flex" justify="end" align="middle" style="height:60px">
  <!--分页-->
  <el-pagination
    layout="total,prev,pager,next"
    :total="total"
    :current-page="queryParams.page"
    :page-size="queryParams.pagesize"
  >
  </el-pagination>
</el-row>
  1. 监听切换页码的事件
<!--分页-->
<el-pagination
  layout="total,prev,pager,next"
  :total="total"
  :current-page="queryParams.page"
  :page-size="queryParams.pagesize"
  @current-change="changePage"
>

实现方法

async getEmployeeList() {
  // 解构出row数据
  const { rows, total } = await getEmployeeList(this.queryParams)
  this.list = rows
  this.total = total
},
// 切换页码的事件
// 参数回调1：当前页，参数
changePage(newPage) {
  this.queryParams.page = newPage
  // 重新查询员工
  this.getEmployeeList()
}
  1. 切换部门的时候，要把queryParams里面的page及pagesize充值
// 参数1：当前节点数据
selectNode(node) {
  // 将页码设置为第一页
  this.queryParams.page = 1
  // 当前选中节点的id
  this.queryParams.departmentId = node.id
  // 这个时候已经记录了id，根据部门的id获取部门人员
  this.getEmployeeList()
},
  1. 将"Total"英文换成中文

image-20240407234035509

首先要打开入口文件，将下面第二个参数去掉即可

image-20240407234156408

如下图所示

// 全局注册Element-ui组件
Vue.use(ElementUI)
// 如果想要中文版 element-ui，按如下方式声明
// Vue.use(ElementUI)

3.5 员工模糊搜索

image-20240408193351462

我们要监听输入框

并且搜索的时候，我们应该把我们分页设置为第一页，因为只要是查询就要从第一页开始看，之后查询员工的数据即可

并且在搜索的此处做了一个优化，在用户输入完成一段时间后再进行搜索（防抖处理）

image-20240408193704635

  1. 绑定查询参数
<el-input
  v-model="queryParams.keyword"
  style="margin-bottom:10px"
  type="text"
  prefix-icon="el-icon-search"
  size="small"
  placeholder="输入员工姓名全员搜索"
/>

// 存储查询参数
queryParams: {
  // 当前选中节点id
  departmentId: null,
  // 当前页码
  page: 1,
  // 每页有多少数据
  pagesize: 10,
  // 模糊搜索查询
  keyword: ''
},
  1. 监听input绑定的值的改变

由于值的改变触发了一个事件

但是下面这个不合适，因为我们向输入完成之后就触发

image-20240408194157021

我们选择如下所示的方法，当值发生变化的时候就触发

image-20240408194239763

<el-input
  v-model="queryParams.keyword"
  style="margin-bottom:10px"
  type="text"
  prefix-icon="el-icon-search"
  size="small"
  placeholder="输入员工姓名全员搜索"
  @input="changeValue"
/>

对应的方法如下所示

async getEmployeeList() {
  // 解构出row数据
  const { rows, total } = await getEmployeeList(this.queryParams)
  this.list = rows
  this.total = total
},
// 当input框中输入的内容改变时触发此方法
changeValue() {
   // 修改查询第一页
   this.queryParams.page = 1
   // 调用封装好的方法
   this.getEmployeeList()
}
  1. 优化：完成防抖处理

加了一个定时器

// 当input框中输入的内容改变时触发此方法
changeValue() {
  // 单位时间内只执行最后一次
  // this的实例上赋值了一个timer的属性（此时timer并不是响应式数据，和视图没关系）
  clearTimeout(this.timer) // 清理上一次的定时器
  this.timer = setTimeout(() => {
    // 修改查询第一页
    this.queryParams.page = 1
    // 调用封装好的方法
    this.getEmployeeList()
  }, 700)
}

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

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

ssm055基于spring框架的中小企业人力资源管理系统的设计及实现+jsp

ssm055基于spring框架的中小企业人力资源管理系统的设计及实现+jsp

中小企业人力资源管理系统设计与实现 摘 要 现代经济快节奏发展以及不断完善升级的信息化技术&#xff0c;让传统数据信息的管理升级为软件存储&#xff0c;归纳&#xff0c;集中处理数据信息的管理方式。本中小企业人力资源管理系统就是在这样的大环境下诞生&#xff0c;其可…
阅读更多...
基于SpringBoot+Vue的装饰工程管理系统（源码+文档+包运行）

基于SpringBoot+Vue的装饰工程管理系统（源码+文档+包运行）

一.系统概述 如今社会上各行各业&#xff0c;都喜欢用自己行业的专属软件工作&#xff0c;互联网发展到这个时候&#xff0c;人们已经发现离不开了互联网。新技术的产生&#xff0c;往往能解决一些老技术的弊端问题。因为传统装饰工程项目信息管理难度大&#xff0c;容错率低&a…
阅读更多...
5.2 iHRM人力资源 - 员工管理 - 使用文件导入导出员工

5.2 iHRM人力资源 - 员工管理 - 使用文件导入导出员工

iHRM人力资源 - 员工管理 - 导入导出员工 文章目录 iHRM人力资源 - 员工管理 - 导入导出员工一、员工导出Excel二、员工导入Excel2.1 Excel导入组件封装2.2 下载导入模板2.3 Excel 导入功能 三、删除员工 一、员工导出Excel 这个地方涉及一个接口二进制流blob 就是下面这一大片…
阅读更多...
力扣HOT100 - 234. 回文链表

力扣HOT100 - 234. 回文链表

解题思路&#xff1a; class Solution {public boolean isPalindrome(ListNode head) {List<Integer> list new ArrayList<Integer>();// 将链表的值复制到数组中ListNode cur head;while (cur ! null) {list.add(cur.val);cur cur.next;}// 使用双指针判断是否…
阅读更多...
力扣hot100：136. 只出现一次的数字 及其衍生

力扣hot100：136. 只出现一次的数字 及其衍生

文章目录 一、LeetCode&#xff1a;136. 只出现一次的数字 使用到的异或运算的特点&#xff1a; 两个相同的数异或&#xff0c;结果为0 一、LeetCode&#xff1a;136. 只出现一次的数字 LeetCode&#xff1a;136. 只出现一次的数字 这里数组nums的特点是&#xff0c;除了一…
阅读更多...
线程控制及线程底层原理

线程控制及线程底层原理

thread id 本质是一个地址。 以十六机制打印id。 线程终止的两种方法。 1.直接return&#xff1b; 2.pthread_exit(); 注意exit()是用来终止进程的&#xff0c;不能用于线程。 那怎么获取线程的返回值呢&#xff1f; 首先&#xff0c;和进程一样&#xff0c;线程退出也需要…
阅读更多...
Python 入门指南（一）

Python 入门指南（一）

原文&#xff1a;zh.annas-archive.org/md5/97bc15629f1b51a0671040c56db61b92 译者&#xff1a;飞龙 协议&#xff1a;CC BY-NC-SA 4.0 前言 这个学习路径帮助你在 Python 的世界中感到舒适。它从对 Python 的全面和实用的介绍开始。你将很快开始在学习路径的第一部分编写程序…
阅读更多...
2024年阿里云4核8G配置云服务器价格低性能高！

2024年阿里云4核8G配置云服务器价格低性能高！

阿里云4核8G服务器租用优惠价格700元1年&#xff0c;配置为ECS通用算力型u1实例&#xff08;ecs.u1-c1m2.xlarge&#xff09;4核8G配置、1M到3M带宽可选、ESSD Entry系统盘20G到40G可选&#xff0c;CPU采用Intel(R) Xeon(R) Platinum处理器&#xff0c;阿里云优惠 aliyunfuwuqi…
阅读更多...
基于docker的Jenkin的服务平台搭建

基于docker的Jenkin的服务平台搭建

项目拓扑图 项目环境: jenkins-2.440 sonarqube-9.9.4 apache-maven-3.9.6 gitlab-ce-12.4.2 java17 docker20 harbor.v2.6.0 centos7.9 项目目的: 模拟企业构建一个流行的持续集成和持续部署环境,可以更轻松地创建和管理构建环境&#xff0c;实现自动化构建和部署应用程序的…
阅读更多...
大模型开发轻松入门——（1）从搭建自己的环境开始

大模型开发轻松入门——（1）从搭建自己的环境开始

pip install openai import openai import osfrom dotenv import load_dotenv, find_dotenv _ load_dotenv(find_dotenv())openai.api_key os.getenv(OPENAI_API_KEY)
阅读更多...
3d模型怎么全是网格？---模大狮模型网

3d模型怎么全是网格？---模大狮模型网

在进行3D建模或场景设计时&#xff0c;有时会遇到一个普遍问题&#xff0c;即所见的3D模型表面全是由网格组成&#xff0c;而没有显示实际的表面纹理或颜色。这可能会导致困惑和挫败感&#xff0c;阻碍项目的进展。本文将深入探讨这一现象背后的原因&#xff0c;并提供多种解决…
阅读更多...
2024九章云极DataCanvas智算操作系统新品发布会震撼来袭！

2024九章云极DataCanvas智算操作系统新品发布会震撼来袭！

从大模型到智能算力&#xff0c;从“数字中国”到“新质生产力”……在技术突破和时代引领双轮驱动下&#xff0c;人工智能技术应用不断刷新全社会的认知&#xff0c;人工智能产业机遇席卷而来、发展将颠覆想象。随着AIGC和大模型的快速发展&#xff0c;建设拥有“卓越算力”和…
阅读更多...
Chrome修改主题颜色

Chrome修改主题颜色

注意&#xff1a;自定义Chrome按钮只在搜索引擎为Google的时候出现。
阅读更多...
如何鉴别品深茶叶的真伪？

如何鉴别品深茶叶的真伪？

鉴别品深茶叶的真伪可以通过以下三点进行判断&#xff1a;第一是看&#xff0c;观察茶叶的颜色和形状是否自然&#xff1b;第二是闻&#xff0c;感受茶叶的香气是否纯净&#xff1b;第三是泡&#xff0c;品尝茶汤的味道是否醇厚。最好的方式还是通过官方访问进行查询&#xff0…
阅读更多...
Linux系统——Elasticsearch企业级日志分析系统

Linux系统——Elasticsearch企业级日志分析系统

目录 前言 一、ELK概述 1.ELK简介 2.ELK特点 3.为什么要使用ELK 4.完整日志系统基本特征 5.ELK工作原理 6.Elasticsearch介绍 6.1Elasticsearch概述 6.2Elasticsearch核心概念 7.Logstash介绍 7.1Logstash简介 7.2Logstash主要组件 8.Kibana介绍 8.1Kibana简介 …
阅读更多...
划重点！免费SSL证书要慎用

划重点！免费SSL证书要慎用

HTTPS协议逐渐成为当下网络传输协议的主流方式&#xff0c;这一点为人共知&#xff0c;也正是基于这一点&#xff0c;SSL证书的使用越来越被网站所接受。同时&#xff0c;SSL证书市场产品种类繁多&#xff0c;从免费版本到价格不等的收费版都有&#xff0c;不少用户考虑成本等因…
阅读更多...
【网络编程】web服务器shttpd源码剖析——命令行和文件配置解析

【网络编程】web服务器shttpd源码剖析——命令行和文件配置解析

hello &#xff01;大家好呀&#xff01; 欢迎大家来到我的网络编程系列之web服务器shttpd源码剖析——命令行解析&#xff0c;在这篇文章中&#xff0c;你将会学习到在Linux内核中如何创建一个自己的并发服务器shttpd&#xff0c;并且我会给出源码进行剖析&#xff0c;以及手绘…
阅读更多...
QTableWidget的使用案例

QTableWidget的使用案例

QTableWidget的使用案例 创建QTableWidget m_table_widget new QTableWidget(this);m_table_widget->setObjectName("TableWidget");m_table_widget->setShowGrid(false);m_table_widget->setSortingEnabled(true);m_table_widget->setEditTriggers(QAb…
阅读更多...
EcoVadis评估是什么？EcoVadis评估的步骤有哪些

EcoVadis评估是什么？EcoVadis评估的步骤有哪些

EcoVadis评估是一种针对供应链中各个环节的环境和社会责任进行评估的工具。其评估范围广泛&#xff0c;涵盖了环境、劳工与人权、商业道德和可持续采购等多个领域。通过收集企业的公开信息、企业提供的数据和自我评估问卷等方式&#xff0c;EcoVadis能够为企业提供一个全面的可…
阅读更多...
C++ 之 newmat 矩阵运算库使用笔记

C++ 之 newmat 矩阵运算库使用笔记

文章目录 Part.I IntroductionChap.I newmat 简介 Part.II 安装与编译Chap.I 直接使用源码Chap.II 基于 CMake 使用源码Chap.III 编译成库 Part.III 关于矩阵的构造与运算Chap.I 矩阵的构造与初始化Chap.II 矩阵的运算Chap.III 矩阵维数和类型的更改Chap.IV 矩阵最值统计 Refer…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023