|
|
@@ -1,16 +1,658 @@ |
|
|
|
<template> |
|
|
|
<div> |
|
|
|
111 |
|
|
|
</div> |
|
|
|
<div class="box-center"> |
|
|
|
<div class="app-titel"> |
|
|
|
<div class="toptimeqhuan"> |
|
|
|
<div :class="{ tophove: dateType == 4 }" @click="tabtimetap(4)"> |
|
|
|
近7天 |
|
|
|
</div> |
|
|
|
<div :class="{ tophove: dateType == 5 }" @click="tabtimetap(5)"> |
|
|
|
近15天 |
|
|
|
</div> |
|
|
|
<div :class="{ tophove: dateType == 6 }" @click="tabtimetap(6)"> |
|
|
|
近30天 |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style="margin-left: 26px"> |
|
|
|
<el-date-picker |
|
|
|
v-model="customtime" |
|
|
|
@change="confirmtime()" |
|
|
|
type="daterange" |
|
|
|
range-separator="-" |
|
|
|
:default-time="['00:00:00', '23:59:59']" |
|
|
|
value-format="yyyy-MM-dd" |
|
|
|
start-placeholder="开始日期" |
|
|
|
end-placeholder="结束日期" |
|
|
|
> |
|
|
|
</el-date-picker> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="app-titel"> |
|
|
|
<div style="margin-left: 26px" class="div-lab"> |
|
|
|
<div class="label">团队</div> |
|
|
|
<el-select |
|
|
|
v-model="deptId" |
|
|
|
filterable |
|
|
|
@change="deptChange" |
|
|
|
placeholder="请选择" |
|
|
|
class="div-inp" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in options" |
|
|
|
:key="item.deptId" |
|
|
|
:label="item.name" |
|
|
|
:value="item.deptId" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
<div style="margin-left: 26px" class="div-lab"> |
|
|
|
<div style="margin-right: 20px" class="label">置业顾问</div> |
|
|
|
<el-select |
|
|
|
v-model="accountId" |
|
|
|
filterable |
|
|
|
@change="repChange" |
|
|
|
placeholder="请选择" |
|
|
|
class="div-inp" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in repList" |
|
|
|
:key="item.accountId" |
|
|
|
:label="item.name" |
|
|
|
:value="item.accountId" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
<div style="margin-left: 20px"> |
|
|
|
<el-button type="primary" size="small" @click="screen()" |
|
|
|
>查询</el-button |
|
|
|
> |
|
|
|
<el-button type="primary" size="small" @click="reset()">清空</el-button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- 表格 --> |
|
|
|
<div class="cen-tab"> |
|
|
|
<el-table max-height="300" :data="tableData" stripe style="width: 100%"> |
|
|
|
<el-table-column prop="batchId" label="序号" align="center"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
{{ |
|
|
|
scope.$index == tableData.length - 1 |
|
|
|
? "合计/平均" |
|
|
|
: scope.$index + 1 |
|
|
|
}} |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="accountName" label="日期" align="center"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
{{ |
|
|
|
scope.$index == tableData.length - 1 |
|
|
|
? scope.row.statDate |
|
|
|
: scope.row.statDate.substring(0, 10) |
|
|
|
}} |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="receptionCount" label="接待量" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="accountNum" label="接待顾问" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="activeCustomer" label="有效录音" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="prohibitedCustomer" |
|
|
|
label="违禁接待次数" |
|
|
|
align="center" |
|
|
|
> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="sumDuration" label="接待时长(分)" align="center"> |
|
|
|
<template slot-scope="{ row }"> |
|
|
|
{{ Math.floor(row.sumDuration / 60) }} |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="prohibitedZb" |
|
|
|
label="违禁接待占比" |
|
|
|
align="center" |
|
|
|
> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="fraction" label="平均执行率" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
v-for="(item, idx) in tablist" |
|
|
|
:key="idx" |
|
|
|
:prop="item.props" |
|
|
|
:label="item.label" |
|
|
|
align="center" |
|
|
|
> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column label="操作" align="center"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<el-button |
|
|
|
v-if="scope.$index < tableData.length - 1" |
|
|
|
type="text" |
|
|
|
size="small" |
|
|
|
@click="toDetail(scope.row)" |
|
|
|
>详情</el-button |
|
|
|
> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
<div style="display: flex; justify-content: flex-end; margin-top: 10px"> |
|
|
|
<el-pagination |
|
|
|
@size-change="handleSizeChange" |
|
|
|
@current-change="handleCurrentChange" |
|
|
|
:current-page="current" |
|
|
|
:page-sizes="[8, 16, 24, 32]" |
|
|
|
:page-size="size" |
|
|
|
layout="total, sizes, prev, pager, next, jumper" |
|
|
|
:total="total" |
|
|
|
> |
|
|
|
</el-pagination> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<el-dialog |
|
|
|
title="详情" |
|
|
|
:visible.sync="dialogVisible" |
|
|
|
width="80%" |
|
|
|
:before-close="handleClose" |
|
|
|
> |
|
|
|
<div class="cen-tab"> |
|
|
|
<el-table |
|
|
|
max-height="300" |
|
|
|
:data="detailData" |
|
|
|
stripe |
|
|
|
style="width: 100%" |
|
|
|
> |
|
|
|
<el-table-column prop="batchId" label="序号" align="center"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
{{ |
|
|
|
scope.$index == detailData.length - 1 |
|
|
|
? "合计/平均" |
|
|
|
: scope.$index + 1 |
|
|
|
}} |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="accountName" label="顾问" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="deptName" label="归属团队" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="receptionCount" label="接待量" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="activeCustomer" |
|
|
|
label="有效录音" |
|
|
|
align="center" |
|
|
|
> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="prohibitedCustomer" |
|
|
|
label="违禁接待次数" |
|
|
|
align="center" |
|
|
|
> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="sumDuration" |
|
|
|
label="接待时长(分)" |
|
|
|
align="center" |
|
|
|
> |
|
|
|
<template slot-scope="{ row }"> |
|
|
|
{{ Math.floor(row.sumDuration / 60) }} |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="prohibitedZb" |
|
|
|
label="违禁接待占比" |
|
|
|
align="center" |
|
|
|
> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="fraction" label="平均执行率" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
v-for="(item, idx) in tablist1" |
|
|
|
:key="idx" |
|
|
|
:prop="item.props" |
|
|
|
:label="item.label" |
|
|
|
align="center" |
|
|
|
> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
<div style="display: flex; justify-content: flex-end; margin-top: 10px"> |
|
|
|
<el-pagination |
|
|
|
@size-change="handleSizeChange1" |
|
|
|
@current-change="handleCurrentChange1" |
|
|
|
:current-page="current1" |
|
|
|
:page-sizes="[8, 16, 24, 32]" |
|
|
|
:page-size="size1" |
|
|
|
layout="total, sizes, prev, pager, next, jumper" |
|
|
|
:total="total1" |
|
|
|
> |
|
|
|
</el-pagination> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<span slot="footer" class="dialog-footer"> |
|
|
|
<el-button @click="dialogVisible = false">取 消</el-button> |
|
|
|
<el-button type="primary" @click="dialogVisible = false" |
|
|
|
>确 定</el-button |
|
|
|
> |
|
|
|
</span> |
|
|
|
</el-dialog> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
export default { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
houseId: "", |
|
|
|
buildingoptions: [], |
|
|
|
houseList: [], |
|
|
|
detailData: [], |
|
|
|
dateType: 2, |
|
|
|
repList: [], |
|
|
|
current: 1, |
|
|
|
current1: 1, |
|
|
|
accountId: "", |
|
|
|
size: 8, |
|
|
|
total: 20, |
|
|
|
size1: 8, |
|
|
|
total1: 20, |
|
|
|
customtime: [], |
|
|
|
tablist: [], |
|
|
|
tablist1: [], |
|
|
|
deptId: "", |
|
|
|
tableData: [], |
|
|
|
orgType: localStorage.getItem("orgType"), |
|
|
|
options: [], |
|
|
|
value: "1", |
|
|
|
statDateStart: "", |
|
|
|
statDateEnd: "", |
|
|
|
echarlist: [], |
|
|
|
echarlist1: [], |
|
|
|
echarlist2: [], |
|
|
|
echarlist3: [], |
|
|
|
teamAllLevel: [], |
|
|
|
teamAllLevelid: "", |
|
|
|
teamAllLeve2id: "", |
|
|
|
teamAllLeve2: [], |
|
|
|
statDate: "", |
|
|
|
dialogVisible: false, |
|
|
|
}; |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
this.houseId = localStorage.getItem("houseId"); |
|
|
|
this.tabtimetap(4); |
|
|
|
this.deptFindList(); |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
toDetail(row) { |
|
|
|
console.log(row); |
|
|
|
this.statDate = row.statDate.substring(0, 10); |
|
|
|
this.dialogVisible = true; |
|
|
|
this.getDetailList(); |
|
|
|
}, |
|
|
|
// 获取detail |
|
|
|
getDetailList() { |
|
|
|
this.$api.api |
|
|
|
.receptionStatistics({ |
|
|
|
houseId: this.houseId, |
|
|
|
statDate: this.statDate, |
|
|
|
current: this.current, |
|
|
|
size: this.size, |
|
|
|
deptId: this.deptId, |
|
|
|
accountId: this.accountId, |
|
|
|
type:2 |
|
|
|
}) |
|
|
|
.then((res) => { |
|
|
|
this.detailData = res.data.records; |
|
|
|
// 数据处理 |
|
|
|
// 需要两个数组,一个用来展示 |
|
|
|
this.deailDate(0); |
|
|
|
this.total1 = res.data.total; |
|
|
|
}); |
|
|
|
}, |
|
|
|
screen() { |
|
|
|
this.current = 1; |
|
|
|
this.accountRank(); |
|
|
|
}, |
|
|
|
reset() { |
|
|
|
this.current = 1; |
|
|
|
this.deptId = ""; |
|
|
|
this.accountId = ""; |
|
|
|
this.accountRank(); |
|
|
|
}, |
|
|
|
handleClose(done) { |
|
|
|
this.$confirm("确认关闭?") |
|
|
|
.then((_) => { |
|
|
|
done(); |
|
|
|
}) |
|
|
|
.catch((_) => {}); |
|
|
|
}, |
|
|
|
deptFindList() { |
|
|
|
// 获取团队 |
|
|
|
this.$api.api |
|
|
|
.deptFindList({ |
|
|
|
houseId: this.houseId, |
|
|
|
}) |
|
|
|
.then((res) => { |
|
|
|
this.options = [ |
|
|
|
{ |
|
|
|
name: "全部", |
|
|
|
deptId: "", |
|
|
|
}, |
|
|
|
]; |
|
|
|
this.options.push(...res.data); |
|
|
|
this.accountRank(); |
|
|
|
}); |
|
|
|
}, |
|
|
|
deptChange() { |
|
|
|
this.receptionStatisticsAllAccount(); |
|
|
|
this.accountId = ""; |
|
|
|
}, |
|
|
|
receptionStatisticsAllAccount() { |
|
|
|
this.$api.api |
|
|
|
.receptionStatisticsAllAccount({ |
|
|
|
houseId: this.houseId, |
|
|
|
deptId: this.deptId, |
|
|
|
}) |
|
|
|
.then((res) => { |
|
|
|
console.log(res); |
|
|
|
this.repList = [ |
|
|
|
{ |
|
|
|
name: "全部", |
|
|
|
deptId: "", |
|
|
|
}, |
|
|
|
]; |
|
|
|
this.repList.push(...res.data); |
|
|
|
this.accountRank(); |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 获取列表 |
|
|
|
repChange() { |
|
|
|
this.accountRank(); |
|
|
|
}, |
|
|
|
accountRank() { |
|
|
|
this.$api.api |
|
|
|
.receptionStatistics({ |
|
|
|
houseId: this.houseId, |
|
|
|
statDateStart: this.statDateStart, |
|
|
|
statDateEnd: this.statDateEnd, |
|
|
|
current: this.current, |
|
|
|
size: this.size, |
|
|
|
deptId: this.deptId, |
|
|
|
accountId: this.accountId, |
|
|
|
dateType: this.dateType == 7 ? null : this.dateType, |
|
|
|
type:1 |
|
|
|
}) |
|
|
|
.then((res) => { |
|
|
|
this.tableData = res.data.records; |
|
|
|
// 数据处理 |
|
|
|
// 需要两个数组,一个用来展示 |
|
|
|
this.deailDate(); |
|
|
|
this.total = res.data.total; |
|
|
|
}); |
|
|
|
}, |
|
|
|
confirmtime() { |
|
|
|
this.dateType = 7; |
|
|
|
this.statDateStart = this.customtime[0]; |
|
|
|
this.statDateEnd = this.customtime[1]; |
|
|
|
this.init(); |
|
|
|
}, |
|
|
|
init() { |
|
|
|
this.accountRank(); |
|
|
|
}, |
|
|
|
deailDate(idx) { |
|
|
|
if (idx) { |
|
|
|
this.tablist1 = []; |
|
|
|
// 当他是第一个 小将 |
|
|
|
// console.log("第一个"); |
|
|
|
this.deailDate[0].resultsList.map((item, idx) => { |
|
|
|
let obj = {}; |
|
|
|
obj.label = item.name; |
|
|
|
obj.props = "str" + idx; |
|
|
|
this.tablist1.push(obj); |
|
|
|
}); |
|
|
|
this.deailDate.map((item) => { |
|
|
|
this.tablist1.map((item1, idx) => { |
|
|
|
item[item1.props] = item.resultsList[idx].zxl; |
|
|
|
}); |
|
|
|
}); |
|
|
|
} else { |
|
|
|
this.tablist = []; |
|
|
|
// 当他是第一个 小将 |
|
|
|
// console.log("第一个"); |
|
|
|
this.tableData[0].resultsList.map((item, idx) => { |
|
|
|
let obj = {}; |
|
|
|
obj.label = item.name; |
|
|
|
obj.props = "str" + idx; |
|
|
|
this.tablist.push(obj); |
|
|
|
}); |
|
|
|
this.tableData.map((item) => { |
|
|
|
this.tablist.map((item1, idx) => { |
|
|
|
item[item1.props] = item.resultsList[idx].zxl; |
|
|
|
}); |
|
|
|
}); |
|
|
|
} |
|
|
|
}, |
|
|
|
handleCurrentChange(e) { |
|
|
|
this.current = e; |
|
|
|
this.accountRank(); |
|
|
|
}, |
|
|
|
handleSizeChange(e) { |
|
|
|
this.size = e; |
|
|
|
this.accountRank(); |
|
|
|
}, |
|
|
|
handleCurrentChange1(e) { |
|
|
|
this.current1 = e; |
|
|
|
// this.accountRank(); |
|
|
|
}, |
|
|
|
handleSizeChange1(e) { |
|
|
|
this.size1 = e; |
|
|
|
// this.accountRank(); |
|
|
|
}, |
|
|
|
//切换时间 |
|
|
|
tabtimetap(index) { |
|
|
|
this.statDateStart = ""; |
|
|
|
this.statDateEnd = ""; |
|
|
|
this.dateType = index; |
|
|
|
this.init(); |
|
|
|
}, |
|
|
|
dealData(arr) { |
|
|
|
let num = Math.max.apply( |
|
|
|
Math, |
|
|
|
arr.map(function (o) { |
|
|
|
return o.zxl; |
|
|
|
}) |
|
|
|
); //结果:3 |
|
|
|
arr.map((item) => { |
|
|
|
item.zxl1 = Math.floor((item.zxl / num) * 100); |
|
|
|
}); |
|
|
|
return arr; |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |
|
|
|
|
|
|
|
<style scoped="scoped" lang="scss" > |
|
|
|
.box-center { |
|
|
|
width: 100%; |
|
|
|
padding: 15px; |
|
|
|
min-width: 1200px; |
|
|
|
padding-bottom: 100px; |
|
|
|
} |
|
|
|
.cen-tab { |
|
|
|
width: 100%; |
|
|
|
padding: 15px; |
|
|
|
background: #ffffff; |
|
|
|
margin-top: 15px; |
|
|
|
} |
|
|
|
.tophove { |
|
|
|
color: #ffffff; |
|
|
|
background: #2671e2; |
|
|
|
} |
|
|
|
.app-titel { |
|
|
|
width: 100%; |
|
|
|
height: 70px; |
|
|
|
background: #ffffff; |
|
|
|
box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.04); |
|
|
|
border-radius: 4px; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
flex-wrap: wrap; |
|
|
|
.titel-text { |
|
|
|
height: 100%; |
|
|
|
font-size: 18px; |
|
|
|
font-weight: 600; |
|
|
|
color: #32363d; |
|
|
|
line-height: 70px; |
|
|
|
margin-left: 30px; |
|
|
|
} |
|
|
|
.toptimeqhuan { |
|
|
|
width: 190px; |
|
|
|
height: 32px; |
|
|
|
background: #ffffff; |
|
|
|
border-radius: 4px; |
|
|
|
border: 1px solid #e0e0e0; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
overflow: hidden; |
|
|
|
margin-left: 30px; |
|
|
|
cursor: pointer; |
|
|
|
} |
|
|
|
.toptimeqhuan div { |
|
|
|
flex: 1; |
|
|
|
text-align: center; |
|
|
|
line-height: 32px; |
|
|
|
font-size: 16px; |
|
|
|
} |
|
|
|
} |
|
|
|
</script> |
|
|
|
|
|
|
|
<style lang="" scoped > |
|
|
|
.app-box-san { |
|
|
|
width: 100%; |
|
|
|
height: 400px; |
|
|
|
display: flex; |
|
|
|
margin-top: 15px; |
|
|
|
.zuo { |
|
|
|
flex: 1; |
|
|
|
height: 100%; |
|
|
|
margin-right: 15px; |
|
|
|
background: #ffffff; |
|
|
|
border-radius: 4px; |
|
|
|
.title { |
|
|
|
width: 100%; |
|
|
|
height: 55px; |
|
|
|
border-bottom: 1px solid #e0e0e0; |
|
|
|
display: flex; |
|
|
|
align-content: center; |
|
|
|
.text1 { |
|
|
|
flex: 2; |
|
|
|
line-height: 55px; |
|
|
|
text-indent: 20px; |
|
|
|
font-weight: 500; |
|
|
|
font-size: 16px; |
|
|
|
color: #333333; |
|
|
|
} |
|
|
|
.text2 { |
|
|
|
flex: 1; |
|
|
|
height: 55px; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.you { |
|
|
|
height: 100%; |
|
|
|
flex: 1; |
|
|
|
background: #ffffff; |
|
|
|
border-radius: 4px; |
|
|
|
.title { |
|
|
|
width: 100%; |
|
|
|
height: 55px; |
|
|
|
border-bottom: 1px solid #e0e0e0; |
|
|
|
display: flex; |
|
|
|
align-content: center; |
|
|
|
.text1 { |
|
|
|
flex: 2; |
|
|
|
line-height: 55px; |
|
|
|
text-indent: 20px; |
|
|
|
font-weight: 500; |
|
|
|
font-size: 16px; |
|
|
|
color: #333333; |
|
|
|
} |
|
|
|
.text2 { |
|
|
|
flex: 1; |
|
|
|
height: 55px; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.hejisan { |
|
|
|
width: 92%; |
|
|
|
margin: 0 auto; |
|
|
|
display: flex; |
|
|
|
padding-top: 10px; |
|
|
|
padding-bottom: 10px; |
|
|
|
.text1-1 { |
|
|
|
color: #666666; |
|
|
|
} |
|
|
|
.text1-2 { |
|
|
|
color: #333333; |
|
|
|
margin-top: 10px; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// 进度条 |
|
|
|
.jinbox { |
|
|
|
width: 100%; |
|
|
|
height: 18px; |
|
|
|
line-height: 18px; |
|
|
|
display: flex; |
|
|
|
font-size: 16px; |
|
|
|
color: #2c3542; |
|
|
|
margin-top: 10px; |
|
|
|
.jinboxtit { |
|
|
|
width: 14%; |
|
|
|
height: 18px; |
|
|
|
padding-right: 6px; |
|
|
|
white-space: nowrap; |
|
|
|
text-overflow: ellipsis; |
|
|
|
overflow: hidden; |
|
|
|
} |
|
|
|
.jinbox-box { |
|
|
|
width: 75%; |
|
|
|
height: 100%; |
|
|
|
border-radius: 8px; |
|
|
|
background: #f2f2f2; |
|
|
|
} |
|
|
|
.boxbaifenbi { |
|
|
|
height: 100%; |
|
|
|
background: #60d7a0; |
|
|
|
border-radius: 8px; |
|
|
|
} |
|
|
|
.boxbaifenbi2 { |
|
|
|
height: 100%; |
|
|
|
background: #5b8ff9; |
|
|
|
} |
|
|
|
.jinboxbott { |
|
|
|
width: 16%; |
|
|
|
text-indent: 50px; |
|
|
|
} |
|
|
|
} |
|
|
|
.div-lab { |
|
|
|
display: flex; |
|
|
|
margin: 5px; |
|
|
|
} |
|
|
|
.div-inp { |
|
|
|
width: 200px; |
|
|
|
} |
|
|
|
.label { |
|
|
|
font-size: 14px; |
|
|
|
font-weight: 400; |
|
|
|
color: #32363d; |
|
|
|
line-height: 32px; |
|
|
|
margin-left: 15px; |
|
|
|
min-width: 40px; |
|
|
|
} |
|
|
|
</style> |