随笔分类 - python 运维开发
摘要：一、概述 什么是qs qs是一个流行的查询参数序列化和解析库。可以将一个普通的object序列化成一个查询字符串，或者反过来将一个查询字符串解析成一个object,帮助我们查询字符串解析和序列化字符串。 vue中qs安装使用 打开控制台输入：npm install qs在main.js中导入qs插件
阅读全文
摘要：一、概述 在执行删除操作时，我们一般会添加一个删除确认框，当用户点击确认删除后在执行删除操作，这样能提升用用户体验，那么该如何快速实现呢？element中提供了相应的确认框，在官方文档中不太好找，其实在message box弹框中，有一个确认消息 二、代码实现 test.vue <template>
阅读全文
摘要：一、概述 element-ui table 默认是白色背景，现在需要修改为黑色背景，白色文字。 二、代码实现 css样式 <style> /*修改table 的背景颜色和文字颜色*/ .el-table td, .el-table th.is-leaf,.el-table--border, .el-
阅读全文
摘要：一、概述 在后台项目中，使用Dropdown 下拉菜单时，发现对el-dropdown-item绑定点击事件时，一直没有触发，比如： <el-dropdown-item @click="password()">修改密码</el-dropdown-item> 后来查阅官方文档，原来是使用方式不对。接下
阅读全文
摘要：一、概述 在项目中，点击下载按钮，就可以下载文件。 传统的下载链接一般是get方式，这种链接是公开的，可以任意下载。 在实际项目，某些下载链接，是私密的。必须使用post方式，传递正确的参数，才能下载。 二、django项目 本环境使用django 3.1.5，新建项目download_demo 安
阅读全文
摘要：一、概述 在项目，需要使用一个功能，点击某个按钮，展开/隐藏 某些说明文字。 二、项目演示 新建一个vue项目，安装ElementUI 模块即可。 新建test.vue <template> <div style="width: 70%;margin-left: 30px;margin-top: 3
阅读全文
摘要：一、概述 在项目中，需要使用websocket，来展示一些实时信息。 这里使用django 3.1.5 二、django项目 安装模块 pip3 install django-cors-headers channels 新建项目websocket_demo 修改websocket_demo/asgi
阅读全文
摘要：一、概述 现有项目中，涉及文件上传。要求： 1. 文件必须是excel 2. 只能上传1个文件 3. 文件大小不能超过5M 二、Upload 上传 注意：ElementUI Upload 上传，需要和后端api结合才能使用。 演示环境使用django，版本为：3.1.5 新建django项目 新建d
阅读全文
摘要：一、概述 现有一个vue项目，需要一个json编辑器，能够格式化json数据，同时也支持编辑功能。 vue-json-editor 插件就可以实现这个功能 二、vue-json-editor 使用 安装插件 npm install vue-json-editor --save 使用 test.vue
阅读全文
摘要：一、概述 效果图 二、代码实现 新建test目录，放2个vue文件。 sidentify.vue组件代码： <template> <div class="s-canvas"> <canvas id="s-canvas" :width="contentWidth" :height="contentHe
阅读全文
摘要：一、概述 现有一个基于element-ui开发的后台页面，效果如下： 需要将公司名进行切割，每一行，显示一个公司。 二、代码实现 test.vue <template> <el-table :data="tableData" border style="width: 362px"> <el-tabl
阅读全文
摘要：一、概述 当我们向后台请求大量数据的时候，并要在页面展示出来，请求的数据可能上百条数据或者更多的时候，并不想在一个页面展示，这就需要使用分页功能来去完成了。 本次所使用的是vue2.0+element-ui实现一个分页功能，element-ui这个组件特别丰富，分页中给我提供了一个Paginatio
阅读全文
摘要：一、概述 ElementUI 官方给的demo，里面有验证数字的，但是没有小数点的校验。 二、代码实现 页面效果 from表单 <el-form-item label="价格" prop="price"> <el-input v-model="ruleForm.price" oninput="val
阅读全文
摘要：一、概述 使用kubectl apply或者create命令创建/更新部署后，其pod需要时间完成创建/更新。如果在CI中不等待所有pod更新完成，下一步流程很有可能使用更新前的环境。 二、使用方法 根据实际情况kubectl rollout status命令，能够正确的获取rollout stat
阅读全文
摘要：一、概述 在保留当前页面状态的情况下，告知用户并承载相关操作。 二、自定义内容 Dialog 组件的内容可以是任意的，甚至可以是表格或表单，下面是应用了 Element Table 和 Form 组件的两个样例。 <!-- Table --> <el-button type="text" @clic
阅读全文
摘要：一、jaeger 介绍 jaeger 官网：https://www.jaegertracing.io/ jaeger 是 Uber 开源的分布式跟踪系统，用于微服务的监控和全链路跟踪，其设计思想来自于 Dapper 和 zipkin。jaeger 特征包括： 分布式上下文传播 分布式事务监控 Roo
阅读全文
摘要：一、节点调度 在开始 kiali 亲和性调度之前，先演示一个简单的例子介绍 pod 选择调度到指定 node： 节点打标 使用命令查看当前所有 k8s 节点： [root@k8s-master ~]# kubectl get nodes NAME STATUS ROLES AGE VERSION k
阅读全文
摘要：一、kiali 组件分析 使用如下命令查看 kiali pod 详情： kubectl edit pod -n istio-system $(kubectl get pods -n istio-system | grep -i kiali | awk '{print $1}') kiali pod
阅读全文
摘要：一、概述 kiali 是使用 istioctl 客户端工具安装 demo profile 时自动就会安装的组件，kiali 是一款 istio 服务网格可视化工具，提供了服务拓扑图、全链路跟踪、指标遥测、配置校验、健康检查等功能。 二、kiali 可视化bookinfo 在前面几篇文章中，已经部署了
阅读全文
摘要：一、概述 这个示例部署了一个用于演示多种 Istio 特性的应用，该应用由四个单独的微服务构成。 这个应用模仿在线书店的一个分类，显示一本书的信息。 页面上会显示一本书的描述，书籍的细节（ISBN、页数等），以及关于这本书的一些评论。 Bookinfo 应用分为四个单独的微服务： productpa
阅读全文
