600 lines
22 KiB
Vue
600 lines
22 KiB
Vue
|
<template>
|
|||
|
|
<view class="hole-page">
|
|||
|
|
<view class="upper-bgd">
|
|||
|
|
<h4 style="font-size: 16px; font-weight: normal">RFID标签解绑</h4>
|
|||
|
|
<!-- <uni-data-select v-model="powerVal" :localdata="powerRange" placeholder="请选择功率" @change="powerChange"
|
|||
|
|
:clear="false"></uni-data-select> -->
|
|||
|
|
</view>
|
|||
|
|
<view class="lower-rfid" v-show="showStats">
|
|||
|
|
<view class="stat-cont">
|
|||
|
|
<view class="cont-upper">
|
|||
|
|
<h4 style="font-size: 14px">识别数据</h4>
|
|||
|
|
<view
|
|||
|
|
style="color: #3198ff; font-size: 12px"
|
|||
|
|
@click="clearStat">
|
|||
|
|
<uni-icons
|
|||
|
|
type="trash"
|
|||
|
|
size="12"
|
|||
|
|
style="color: #3198ff"></uni-icons>
|
|||
|
|
清空数据
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
<view class="cont-lower">
|
|||
|
|
<view>
|
|||
|
|
<h4>物资名称</h4>
|
|||
|
|
<span>{{ bindStats.typeName }}</span>
|
|||
|
|
</view>
|
|||
|
|
<view>
|
|||
|
|
<h4>物资规格</h4>
|
|||
|
|
<span>{{ bindStats.typeCode }}</span>
|
|||
|
|
</view>
|
|||
|
|
<view>
|
|||
|
|
<h4>物资编号</h4>
|
|||
|
|
<span>{{ bindStats.maCode }}</span>
|
|||
|
|
</view>
|
|||
|
|
<view>
|
|||
|
|
<h4>物资状态</h4>
|
|||
|
|
<span>{{ bindStats.sdStatus }}</span>
|
|||
|
|
</view>
|
|||
|
|
<!-- <view>
|
|||
|
|
<h4>本次维修时间</h4>
|
|||
|
|
<span>5</span>
|
|||
|
|
</view>
|
|||
|
|
<view>
|
|||
|
|
<h4>下次维修时间</h4>
|
|||
|
|
<span>6</span>
|
|||
|
|
</view>
|
|||
|
|
<view>
|
|||
|
|
<h4>所属工程名称</h4>
|
|||
|
|
<span>7</span>
|
|||
|
|
</view>
|
|||
|
|
<view>
|
|||
|
|
<h4>领料单位名称</h4>
|
|||
|
|
<span>8</span>
|
|||
|
|
</view> -->
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view v-show="showDev">
|
|||
|
|
<uni-forms
|
|||
|
|
ref="qrForm"
|
|||
|
|
:modelValue="qrFormData"
|
|||
|
|
label-position="top"
|
|||
|
|
:rules="rules"
|
|||
|
|
class="qr-stats">
|
|||
|
|
<uni-forms-item name="typeVal" required label="设备类型">
|
|||
|
|
<zxz-uni-data-select
|
|||
|
|
v-model="qrFormData.typeVal"
|
|||
|
|
:localdata="typeRange"
|
|||
|
|
@change="typeChange"
|
|||
|
|
filterable>
|
|||
|
|
</zxz-uni-data-select>
|
|||
|
|
</uni-forms-item>
|
|||
|
|
<uni-forms-item name="specVal" required label="规格型号">
|
|||
|
|
<uni-data-select
|
|||
|
|
v-model="qrFormData.specVal"
|
|||
|
|
:localdata="specRange"
|
|||
|
|
@change="specChange"></uni-data-select>
|
|||
|
|
</uni-forms-item>
|
|||
|
|
<view class="middle">
|
|||
|
|
<h4 style="font-weight: normal; margin-bottom: 15rpx">
|
|||
|
|
标签编号：
|
|||
|
|
</h4>
|
|||
|
|
<span>{{ qrcode }}</span>
|
|||
|
|
</view>
|
|||
|
|
<uni-forms-item name="deviceCode" required label="设备编号">
|
|||
|
|
<uni-easyinput
|
|||
|
|
v-model="qrFormData.deviceCode"></uni-easyinput>
|
|||
|
|
</uni-forms-item>
|
|||
|
|
|
|||
|
|
<view>
|
|||
|
|
<view>RFID:</view>
|
|||
|
|
<input class="uni-input" readonly v-model="rfid" />
|
|||
|
|
</view>
|
|||
|
|
</uni-forms>
|
|||
|
|
<u-loading-page
|
|||
|
|
:loading="showLoading"
|
|||
|
|
color="#000"
|
|||
|
|
loading-text="加载中,请稍后..."></u-loading-page>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- <div v-if="showPrompt" class="prompt">{{ promptMessage }}</div> -->
|
|||
|
|
<!-- 添加新的加载效果 -->
|
|||
|
|
<div v-if="showPrompt" class="custom-loading-overlay">
|
|||
|
|
<div class="custom-loading-content">
|
|||
|
|
<div class="custom-spinner"></div>
|
|||
|
|
<p>{{ promptMessage }}</p>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<view class="btns-area">
|
|||
|
|
<view @click="startVeri">开始识别</view>
|
|||
|
|
<view @click="toggleBind" v-show="showBid">解绑</view>
|
|||
|
|
<view @click="toggleBinds" v-show="showDev">解绑</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
// const rfidMod = uni.requireNativePlugin('BNS-RfidRed')
|
|||
|
|
var rfidModule = uni.requireNativePlugin("DeviceModule_RFID");
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
showStats: false,
|
|||
|
|
showDev: false,
|
|||
|
|
showBid: true,
|
|||
|
|
rfidCode: "",
|
|||
|
|
maId: "",
|
|||
|
|
maCode: "",
|
|||
|
|
powerVal: 0,
|
|||
|
|
powerRange: [],
|
|||
|
|
bindStats: {},
|
|||
|
|
showLoading: false,
|
|||
|
|
qrFormData: {
|
|||
|
|
typeVal: "",
|
|||
|
|
specVal: "",
|
|||
|
|
deviceCode: "",
|
|||
|
|
},
|
|||
|
|
rules: {
|
|||
|
|
typeVal: {
|
|||
|
|
rules: [
|
|||
|
|
{
|
|||
|
|
required: true,
|
|||
|
|
errorMessage: "请输设备类型！",
|
|||
|
|
},
|
|||
|
|
],
|
|||
|
|
},
|
|||
|
|
specVal: {
|
|||
|
|
rules: [
|
|||
|
|
{
|
|||
|
|
required: true,
|
|||
|
|
errorMessage: "请输规格型号！",
|
|||
|
|
},
|
|||
|
|
],
|
|||
|
|
},
|
|||
|
|
deviceCode: {
|
|||
|
|
rules: [
|
|||
|
|
{
|
|||
|
|
required: true,
|
|||
|
|
errorMessage: "请输设备编号！",
|
|||
|
|
},
|
|||
|
|
],
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
qrcode: "",
|
|||
|
|
typeRange: [],
|
|||
|
|
specRange: [],
|
|||
|
|
rfid: "",
|
|||
|
|
|
|||
|
|
showPrompt: false, // 控制提示框的显示状态
|
|||
|
|
promptMessage: "", // 存储提示信息
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
startVeri() {
|
|||
|
|
let that = this;
|
|||
|
|
that.showPrompt = true;
|
|||
|
|
that.promptMessage = "识别中，请稍候...";
|
|||
|
|
// 延迟关闭提示，显示Toast
|
|||
|
|
setTimeout(() => {
|
|||
|
|
let jsonData = {
|
|||
|
|
bank: 1,
|
|||
|
|
ptr: 2,
|
|||
|
|
cnt: 6,
|
|||
|
|
accessPwd: "00000000",
|
|||
|
|
};
|
|||
|
|
let goVeri = rfidModule.readData(jsonData);
|
|||
|
|
// let goVeri = rfidMod.redTag()
|
|||
|
|
// console.log(goVeri);
|
|||
|
|
if (goVeri.code == 0) {
|
|||
|
|
that.showPrompt = false; // 关闭提示
|
|||
|
|
that.rfidCode = goVeri.data;
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: "none",
|
|||
|
|
title: "识别成功",
|
|||
|
|
success: () => {
|
|||
|
|
// 调用编码获取设备信息
|
|||
|
|
that.$api.fetchMaterialOutStore
|
|||
|
|
.searchRfid({
|
|||
|
|
rfidCode: goVeri.data,
|
|||
|
|
})
|
|||
|
|
.then((res) => {
|
|||
|
|
console.log(res);
|
|||
|
|
console.log(res.data.data[0]);
|
|||
|
|
|
|||
|
|
if (res.data.data.length > 0) {
|
|||
|
|
that.bindStats = res.data.data[0];
|
|||
|
|
that.maCode =
|
|||
|
|
res.data.data[0].maCode;
|
|||
|
|
that.maId = res.data.data[0].maId;
|
|||
|
|
that.showStats = true;
|
|||
|
|
that.showDev = false;
|
|||
|
|
that.showBid = true;
|
|||
|
|
} else {
|
|||
|
|
that.showDev = true;
|
|||
|
|
that.showBid = false;
|
|||
|
|
that.showStats = false;
|
|||
|
|
that.rfid = that.rfidCode;
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
.catch((err) => {
|
|||
|
|
console.log(err);
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
} else if (goVeri.code == 1000) {
|
|||
|
|
that.showPrompt = false; // 关闭提示
|
|||
|
|
that.showLoading = false;
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: "none",
|
|||
|
|
title: "获取设备信息失败，请重新扫描！",
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
}, 1000);
|
|||
|
|
},
|
|||
|
|
toggleBind() {
|
|||
|
|
let that = this;
|
|||
|
|
this.showPrompt = true;
|
|||
|
|
this.promptMessage = "正在绑定，请稍候...";
|
|||
|
|
// 延迟关闭提示，显示Toast
|
|||
|
|
setTimeout(() => {
|
|||
|
|
if (that.maCode == "" || that.maId == "") {
|
|||
|
|
this.showPrompt = false; // 关闭提示
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: "none",
|
|||
|
|
title: "未识别到绑定设备！",
|
|||
|
|
});
|
|||
|
|
} else {
|
|||
|
|
that.$api.rfidBinding
|
|||
|
|
.bindRfidClose({
|
|||
|
|
rfidCode: that.rfidCode,
|
|||
|
|
maId: that.maId,
|
|||
|
|
maCode: that.maCode,
|
|||
|
|
})
|
|||
|
|
.then((res) => {
|
|||
|
|
this.showPrompt = false; // 关闭提示
|
|||
|
|
console.log(res);
|
|||
|
|
if (res.data.code == 200) {
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: "none",
|
|||
|
|
title: res.data.msg,
|
|||
|
|
success: () => {
|
|||
|
|
uni.switchTab({
|
|||
|
|
url: "/pages/workSpace/workSpace",
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
} else {
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: "none",
|
|||
|
|
title: res.data.msg,
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
.catch((err) => {
|
|||
|
|
this.showPrompt = false; // 关闭提示
|
|||
|
|
console.log(err);
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
}, 1000);
|
|||
|
|
},
|
|||
|
|
clearStat() {
|
|||
|
|
let that = this;
|
|||
|
|
that.rfidCode = "";
|
|||
|
|
that.maCode = "";
|
|||
|
|
that.maId = "";
|
|||
|
|
that.showStats = false;
|
|||
|
|
},
|
|||
|
|
// powerChange(e) {
|
|||
|
|
// console.log(e);
|
|||
|
|
// const ctrlPower = rfidMod.setPower(e)
|
|||
|
|
// console.log(ctrlPower);
|
|||
|
|
// uni.showToast({
|
|||
|
|
// icon: 'none',
|
|||
|
|
// title: ctrlPower.res
|
|||
|
|
// })
|
|||
|
|
// },
|
|||
|
|
// 根据设备类型获取规格类型
|
|||
|
|
typeChange(e) {
|
|||
|
|
let that = this;
|
|||
|
|
console.log(e);
|
|||
|
|
// 根据设备类型获取规格类型
|
|||
|
|
that.$api.qrcodeBinding
|
|||
|
|
.fetchDeviceSpec({
|
|||
|
|
level: "4",
|
|||
|
|
parentId: String(e.value),
|
|||
|
|
})
|
|||
|
|
.then((res) => {
|
|||
|
|
console.log(res);
|
|||
|
|
if (res.data.code == 200) {
|
|||
|
|
that.specRange = res.data.data.map((item) => {
|
|||
|
|
return {
|
|||
|
|
text: item["typeName"],
|
|||
|
|
value: item["typeId"],
|
|||
|
|
code: item["code"],
|
|||
|
|
modelCode: item["modelCode"],
|
|||
|
|
};
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
.catch((err) => {
|
|||
|
|
console.log(err);
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
specChange(e) {
|
|||
|
|
let that = this;
|
|||
|
|
console.log(e, that.specRange);
|
|||
|
|
const confirmedRange = that.specRange.filter((item) => {
|
|||
|
|
return item.value == e;
|
|||
|
|
});
|
|||
|
|
console.log(confirmedRange);
|
|||
|
|
if (confirmedRange[0].code && confirmedRange[0].modelCode) {
|
|||
|
|
that.qrFormData.deviceCode = `NS${confirmedRange[0].code}${confirmedRange[0].modelCode}`;
|
|||
|
|
} else {
|
|||
|
|
that.qrFormData.deviceCode = "";
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
toggleBinds() {
|
|||
|
|
let that = this;
|
|||
|
|
|
|||
|
|
this.showPrompt = true;
|
|||
|
|
this.promptMessage = "正在绑定，请稍候...";
|
|||
|
|
// 延迟关闭提示，显示Toast
|
|||
|
|
setTimeout(() => {
|
|||
|
|
that.$refs.qrForm
|
|||
|
|
.validate()
|
|||
|
|
.then((formData) => {
|
|||
|
|
that.showLoading = true;
|
|||
|
|
console.log(formData);
|
|||
|
|
that.$api.rfidBinding
|
|||
|
|
.bindRfidClose({
|
|||
|
|
rfidCode: that.rfidCode,
|
|||
|
|
maCode: formData.deviceCode,
|
|||
|
|
})
|
|||
|
|
.then((res) => {
|
|||
|
|
this.showPrompt = false; // 关闭提示
|
|||
|
|
console.log(res);
|
|||
|
|
if (res.data.code == 200) {
|
|||
|
|
that.showLoading = false;
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: "none",
|
|||
|
|
title: res.data.msg,
|
|||
|
|
success: () => {
|
|||
|
|
uni.switchTab({
|
|||
|
|
url: "/pages/workSpace/workSpace",
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
});
|
|||
|
|
} else {
|
|||
|
|
that.showLoading = false;
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: "none",
|
|||
|
|
title: res.data.msg,
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
.catch((err) => {
|
|||
|
|
this.showPrompt = false; // 关闭提示
|
|||
|
|
console.log(err);
|
|||
|
|
});
|
|||
|
|
})
|
|||
|
|
.catch((validationError) => {
|
|||
|
|
// 验证失败的情况
|
|||
|
|
this.showPrompt = false;
|
|||
|
|
uni.showToast({
|
|||
|
|
icon: "none",
|
|||
|
|
title: "表单验证失败，请检查输入",
|
|||
|
|
});
|
|||
|
|
console.error("Validation error:", validationError);
|
|||
|
|
});
|
|||
|
|
}, 1000);
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
onLoad() {
|
|||
|
|
// 使用模块前必须先初始化RDIF模块
|
|||
|
|
let res = rfidModule.init();
|
|||
|
|
console.log(res);
|
|||
|
|
// log(JSON.stringify(res));
|
|||
|
|
if (res.code == 0) {
|
|||
|
|
// this.isLoading = false;
|
|||
|
|
} else if (res.code == -1) {
|
|||
|
|
uni.showToast({
|
|||
|
|
title: "RFID模块加载失败",
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
// 初始化rfid识别
|
|||
|
|
// const obj = rfidMod.initUHF()
|
|||
|
|
// console.log(obj);
|
|||
|
|
// 筛入频率
|
|||
|
|
for (let i = 5; i <= 30; i++) {
|
|||
|
|
this.powerRange.push({
|
|||
|
|
value: i,
|
|||
|
|
text: String(i),
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
let that = this;
|
|||
|
|
// 获取机具设备类型
|
|||
|
|
that.$api.qrcodeBinding
|
|||
|
|
.fetchDeviceType({
|
|||
|
|
level: "3",
|
|||
|
|
})
|
|||
|
|
.then((res) => {
|
|||
|
|
console.log(res);
|
|||
|
|
if (res.data.code == 200) {
|
|||
|
|
that.typeRange = res.data.data.map((item) => {
|
|||
|
|
return {
|
|||
|
|
text: item["typeName"],
|
|||
|
|
value: item["typeId"],
|
|||
|
|
};
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
.catch((err) => {
|
|||
|
|
console.log(err);
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
// mounted() {
|
|||
|
|
// setTimeout(() => {
|
|||
|
|
// // 使用模块前必须先初始化RDIF模块
|
|||
|
|
// let res = rfidModule.init();
|
|||
|
|
// // log(JSON.stringify(res));
|
|||
|
|
// if (res.code == 0) {
|
|||
|
|
// this.isLoading = false;
|
|||
|
|
// } else if (res.code == -1) {
|
|||
|
|
// uni.showToast({
|
|||
|
|
// title: 'RFID模块加载失败'
|
|||
|
|
// })
|
|||
|
|
// }
|
|||
|
|
// }, 400);
|
|||
|
|
|
|||
|
|
// },
|
|||
|
|
// beforeDestroy() {
|
|||
|
|
// // 移除按键事件
|
|||
|
|
// plus.key.removeEventListener('keydown', this.keyListener)
|
|||
|
|
// // 使用完毕必须释放RDIF模块
|
|||
|
|
// let res = rfidModule.free();
|
|||
|
|
// console.log("使用完毕必须释放RDIF模块",res)
|
|||
|
|
// // log("free: " + JSON.stringify(res))
|
|||
|
|
// },
|
|||
|
|
};
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style lang="scss">
|
|||
|
|
.hole-page {
|
|||
|
|
width: 100vw;
|
|||
|
|
height: 100vh;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
background: url("/static/workspace-bgd.png");
|
|||
|
|
background-repeat: no-repeat;
|
|||
|
|
background-size: 100% 100%;
|
|||
|
|
position: relative;
|
|||
|
|
|
|||
|
|
.upper-bgd {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 20%;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 40rpx;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
justify-content: space-around;
|
|||
|
|
|
|||
|
|
h4 {
|
|||
|
|
color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.uni-select[data-v-6b64008e] {
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.lower-rfid {
|
|||
|
|
flex: 1;
|
|||
|
|
margin-top: -3%;
|
|||
|
|
border-radius: 25rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 0 25rpx;
|
|||
|
|
|
|||
|
|
.stat-cont {
|
|||
|
|
width: 100%;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 15rpx;
|
|||
|
|
|
|||
|
|
.cont-upper {
|
|||
|
|
width: 100%;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
align-items: center;
|
|||
|
|
margin-bottom: 20rpx;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.cont-lower {
|
|||
|
|
width: 100%;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
|
|||
|
|
view {
|
|||
|
|
width: 100%;
|
|||
|
|
display: flex;
|
|||
|
|
align-items: center;
|
|||
|
|
margin-bottom: 20rpx;
|
|||
|
|
|
|||
|
|
h4 {
|
|||
|
|
width: 35%;
|
|||
|
|
font-weight: normal;
|
|||
|
|
font-size: 14px;
|
|||
|
|
color: #929292;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
span {
|
|||
|
|
font-size: 14px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.btns-area {
|
|||
|
|
position: absolute;
|
|||
|
|
width: 70%;
|
|||
|
|
left: 15%;
|
|||
|
|
bottom: 5%;
|
|||
|
|
height: 15%;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
justify-content: space-around;
|
|||
|
|
|
|||
|
|
view {
|
|||
|
|
width: 100%;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
padding: 15rpx 0;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
background-color: #3888ff;
|
|||
|
|
color: #fff;
|
|||
|
|
font-size: 14px;
|
|||
|
|
border-radius: 25rpx;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 添加新的加载效果样式
|
|||
|
|
.custom-loading-overlay {
|
|||
|
|
position: fixed;
|
|||
|
|
top: 0;
|
|||
|
|
left: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
background-color: rgba(0, 0, 0, 0.5);
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: center;
|
|||
|
|
align-items: center;
|
|||
|
|
z-index: 9999;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.custom-loading-content {
|
|||
|
|
background-color: white;
|
|||
|
|
padding: 20px;
|
|||
|
|
border-radius: 10px;
|
|||
|
|
display: flex;
|
|||
|
|
flex-direction: column;
|
|||
|
|
align-items: center;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.custom-spinner {
|
|||
|
|
width: 40px;
|
|||
|
|
height: 40px;
|
|||
|
|
border: 4px solid #f3f3f3;
|
|||
|
|
border-top: 4px solid #3498db;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
animation: spin 1s linear infinite;
|
|||
|
|
margin-bottom: 10px;
|
|||
|
|
}
|
|||
|
|
</style>
|