账号信息添加打卡记录
This commit is contained in:
parent
0b4a4cdd92
commit
0d2250d417
|
|
@ -69,13 +69,6 @@
|
||||||
<span v-if="scope.row.employee">{{scope.row.employee_.belong_dept_name}}</span>
|
<span v-if="scope.row.employee">{{scope.row.employee_.belong_dept_name}}</span>
|
||||||
</template>
|
</template>
|
||||||
</el-table-column>
|
</el-table-column>
|
||||||
<el-table-column label="打卡类型" prop="number">
|
|
||||||
<template #default="scope">
|
|
||||||
<span v-if="scope.row.type==10 || scope.row.type==20">
|
|
||||||
<el-tag :type="type_[scope.row.type].color">{{type_[scope.row.type].label}}</el-tag>
|
|
||||||
</span>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column label="触发形式" prop="type">
|
<el-table-column label="触发形式" prop="type">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
{{trigger_[scope.row.trigger]}}--
|
{{trigger_[scope.row.trigger]}}--
|
||||||
|
|
@ -92,6 +85,10 @@
|
||||||
</el-table-column> -->
|
</el-table-column> -->
|
||||||
<el-table-column label="考勤推测">
|
<el-table-column label="考勤推测">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
|
<span v-if="scope.row.type==10 || scope.row.type==20">
|
||||||
|
<el-tag :type="type_[scope.row.type].color">{{type_[scope.row.type].label}}</el-tag>
|
||||||
|
</span>
|
||||||
|
<span v-if="(scope.row.type==10 || scope.row.type==20)&&scope.row.exception_type!==null">-</span>
|
||||||
<span v-if="scope.row.exception_type==10" class="nomalState type1">在岗时间短</span>
|
<span v-if="scope.row.exception_type==10" class="nomalState type1">在岗时间短</span>
|
||||||
<span v-if="scope.row.exception_type==20" class="nomalState type2">在岗时间长</span>
|
<span v-if="scope.row.exception_type==20" class="nomalState type2">在岗时间长</span>
|
||||||
<span v-if="scope.row.exception_type==30" class="nomalState type3">缺卡</span>
|
<span v-if="scope.row.exception_type==30" class="nomalState type3">缺卡</span>
|
||||||
|
|
@ -191,8 +188,6 @@
|
||||||
that.cLoading = false;
|
that.cLoading = false;
|
||||||
that.ElLoading.close();
|
that.ElLoading.close();
|
||||||
let urls = config.API_URL.slice(0,-4)+res.path;
|
let urls = config.API_URL.slice(0,-4)+res.path;
|
||||||
console.log(urls)
|
|
||||||
|
|
||||||
window.open(urls, "_blank");
|
window.open(urls, "_blank");
|
||||||
}).catch(e=>{
|
}).catch(e=>{
|
||||||
that.cLoading = false;
|
that.cLoading = false;
|
||||||
|
|
|
||||||
|
|
@ -60,6 +60,7 @@ export default {
|
||||||
account: defineAsyncComponent(() => import("./user/account")),
|
account: defineAsyncComponent(() => import("./user/account")),
|
||||||
seting: defineAsyncComponent(() => import("./user/seting")),
|
seting: defineAsyncComponent(() => import("./user/seting")),
|
||||||
pushSettings: defineAsyncComponent(() => import("./user/pushSettings")),
|
pushSettings: defineAsyncComponent(() => import("./user/pushSettings")),
|
||||||
|
clockRecord: defineAsyncComponent(() => import("./user/clock_record")),
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
|
@ -82,6 +83,11 @@ export default {
|
||||||
title: "修改密码",
|
title: "修改密码",
|
||||||
component: "pushSettings",
|
component: "pushSettings",
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
icon: "el-icon-platform",
|
||||||
|
title: "打卡记录",
|
||||||
|
component: "clockRecord",
|
||||||
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,455 @@
|
||||||
|
<template>
|
||||||
|
<el-container>
|
||||||
|
<el-header>
|
||||||
|
<div class="left-panel">
|
||||||
|
<el-date-picker
|
||||||
|
v-model="monthV"
|
||||||
|
type="month"
|
||||||
|
style="margin-left:4px"
|
||||||
|
placeholder="选择月份"
|
||||||
|
@change="handleQuery"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div class="right-panel">
|
||||||
|
<div class="right-panel-search">
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
:loading = 'cLoading'
|
||||||
|
icon="el-icon-download"
|
||||||
|
@click="exportExcel"
|
||||||
|
>下载记录</el-button>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
:loading = 'dLoading'
|
||||||
|
icon="el-icon-download"
|
||||||
|
@click="exportList"
|
||||||
|
>下载统计</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</el-header>
|
||||||
|
<el-main class="nopadding">
|
||||||
|
<el-table
|
||||||
|
ref="table"
|
||||||
|
:data="tableDaata"
|
||||||
|
row-key="id"
|
||||||
|
stripe
|
||||||
|
>
|
||||||
|
<el-table-column label="人员类型" prop="employee">
|
||||||
|
<template #default="scope">
|
||||||
|
<span v-if="scope.row.employee">{{epOptions[scope.row.employee_.type]}}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="人员" prop="employee">
|
||||||
|
<template #default="scope">
|
||||||
|
<span v-if="scope.row.employee">{{scope.row.employee_.name}}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="所属部门" prop="employee">
|
||||||
|
<template #default="scope">
|
||||||
|
<span v-if="scope.row.employee">{{scope.row.employee_.belong_dept_name}}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="触发形式" prop="type">
|
||||||
|
<template #default="scope">
|
||||||
|
{{trigger_[scope.row.trigger]}}--
|
||||||
|
<span v-if="scope.row.detail">{{scope.row.detail.deviceName}}</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="考勤推测">
|
||||||
|
<template #default="scope">
|
||||||
|
<span v-if="scope.row.type==10 || scope.row.type==20">
|
||||||
|
<el-tag :type="type_[scope.row.type].color">{{type_[scope.row.type].label}}</el-tag>
|
||||||
|
</span>
|
||||||
|
<span v-if="(scope.row.type==10 || scope.row.type==20)&&scope.row.exception_type!==null">-</span>
|
||||||
|
<span v-if="scope.row.exception_type==10" class="nomalState type1">在岗时间短</span>
|
||||||
|
<span v-if="scope.row.exception_type==20" class="nomalState type2">在岗时间长</span>
|
||||||
|
<span v-if="scope.row.exception_type==30" class="nomalState type3">缺卡</span>
|
||||||
|
<span v-if="scope.row.exception_type==40" class="nomalState type4">加班</span>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="打卡时间" prop="create_time"></el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<el-pagination
|
||||||
|
background
|
||||||
|
:small="true"
|
||||||
|
:total="dataTotal"
|
||||||
|
layout="total, sizes, prev, pager, next, jumper"
|
||||||
|
:page-size="query.page_size"
|
||||||
|
:page-sizes="[20, 50, 100, 200]" v-model:currentPage="query.page"
|
||||||
|
@current-change="getList" @update:page-size="getList"></el-pagination>
|
||||||
|
</el-main>
|
||||||
|
</el-container>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import config from "@/config"
|
||||||
|
import * as XLSX2 from "xlsx";
|
||||||
|
import * as XLSX from "xlsx-style";
|
||||||
|
export default {
|
||||||
|
name: "clock_record",
|
||||||
|
components: {},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
userForm:{},
|
||||||
|
tableData:[],
|
||||||
|
monthV: null,
|
||||||
|
query: {
|
||||||
|
page:1,
|
||||||
|
page_size:20,
|
||||||
|
year:'',
|
||||||
|
month:'',
|
||||||
|
employee:''
|
||||||
|
},
|
||||||
|
dataTotal:0,
|
||||||
|
selection: [],
|
||||||
|
type_:{
|
||||||
|
10: {"label": "上班打卡", "color": ""},
|
||||||
|
20: {"label": "下班打卡", "color": "success"},
|
||||||
|
},
|
||||||
|
epOptions:{
|
||||||
|
"employee": "正式员工",
|
||||||
|
"remployee": "相关方"
|
||||||
|
},
|
||||||
|
trigger_:{
|
||||||
|
"door": "门禁",
|
||||||
|
"location": "定位"
|
||||||
|
},
|
||||||
|
tableDaata:[],
|
||||||
|
excelName:'',
|
||||||
|
weekList : ['姓名','星期'],
|
||||||
|
daysList:['姓名','日期'],
|
||||||
|
dLoading: false,
|
||||||
|
cLoading:false,
|
||||||
|
ElLoading:null,
|
||||||
|
deptSearch:{},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getemployee();
|
||||||
|
this.ElLoading =null;
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
handleQuery(){
|
||||||
|
if(this.monthV){
|
||||||
|
this.query.year = this.monthV.getFullYear();
|
||||||
|
this.query.month = this.monthV.getMonth() + 1;
|
||||||
|
}else{
|
||||||
|
this.query.year = null;
|
||||||
|
this.query.month = null;
|
||||||
|
}
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
getemployee() {
|
||||||
|
let that = this;
|
||||||
|
that.$API.hrm.employee.read.req().then((res) => {
|
||||||
|
that.userForm = res;
|
||||||
|
that.query.employee = res.id;
|
||||||
|
that.getList();
|
||||||
|
});
|
||||||
|
},
|
||||||
|
getList(){
|
||||||
|
let that = this;
|
||||||
|
that.$API.hrm.clock_record.list.req(that.query)
|
||||||
|
.then(res=>{
|
||||||
|
that.tableDaata = res.results;
|
||||||
|
that.dataTotal = res.count;
|
||||||
|
})
|
||||||
|
},
|
||||||
|
exportExcel(){
|
||||||
|
let that = this;
|
||||||
|
if(that.query.year!=undefined &&that.query.year!=null && that.query.month!=undefined&& that.query.month!=null){
|
||||||
|
}else{
|
||||||
|
that.$message.warning("请选择月份后导出")
|
||||||
|
that.cLoading = false;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if(that.monthV){
|
||||||
|
that.query.year = that.monthV.getFullYear();
|
||||||
|
that.query.month = that.monthV.getMonth() + 1;
|
||||||
|
}else{
|
||||||
|
that.query.year = null;
|
||||||
|
that.query.month = null;
|
||||||
|
}
|
||||||
|
that.cLoading = true;
|
||||||
|
that.ElLoading = this.$loading({
|
||||||
|
lock: true,
|
||||||
|
text: '数据请求中，请稍后...',
|
||||||
|
background: 'rgba(0, 0, 0, 0)',
|
||||||
|
})
|
||||||
|
that.$API.hrm.clock_record.export_excel.req(that.query)
|
||||||
|
.then(res=>{
|
||||||
|
that.cLoading = false;
|
||||||
|
that.ElLoading.close();
|
||||||
|
let urls = config.API_URL.slice(0,-4)+res.path;
|
||||||
|
console.log(urls)
|
||||||
|
|
||||||
|
window.open(urls, "_blank");
|
||||||
|
}).catch(e=>{
|
||||||
|
that.cLoading = false;
|
||||||
|
that.ElLoading.close();
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//循环调用的接口
|
||||||
|
getOneData(id){
|
||||||
|
let that = this;
|
||||||
|
return new Promise((resolve,reject)=>{
|
||||||
|
that.$API.hrm.clock_record.list.req({page:1,page_size:499,type__in:'10,20',year:that.query.year,month:that.query.month,employee:id})
|
||||||
|
.then(res=>{
|
||||||
|
resolve(res.results)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
exportList(){
|
||||||
|
let that = this;
|
||||||
|
that.dLoading = true;
|
||||||
|
if(that.query.year!=undefined &&that.query.year!=null && that.query.month!=undefined&& that.query.month!=null){
|
||||||
|
}else{
|
||||||
|
that.$message.warning("请选择月份后导出")
|
||||||
|
that.dLoading = false;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
let days = new Date(that.query.year, that.query.month , 0).getDate();
|
||||||
|
let weekList = ['姓名','星期'],daysList=['姓名','日期'],titleData = [];
|
||||||
|
for(var i = 1;i<= days;i++){
|
||||||
|
let weekNum = new Date(that.query.year+'-'+that.query.month+'-'+i).getDay();
|
||||||
|
let week=that.getDayWeek(weekNum)
|
||||||
|
daysList.push(i);
|
||||||
|
weekList.push(week);
|
||||||
|
}
|
||||||
|
let chartName = that.userForm.name+that.query.year+'年'+that.query.month+'月考勤统计表';
|
||||||
|
titleData.push(chartName)
|
||||||
|
let tableData = [];
|
||||||
|
tableData.push(titleData)
|
||||||
|
tableData.push(weekList)
|
||||||
|
tableData.push(daysList)
|
||||||
|
that.ElLoading = that.$loading({
|
||||||
|
lock: true,
|
||||||
|
text: '数据请求中，请稍后...',
|
||||||
|
background: 'rgba(0, 0, 0, 0)',
|
||||||
|
})
|
||||||
|
let rowData1 = [],rowData2=[];
|
||||||
|
rowData1 = [
|
||||||
|
that.userForm.name,
|
||||||
|
'上班打卡',
|
||||||
|
]
|
||||||
|
rowData2 = [
|
||||||
|
that.userForm.name,
|
||||||
|
'下班打卡',
|
||||||
|
]
|
||||||
|
let query = that.query;
|
||||||
|
query.page_size = 499;
|
||||||
|
query.type__in = '10,20';
|
||||||
|
that.$API.hrm.clock_record.list.req(query)
|
||||||
|
.then(res=>{
|
||||||
|
let recordList = res.results;
|
||||||
|
for(let i=0;i<recordList.length;i++){
|
||||||
|
let dateInd = new Date(recordList[i].create_time).getDate();
|
||||||
|
let dateIndex = parseInt(dateInd);
|
||||||
|
if(recordList[i].type==10){
|
||||||
|
rowData1[dateIndex+1] = recordList[i].create_time.substring(11,16)+'&'+recordList[i].exception_type;
|
||||||
|
}else{
|
||||||
|
rowData2[dateIndex+1] = recordList[i].create_time.substring(11,16)+'&'+recordList[i].exception_type;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
tableData.push(rowData1);
|
||||||
|
tableData.push(rowData2);
|
||||||
|
let ws = XLSX2.utils.aoa_to_sheet(tableData);
|
||||||
|
let wb = XLSX2.utils.book_new();
|
||||||
|
ws['!freeze'] = {
|
||||||
|
xSplit: "1", //冻结列
|
||||||
|
ySplit: "1", //冻结行
|
||||||
|
topLeftCell: "B2", //在未冻结区域的左上角显示的单元格，默认为第一个未冻结的单元格
|
||||||
|
state: "frozen"
|
||||||
|
}
|
||||||
|
for(let key in ws){
|
||||||
|
if(key.indexOf('!')!==0){
|
||||||
|
if(key==='A1'){
|
||||||
|
ws[key].s = {
|
||||||
|
font: {
|
||||||
|
sz: "12",
|
||||||
|
bold: true
|
||||||
|
},
|
||||||
|
alignment: {
|
||||||
|
horizontal: "center", vertical: "center"
|
||||||
|
},
|
||||||
|
fill: {
|
||||||
|
bgColor: { rgb: "FFFFAA00" },
|
||||||
|
fgColor: { rgb: "FFFFAA00" }
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}else{
|
||||||
|
let cal = ws[key]['v']+'';
|
||||||
|
let type = null;
|
||||||
|
if(cal.indexOf('&')>-1){
|
||||||
|
ws[key]['v'] = cal.split('&')[0]
|
||||||
|
type = cal.split('&')[1];
|
||||||
|
}
|
||||||
|
if(type!==null&&type!=='null'){
|
||||||
|
console.log('type:'+type)
|
||||||
|
if(type==='10'){//在岗时间短-----黄色
|
||||||
|
ws[key].s = {
|
||||||
|
font: {sz: 10},
|
||||||
|
alignment: { horizontal: 'center', vertical: 'center' },
|
||||||
|
fill: {
|
||||||
|
bgColor: { rgb: "F8DD4E" },
|
||||||
|
fgColor: { rgb: "F8DD4E" },
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}else if(type==='20'){//在岗时间长----红色
|
||||||
|
ws[key]['s'] = {
|
||||||
|
font: {
|
||||||
|
sz: 10,
|
||||||
|
},
|
||||||
|
alignment: { horizontal: 'center', vertical: 'center'},
|
||||||
|
fill: {
|
||||||
|
bgColor: { rgb: "FF0000" },
|
||||||
|
fgColor: { rgb: "FF0000" }
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}else if(type==='30'){//缺卡-----橙色
|
||||||
|
ws[key]['s'] = {
|
||||||
|
font: {
|
||||||
|
sz: 10,
|
||||||
|
},
|
||||||
|
alignment: { horizontal: 'center', vertical: 'center'},
|
||||||
|
fill: {
|
||||||
|
bgColor: { rgb: "FA8435" },
|
||||||
|
fgColor: { rgb: "FA8435" }
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}else if(type==='40'){//加班---蓝色
|
||||||
|
ws[key]['s'] = {
|
||||||
|
font: {
|
||||||
|
sz: 10,
|
||||||
|
},
|
||||||
|
alignment: { horizontal: 'center', vertical: 'center' },
|
||||||
|
fill: {
|
||||||
|
bgColor: { rgb: "44CEF6" },
|
||||||
|
fgColor: { rgb: "44CEF6" }
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}else{//正常--无色
|
||||||
|
ws[key]['s'] = {
|
||||||
|
font: {
|
||||||
|
sz: 10,
|
||||||
|
},
|
||||||
|
alignment: { horizontal: 'center', vertical: 'center'},
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
console.log(ws)
|
||||||
|
// s 意为 start ，即开始的单元格//r 是 row ，表示行号，从 0 计起//c 是 col ，表示列号，从 0 计起
|
||||||
|
let cNumber = daysList.length-1;
|
||||||
|
let merge = [{ s: { r: 0, c: 0 }, e: { r: 0, c:cNumber } }];//{ s: { r: 0, c: 0 }, e: { r: 1, c: 0 } },
|
||||||
|
for(let i = 1;i<tableData.length;i++){
|
||||||
|
merge.push({ s: { r: i, c: 0 }, e: { r: i+1, c: 0 } })
|
||||||
|
i++
|
||||||
|
}
|
||||||
|
ws['!merges'] = merge;
|
||||||
|
|
||||||
|
let closList = new Array(31).fill({wch: 5});
|
||||||
|
closList.unshift({wch:8})
|
||||||
|
closList.unshift({wch:10})
|
||||||
|
ws['!cols'] = closList;
|
||||||
|
let rows = new Array(500).fill({hpx: 15});
|
||||||
|
rows.unshift({hpx:20})
|
||||||
|
ws['!rows'] = rows; // 添加到sheet中
|
||||||
|
|
||||||
|
XLSX2.utils.book_append_sheet(wb, ws, chartName); // 工作簿名称
|
||||||
|
// XLSX2.writeFile(wb, chartName+'.xlsx'); // 保存的文件名
|
||||||
|
var wopts = {
|
||||||
|
bookType: 'xlsx', // 要生成的文件类型
|
||||||
|
bookSST: false, // 是否生成Shared String Table，官方解释是，如果开启生成速度会下降，但在低版本IOS设备上有更好的兼容性
|
||||||
|
type: 'binary'
|
||||||
|
};
|
||||||
|
var wbout = XLSX.write(wb, wopts);
|
||||||
|
var blob = new Blob([this.s2ab(wbout)], {
|
||||||
|
type: "application/octet-stream"
|
||||||
|
}); // 字符串转ArrayBuffer
|
||||||
|
// 导出excel文件 如导出后的文件不能打开，请将后缀替换为 .xls
|
||||||
|
this.openDownloadDialog(blob, chartName+`.xlsx`);
|
||||||
|
that.dLoading = false;
|
||||||
|
that.ElLoading.close();
|
||||||
|
}).catch(e=>{
|
||||||
|
that.dLoading = false;
|
||||||
|
that.ElLoading.close();
|
||||||
|
})
|
||||||
|
},
|
||||||
|
s2ab(s) {
|
||||||
|
var buf = new ArrayBuffer(s.length);
|
||||||
|
var view = new Uint8Array(buf);
|
||||||
|
for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
|
||||||
|
return buf;
|
||||||
|
},
|
||||||
|
openDownloadDialog(url, saveName) {
|
||||||
|
if (typeof url == 'object' && url instanceof Blob) {
|
||||||
|
url = URL.createObjectURL(url); // 创建blob地址
|
||||||
|
}
|
||||||
|
var aLink = document.createElement('a');
|
||||||
|
aLink.href = url;
|
||||||
|
aLink.download = saveName || ''; // HTML5新增的属性，指定保存文件名，可以不要后缀，注意，file:///模式下不会生效
|
||||||
|
var event;
|
||||||
|
if (window.MouseEvent) event = new MouseEvent('click');
|
||||||
|
else {
|
||||||
|
event = document.createEvent('MouseEvents');
|
||||||
|
event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
|
||||||
|
}
|
||||||
|
aLink.dispatchEvent(event);
|
||||||
|
},
|
||||||
|
getDayWeek(day){
|
||||||
|
switch(day){
|
||||||
|
case 0:
|
||||||
|
return '日';
|
||||||
|
case 1:
|
||||||
|
return '一';
|
||||||
|
case 2:
|
||||||
|
return '二';
|
||||||
|
case 3:
|
||||||
|
return '三';
|
||||||
|
case 4:
|
||||||
|
return '四';
|
||||||
|
case 5:
|
||||||
|
return '五';
|
||||||
|
case 6:
|
||||||
|
return '六';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style scoped>
|
||||||
|
.nomalState {
|
||||||
|
font-size: 12px;
|
||||||
|
padding: 0 9px;
|
||||||
|
|
||||||
|
height: 24px;
|
||||||
|
line-height: 23px;
|
||||||
|
border-radius: 5px;
|
||||||
|
vertical-align: top;
|
||||||
|
display: inline-block;
|
||||||
|
|
||||||
|
}
|
||||||
|
.nomalState.type1{
|
||||||
|
color: #F8DD4E;
|
||||||
|
background-color: #f9f7e6;
|
||||||
|
border: 1px solid #f3f0d5;
|
||||||
|
}
|
||||||
|
.nomalState.type2{
|
||||||
|
color: #FF0000;
|
||||||
|
background-color: #f7e7e7;
|
||||||
|
border: 1px solid #fbe0e0;
|
||||||
|
}
|
||||||
|
.nomalState.type3{
|
||||||
|
color: #FA8435;
|
||||||
|
background-color: #fef6ed;
|
||||||
|
border: 1px solid #fde9cc;
|
||||||
|
}
|
||||||
|
.nomalState.type4{
|
||||||
|
color: #44CEF6;
|
||||||
|
background-color: #f0f9fb;
|
||||||
|
border: 1px solid #d2f9ff;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue