Skip to content

F
founder_vue
Commit 7956e48d by 张超军
Options

Merge branch 'dev_zwpt' of http://47.92.108.28/changchao/founder_vue into dev_zwpt

parents e69a051d 20a771f8
Showing with 397 additions and 37 deletions
src/App.vue
......@@ -78,3 +78,73 @@ export default {};
}
}
</style>
<style lang="scss">
.el-message-box__message {
margin: 23px 24px 17px 24px;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #333333;
}
.el-message-box__btns {
margin-bottom: 24px;
padding-bottom: 24px;
// 交换 确定 和 取消 按钮的位置
.el-button:nth-child(1) {
float: right;
margin-right: 23%;
width: 72px;
height: 40px;
background: #055fe7;
border-radius: 4px;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #ffffff;
}
.el-button:nth-child(2) {
float: left;
margin-left: 23%;
width: 72px;
height: 40px;
background: #ffffff;
border-radius: 4px;
border: 1px solid #aeb5c2;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #2e3846;
}
}
.el-popconfirm__main {
margin: 23px 24px 17px 24px;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #333333;
}
.el-popconfirm__action {
margin-bottom: 24px;
padding-bottom: 24px;
// 交换 确定 和 取消 按钮的位置
.el-button:nth-child(1) {
float: right;
margin-right: 23%;
width: 72px;
height: 32px;
background: #055fe7;
border-radius: 4px;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #ffffff;
}
.el-button:nth-child(2) {
float: left;
margin-left: 23%;
width: 72px;
height: 32px;
background: #ffffff;
border-radius: 4px;
border: 1px solid #aeb5c2;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #2e3846;
}
}
</style>
src/plugins/axios.js
/*
* @Author: your name
* @Date: 2021-09-07 09:57:48
* @LastEditTime: 2021-11-26 11:31:17
* @LastEditTime: 2021-11-26 16:55:10
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \指纹系统\founder_vue\src\plugins\axios.js
......@@ -15,9 +15,8 @@ import "nprogress/nprogress.css";
import router from "../router";
import store from "../store";
import { Loading, MessageBox } from 'element-ui';
var loadingIndex = 0;
var loadingBoo;
var timer;
import { showLoading, hideLoading } from "@/utils/requestLoading";
var tiTimer;
// Full config: https://github.com/axios/axios#request-config
// axios.defaults.baseURL = process.env.baseURL || process.env.apiUrl || '';
......@@ -35,9 +34,10 @@ let config = {
};
const _axios = axios.create(config);
var loading;
_axios.interceptors.request.use(
function (config) {
debugger;
//判断是否登录
if (config.url.indexOf('/login/myLoginForm') <= 0) {
if (localStorage.getItem("token")) {
config.headers.Authorization = localStorage.getItem("token");
......@@ -55,10 +55,10 @@ _axios.interceptors.request.use(
}, 200);
}
}
loadingBoo = (!config.loading && typeof config.loading == 'boolean') ? config.loading : true;
if (loadingBoo) {
if (!loading) loading = Loading.service({ fullscreen: true, text: '正在加载...' });
loadingIndex++;
// 判断当前请求是否设置了不显示Loading,默认显示
if (config.loading !== false) {
showLoading(config.headers.loadingTarget); // 如果设置了targer,使用设置的target,比如el-table
}
NProgress.start();
return config;
......@@ -73,29 +73,15 @@ _axios.interceptors.request.use(
// Add a response interceptor
_axios.interceptors.response.use(
function (response) {
NProgress.done();
loadingIndex--;
// console.log('请求后' + loadingIndex)
if (loadingIndex <= 0) {
clearTimeout(timer)
timer = setTimeout(() => {
loading && loading.close();
loading = null
}, 500);
debugger;
if (response.config.loading !== false) {
hideLoading();
}
NProgress.done();
return response;
},
function (error) {
NProgress.done();
loadingIndex--;
if (loadingIndex == 0) {
clearTimeout(timer)
setTimeout(() => {
loading && loading.close();
loading = null;
}, 1200);
}
// Do something with response error
return Promise.reject(error);
}
);
......
src/utils/requestLoading.js 0 → 100644
/*
* @Author: your name
* @Date: 2021-11-26 16:37:59
* @LastEditTime: 2021-11-26 16:59:01
* @LastEditors: Please set LastEditors
* @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
* @FilePath: \founder_vue\src\utils\requestLoading.js
*/
import utils from "./util";
import { Loading } from 'element-ui' // 装包方式这样引入,我这里通过cdn引入,通过window.ELEMENT调用
// loading对象
let loading;
// 当前正在请求的数量
let needLoadingRequestCount = 0;
// 显示loading
export function showLoading(target) {
// 后面这个判断很重要，因为关闭时加了抖动，此时loading对象可能还存在，
// 但needLoadingRequestCount已经变成0.避免这种情况下会重新创建个loading
console.log(needLoadingRequestCount, loading);
if (needLoadingRequestCount === 0 && !loading) {
loading = Loading.service({ // 通过cdn引入的element-ui
lock: true,
text: "加载中...",
background: "rgba(255, 255, 255, 0.7)",
target: target || "#micro-apps-container"
});
}
needLoadingRequestCount++;
}
// 隐藏loading
export function hideLoading() {
needLoadingRequestCount--;
needLoadingRequestCount = Math.max(needLoadingRequestCount, 0); // 做个保护
if (needLoadingRequestCount === 0) {
// 关闭loading
toHideLoading();
}
}
// 防抖：将 300ms 间隔内的关闭 loading 便合并为一次。防止连续请求时， loading闪烁的问题。
let toHideLoading = utils.debounce(() => {
loading.close();
loading = null;
}, 500);
src/utils/util.js
......@@ -173,7 +173,51 @@ export default {
}
})
return treeData !== '' ? treeData : data
},
/**
* @desc 函数防抖
* @param func 目标函数
* @param wait 延迟执行毫秒数
* @param immediate true - 立即执行， false - 延迟执行
* 立即执行版的意思是触发事件后函数会立即执行，然后 n 秒内不触发事件才能继续执行函数的效果
非立即执行版的意思是触发事件后函数不会立即执行，而是在 n 秒后执行，如果在 n 秒内又触发了事件，则会重新计算函数执行时间。
*/
debounce(func, wait, immediate) {
let timer;
return function () {
let context = this;
let args = arguments;
if (timer) clearTimeout(timer);
if (immediate) {
let callNow = !timer;
timer = setTimeout(() => {
timer = null;
}, wait);
if (callNow) func.apply(context, args);
} else {
timer = setTimeout(() => {
func.apply(context, args);
}, wait);
}
};
},
// 定时器版-节流
throttle(func, wait) {
let timeout;
return function () {
let context = this;
let args = arguments;
if (!timeout) {
timeout = setTimeout(() => {
timeout = null;
func.apply(context, args);
}, wait);
}
};
}
};
src/views/AllPersonnelBase/AllPersonnelBase.vue
......@@ -123,7 +123,7 @@
style="width: 100%"
:class="{delSelection: !selectBoo}"
@selection-change="handleSelectionChange"
@row-click="handle"
@row-click="isShowRyxxkBtn"
>
<el-table-column
type="selection"
......@@ -438,6 +438,12 @@
:isShowXzry="isShowXzry"
@closeXzry="closeXzry"
> </xzry>
<!-- 人员信息卡 -->
<ryxxk
:isShowRyxxk="isShowRyxxk"
:rowData="rowData"
@closeRyxxk="closeRyxxk"
> </ryxxk>
<!-- <el-drawer
title="我是标题"
......@@ -461,6 +467,7 @@ import dcftpx from "./modules/dcftpx.vue"; //导出FPTX弹窗
import ggrytm from "./modules/ggrytm.vue"; // 更改人员条码弹窗
import fcx from "./modules/fcx.vue"; // 发查询弹窗
import xzry from "./modules/xzry.vue"; // 新增案件
import ryxxk from "./modules/ryxxk.vue"; // 人员信息卡
export default {
name: "AllPersonnelBase",
components: {
......@@ -471,6 +478,7 @@ export default {
ggrytm,
fcx,
xzry,
ryxxk
},
created () {
let w1 = 1920;
......@@ -500,6 +508,7 @@ export default {
isShowFztm: false, //复制条码
isShowFcx: false, //发查询
isShowXzry: false, // 新增人员
isShowRyxxk: false, // 人员信息卡
type: "ry", // 人员还是案件
rowData: {}, // 单行数据
ysxtAsjxgrybh: null,
......@@ -595,6 +604,17 @@ export default {
this.isShowXzry = val;
// this.search();
},
// 人员信息卡操作
isShowRyxxkBtn () {
this.isShowRyxxk = true;
},
closeRyxxk (val) {
//console.log("新增人员关闭", val);
// 增加毛玻璃
this.$bus.emit('isBlur', val)
this.isShowRyxxk = val;
// this.search();
},
// 时间格式化
dateTimeFormat (row, colnum) {
let prop = colnum.property;
......
src/views/AllPersonnelBase/modules/ajxxk.vue 0 → 100644
<template>
<div>
<el-drawer
class="ajxxkDrawer"
title="标题"
:visible.sync="drawer"
:direction="direction"
:before-close="handleClose"
:with-header="false"
:modal='false'
append-to-body
size='36%'
>
<div class="header">
<div class="header-title">人员档案信息</div>
<div
class="header-close"
@click="closeDrawer"
>
<svg
class="icon"
aria-hidden="true"
>
<use xlink:href="#icon-fanhui"></use>
</svg>
</div>
</div>
</el-drawer>
</div>
</template>
<script>
export default {
name: "ryxxk",
props: {
isShowRyxxk: {
type: [Number, String, Boolean],
default: false
},
rowData: {
default: false
}
},
data () {
return {
drawer: false,
direction: 'rtl',
};
},
mounted () {
this.drawer = this.isShowRyxxk;
},
watch: {
isShowRyxxk (newVal, oldVal) {
this.drawer = newVal;
},
drawer (val) {
this.$emit('closeRyxxk', this.drawer);
}
},
methods: {
handleClose (done) {
console.log(1111111111111111)
// this.$confirm('确认关闭？')
// .then(_ => {
// done();
// })
// .catch(_ => { });
this.drawer = false
this.$emit('closeRyxxk', this.drawer);
},
closeDrawer () {
this.drawer = false
this.$emit('closeRyxxk', this.drawer);
}
}
};
</script>
<style lang="scss" scoped>
.ajxxkDrawer {
width: 100%;
height: 100%;
/deep/ .el-drawer.rtl {
overflow: auto;
}
}
.header {
position: fixed;
background: #ffffff;
height: 50px;
width: 688px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 32px;
border-bottom: 1px solid #eeeeee;
z-index: 999;
.header-title {
font-size: 16px;
font-family: MicrosoftYaHei;
color: #282f3c;
}
.header-close {
width: 20px;
height: 14px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
.icon {
cursor: pointer;
width: 20px;
height: 14px;
overflow: hidden;
}
}
}
</style>
src/views/AllPersonnelBase/modules/ryxxk.vue
<template>
<div>
<el-drawer
class="ryxxkDrawer"
title="标题"
:visible.sync="drawer"
:direction="direction"
:before-close="handleClose"
:with-header="false"
:modal='false'
append-to-body
size='36%'
>
<span>我来啦!</span>
<div class="header">
<div class="header-title">人员档案信息</div>
<div
class="header-close"
@click="closeDrawer"
>
<svg
class="icon"
aria-hidden="true"
>
<use xlink:href="#icon-fanhui"></use>
</svg>
</div>
</div>
</el-drawer>
</div>
</template>
<script>
export default {
name: "gz",
name: "ryxxk",
props: {
isShowGz: {
isShowRyxxk: {
type: [Number, String, Boolean],
default: false
},
......@@ -31,21 +48,75 @@ export default {
};
},
mounted () {
this.dialogVisible = this.isShowGz;
this.drawer = this.isShowRyxxk;
},
watch: {
isShowGz (newVal, oldVal) {
this.dialogVisible = newVal;
isShowRyxxk (newVal, oldVal) {
this.drawer = newVal;
},
dialogVisible (val) {
//console.log(this.dialogVisible, 123)
this.$emit('closeGz', this.dialogVisible);
drawer (val) {
this.$emit('closeRyxxk', this.drawer);
}
},
methods: {
handleClose (done) {
console.log(1111111111111111)
// this.$confirm('确认关闭？')
// .then(_ => {
// done();
// })
// .catch(_ => { });
this.drawer = false
this.$emit('closeRyxxk', this.drawer);
},
closeDrawer () {
this.drawer = false
this.$emit('closeRyxxk', this.drawer);
}
}
};
</script>
<style lang="scss" scoped>
.ryxxkDrawer {
width: 100%;
height: 100%;
/deep/ .el-drawer.rtl {
overflow: auto;
}
}
.header {
position: fixed;
background: #ffffff;
height: 50px;
width: 688px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 32px;
border-bottom: 1px solid #eeeeee;
z-index: 999;
.header-title {
font-size: 16px;
font-family: MicrosoftYaHei;
color: #282f3c;
}
.header-close {
width: 20px;
height: 14px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
.icon {
cursor: pointer;
width: 20px;
height: 14px;
overflow: hidden;
}
}
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment