|
|
@@ -6,60 +6,143 @@ |
|
|
|
* @Description: |
|
|
|
--> |
|
|
|
<template> |
|
|
|
<div style="display: flex; flex-direction: column; min-height: calc(100vh - 96px - 31px)"> |
|
|
|
<div class="app-container" style="padding: 16px 24px 0; max-height: 45vh; flex-grow: 1;"> |
|
|
|
<div |
|
|
|
style=" |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
min-height: calc(100vh - 96px - 31px); |
|
|
|
" |
|
|
|
> |
|
|
|
<div |
|
|
|
class="app-container" |
|
|
|
style="padding: 16px; max-height: 45vh; flex-grow: 1" |
|
|
|
> |
|
|
|
<!-- <div style="position: relative;z-index: 999;"> --> |
|
|
|
<el-form :model="listQuery" :inline="true" ref="dataForm" class="blueTip"> |
|
|
|
<el-form-item label="时间维度" prop="reportTime"> |
|
|
|
<el-select clearable v-model="timeSelect" placeholder="请选择"> |
|
|
|
<el-option v-for="item in timeList" :key="item.value" :label="item.label" :value="item.value"> |
|
|
|
<el-select |
|
|
|
clearable |
|
|
|
v-model="timeSelect" |
|
|
|
placeholder="请选择" |
|
|
|
style="width: 80px" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in timeList" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item v-show="timeSelect === 'month'" label="时间范围" prop="reportTime"> |
|
|
|
<el-date-picker clearable v-model="listQuery.reportTime" type="monthrange" range-separator="至" |
|
|
|
start-placeholder="开始月份" end-placeholder="结束月份" @change="changeTime"> |
|
|
|
<el-form-item |
|
|
|
v-show="timeSelect === 'month'" |
|
|
|
label="时间范围" |
|
|
|
prop="reportTime" |
|
|
|
> |
|
|
|
<el-date-picker |
|
|
|
clearable |
|
|
|
v-model="listQuery.reportTime" |
|
|
|
type="monthrange" |
|
|
|
range-separator="至" |
|
|
|
start-placeholder="开始月份" |
|
|
|
end-placeholder="结束月份" |
|
|
|
@change="changeTime" |
|
|
|
> |
|
|
|
</el-date-picker> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item v-show="timeSelect === 'year'" label="时间范围" prop="reportTime"> |
|
|
|
<el-date-picker clearable v-model="listQuery.reportTime[0]" value-format="yyyy" type="year" |
|
|
|
placeholder="开始时间"> |
|
|
|
<el-form-item |
|
|
|
v-show="timeSelect === 'year'" |
|
|
|
label="时间范围" |
|
|
|
prop="reportTime" |
|
|
|
> |
|
|
|
<el-date-picker |
|
|
|
clearable |
|
|
|
v-model="listQuery.reportTime[0]" |
|
|
|
value-format="yyyy" |
|
|
|
type="year" |
|
|
|
placeholder="开始时间" |
|
|
|
> |
|
|
|
</el-date-picker> |
|
|
|
~ |
|
|
|
<el-date-picker v-model="listQuery.reportTime[1]" value-format="yyyy" type="year" placeholder="结束时间" |
|
|
|
@change="getYear"> |
|
|
|
<el-date-picker |
|
|
|
v-model="listQuery.reportTime[1]" |
|
|
|
value-format="yyyy" |
|
|
|
type="year" |
|
|
|
placeholder="结束时间" |
|
|
|
@change="getYear" |
|
|
|
> |
|
|
|
</el-date-picker> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="工厂名称" prop="factoryId"> |
|
|
|
<el-select clearable v-model="listQuery.factoryId" placeholder="请选择工厂名称"> |
|
|
|
<el-option v-for="item in factoryList" :key="item.id" :label="item.name" :value="item.id"> |
|
|
|
<el-select |
|
|
|
multiple |
|
|
|
collapse-tags |
|
|
|
v-model="listQuery.factoryId" |
|
|
|
placeholder="请选择工厂名称" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in factoryList" |
|
|
|
:key="item.id" |
|
|
|
:label="item.name" |
|
|
|
:value="item.id" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="玻璃类型" prop="type"> |
|
|
|
<el-select clearable v-model="listQuery.type" placeholder="请选择玻璃类型"> |
|
|
|
<el-option v-for="item in typeList" :key="item.id" :label="item.name" :value="item.id"> |
|
|
|
<el-select |
|
|
|
clearable |
|
|
|
v-model="listQuery.type" |
|
|
|
placeholder="请选择玻璃类型" |
|
|
|
style="width: 120px" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in typeList" |
|
|
|
:key="item.id" |
|
|
|
:label="item.name" |
|
|
|
:value="item.id" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item> |
|
|
|
<el-button type="primary" size="small" @click="getDataList">查询</el-button> |
|
|
|
<el-button type="primary" size="small" plain @click="handleExport">导出</el-button> |
|
|
|
<el-button type="primary" size="small" @click="getDataList" |
|
|
|
>查询</el-button |
|
|
|
> |
|
|
|
<el-button type="primary" size="small" plain @click="handleExport" |
|
|
|
>导出</el-button |
|
|
|
> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
<!-- </div> --> |
|
|
|
<!-- <el-row style="height: 500px;"> --> |
|
|
|
<!-- <div> --> |
|
|
|
<line-chart class="yearChart" ref="lineChart" style="height: 35vh;width: 100%"></line-chart> |
|
|
|
<line-chart |
|
|
|
class="yearChart" |
|
|
|
ref="lineChart" |
|
|
|
style="height: 35vh; width: 100%" |
|
|
|
></line-chart> |
|
|
|
<!-- </div> --> |
|
|
|
<!-- </el-row> --> |
|
|
|
</div> |
|
|
|
<!-- <el-row style="height: 400px;"> --> |
|
|
|
<!-- </el-row> --> |
|
|
|
<div class="app-container" style="margin-top: 18px; height: unset; flex-grow: 1; padding: 16px;"> |
|
|
|
<search-bar :formConfigs="formConfig" ref="searchBarForm" @headBtnClick="buttonClick" /> |
|
|
|
<base-table :table-props="tableProps" :page="listQuery.pageNo" :limit="listQuery.pageSize" |
|
|
|
:table-data="tableData"> |
|
|
|
<div |
|
|
|
class="app-container" |
|
|
|
style="margin-top: 18px; height: unset; flex-grow: 1; padding: 16px" |
|
|
|
> |
|
|
|
<search-bar |
|
|
|
:formConfigs="formConfig" |
|
|
|
ref="searchBarForm" |
|
|
|
@headBtnClick="buttonClick" |
|
|
|
/> |
|
|
|
<base-table |
|
|
|
:table-props="tableProps" |
|
|
|
:page="listQuery.pageNo" |
|
|
|
:limit="listQuery.pageSize" |
|
|
|
:table-data="tableData" |
|
|
|
> |
|
|
|
</base-table> |
|
|
|
</div> |
|
|
|
</div> |
|
|
@@ -69,14 +152,14 @@ |
|
|
|
// import { parseTime } from '../../core/mixins/code-filter'; |
|
|
|
// import { getGlassPage, exportGlasscExcel } from '@/api/report/glass'; |
|
|
|
// import inputTable from './inputTable.vue'; |
|
|
|
import { report } from 'process'; |
|
|
|
import lineChart from './lineChart'; |
|
|
|
import moment from 'moment' |
|
|
|
import { report } from "process"; |
|
|
|
import lineChart from "./lineChart"; |
|
|
|
import moment from "moment"; |
|
|
|
// import FileSaver from 'file-saver' |
|
|
|
// import * as XLSX from 'xlsx' |
|
|
|
export default { |
|
|
|
components: { lineChart }, |
|
|
|
data() { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
listQuery: { |
|
|
|
pageSize: 10, |
|
|
@@ -85,50 +168,62 @@ export default { |
|
|
|
total: 0, |
|
|
|
type: null, |
|
|
|
// reportType: 2, |
|
|
|
reportTime: [] |
|
|
|
reportTime: [], |
|
|
|
}, |
|
|
|
// startDatePicker: this.beginDate(), |
|
|
|
// endDatePicker: this.processDate(), |
|
|
|
yeartsStart: '', |
|
|
|
yeartsEnd: '', |
|
|
|
urlOptions: { |
|
|
|
// getDataListURL: getGlassPage, |
|
|
|
// exportURL: exportGlasscExcel |
|
|
|
yeartsStart: "", |
|
|
|
yeartsEnd: "", |
|
|
|
urlOptions: { |
|
|
|
// getDataListURL: getGlassPage, |
|
|
|
// exportURL: exportGlasscExcel |
|
|
|
}, |
|
|
|
timeList: [ |
|
|
|
{ |
|
|
|
value: 'month', |
|
|
|
label:'月' |
|
|
|
value: "day", |
|
|
|
label: "日", |
|
|
|
}, |
|
|
|
{ |
|
|
|
value: 'year', |
|
|
|
label: '年' |
|
|
|
} |
|
|
|
value: "week", |
|
|
|
label: "周", |
|
|
|
}, |
|
|
|
{ |
|
|
|
value: "month", |
|
|
|
label: "月", |
|
|
|
}, |
|
|
|
{ |
|
|
|
value: "year", |
|
|
|
label: "年", |
|
|
|
}, |
|
|
|
], |
|
|
|
factoryList: [ |
|
|
|
{ |
|
|
|
name: '测试', |
|
|
|
id:1 |
|
|
|
} |
|
|
|
name: "瑞昌", |
|
|
|
id: 1, |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: "邯郸", |
|
|
|
id: 2, |
|
|
|
}, |
|
|
|
], |
|
|
|
typeList: [ |
|
|
|
{ |
|
|
|
name: '芯片', |
|
|
|
id:0, |
|
|
|
name: "芯片", |
|
|
|
id: 0, |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: '标准组件', |
|
|
|
name: "标准组件", |
|
|
|
id: 1, |
|
|
|
}, |
|
|
|
{ |
|
|
|
name: 'BIPV产品', |
|
|
|
name: "BIPV产品", |
|
|
|
id: 2, |
|
|
|
}, |
|
|
|
], |
|
|
|
formConfig: [ |
|
|
|
{ |
|
|
|
type: 'title', |
|
|
|
label: '报表管理', |
|
|
|
type: "title", |
|
|
|
label: "报表管理", |
|
|
|
}, |
|
|
|
], |
|
|
|
tableProps: [ |
|
|
@@ -140,69 +235,72 @@ export default { |
|
|
|
// filter: (val) => moment(val).format('yyyy-MM-DD HH:mm:ss'), |
|
|
|
// }, |
|
|
|
{ |
|
|
|
prop: 'userName', |
|
|
|
label: '科目', |
|
|
|
prop: "userName", |
|
|
|
label: "科目", |
|
|
|
}, |
|
|
|
{ |
|
|
|
prop: 'nickName', |
|
|
|
label: '类别', |
|
|
|
prop: "nickName", |
|
|
|
label: "类别", |
|
|
|
}, |
|
|
|
{ |
|
|
|
prop: 'datas', |
|
|
|
label: '数值', |
|
|
|
prop: "datas", |
|
|
|
label: "数值", |
|
|
|
// subcomponent: row |
|
|
|
}, |
|
|
|
{ |
|
|
|
prop: 'unit', |
|
|
|
label: '单位', |
|
|
|
prop: "unit", |
|
|
|
label: "单位", |
|
|
|
// subcomponent: row |
|
|
|
}, |
|
|
|
{ |
|
|
|
prop: 'remark', |
|
|
|
label: '备注', |
|
|
|
prop: "remark", |
|
|
|
label: "备注", |
|
|
|
// subcomponent: row |
|
|
|
} |
|
|
|
}, |
|
|
|
], |
|
|
|
timeSelect:'month', |
|
|
|
startTimeStamp:null, //开始时间 |
|
|
|
endTimeStamp:null, //结束时间 |
|
|
|
date:'凯盛玻璃控股成员企业2024生产数据', |
|
|
|
// reportTime: '', |
|
|
|
startTimeStamp: '', |
|
|
|
endTimeStamp: '', |
|
|
|
timeSelect: "month", |
|
|
|
startTimeStamp: null, //开始时间 |
|
|
|
endTimeStamp: null, //结束时间 |
|
|
|
date: "凯盛玻璃控股成员企业2024生产数据", |
|
|
|
// reportTime: '', |
|
|
|
startTimeStamp: "", |
|
|
|
endTimeStamp: "", |
|
|
|
tableData: [ |
|
|
|
{ |
|
|
|
userName: 'userName', |
|
|
|
nickName: '用户名', |
|
|
|
datas:'111111' |
|
|
|
userName: "userName", |
|
|
|
nickName: "用户名", |
|
|
|
datas: "111111", |
|
|
|
}, |
|
|
|
{ |
|
|
|
userName: 'userName', |
|
|
|
nickName: '用户名', |
|
|
|
datas: '111111' |
|
|
|
userName: "userName", |
|
|
|
nickName: "用户名", |
|
|
|
datas: "111111", |
|
|
|
}, |
|
|
|
{ |
|
|
|
userName: 'userName', |
|
|
|
nickName: '用户名', |
|
|
|
datas: '111111' |
|
|
|
userName: "userName", |
|
|
|
nickName: "用户名", |
|
|
|
datas: "111111", |
|
|
|
// subcomponent: row |
|
|
|
} |
|
|
|
}, |
|
|
|
], |
|
|
|
// proLineList: [], |
|
|
|
// all: {} |
|
|
|
}; |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
this.getDict() |
|
|
|
// proLineList: [], |
|
|
|
// all: {} |
|
|
|
}; |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
this.getDict(); |
|
|
|
// this.getCurrentYearFirst() |
|
|
|
// this.getDataList() |
|
|
|
}, |
|
|
|
}, |
|
|
|
methods: { |
|
|
|
getYear(e) { |
|
|
|
if (this.listQuery.reportTime[0] && e - this.listQuery.reportTime[0] > 10) { |
|
|
|
if ( |
|
|
|
this.listQuery.reportTime[0] && |
|
|
|
e - this.listQuery.reportTime[0] > 10 |
|
|
|
) { |
|
|
|
this.$message({ |
|
|
|
message: '年份起止时间不能超过十年', |
|
|
|
type: 'warning' |
|
|
|
message: "年份起止时间不能超过十年", |
|
|
|
type: "warning", |
|
|
|
}); |
|
|
|
// console.log(); |
|
|
|
} |
|
|
@@ -210,59 +308,67 @@ export default { |
|
|
|
}, |
|
|
|
changeTime() { |
|
|
|
if (this.listQuery.reportTime) { |
|
|
|
this.createStartDate = moment(new Date(this.listQuery.reportTime[0]), 'yyyy-MM-dd hh:mm:ss'); |
|
|
|
this.createEndDate = moment(new Date(this.listQuery.reportTime[1]), 'yyyy-MM-dd hh:mm:ss'); |
|
|
|
const numDays = (new Date(this.listQuery.reportTime[1]).getTime() - new Date(this.listQuery.reportTime[0]).getTime()) / (24 * 3600 * 1000); if (numDays > 730) { |
|
|
|
this.createStartDate = moment( |
|
|
|
new Date(this.listQuery.reportTime[0]), |
|
|
|
"yyyy-MM-dd hh:mm:ss" |
|
|
|
); |
|
|
|
this.createEndDate = moment( |
|
|
|
new Date(this.listQuery.reportTime[1]), |
|
|
|
"yyyy-MM-dd hh:mm:ss" |
|
|
|
); |
|
|
|
const numDays = |
|
|
|
(new Date(this.listQuery.reportTime[1]).getTime() - |
|
|
|
new Date(this.listQuery.reportTime[0]).getTime()) / |
|
|
|
(24 * 3600 * 1000); |
|
|
|
if (numDays > 730) { |
|
|
|
this.$message({ |
|
|
|
message: '时间范围不能超过24个月', |
|
|
|
type: 'warning' |
|
|
|
message: "时间范围不能超过24个月", |
|
|
|
type: "warning", |
|
|
|
}); |
|
|
|
this.listQuery.reportTime = []; |
|
|
|
this.createStartDate = ''; |
|
|
|
this.createEndDate = ''; |
|
|
|
this.createStartDate = ""; |
|
|
|
this.createEndDate = ""; |
|
|
|
} |
|
|
|
} else { |
|
|
|
this.createStartDate = ''; |
|
|
|
this.createEndDate = ''; |
|
|
|
this.createStartDate = ""; |
|
|
|
this.createEndDate = ""; |
|
|
|
} |
|
|
|
}, |
|
|
|
async getDict() { |
|
|
|
this.$refs.lineChart.initChart() |
|
|
|
// 产线列表 |
|
|
|
// const res = await getCorePLList(); |
|
|
|
// this.proLineList = res.data; |
|
|
|
}, |
|
|
|
this.$refs.lineChart.initChart(); |
|
|
|
// 产线列表 |
|
|
|
// const res = await getCorePLList(); |
|
|
|
// this.proLineList = res.data; |
|
|
|
}, |
|
|
|
// 获取数据列表 |
|
|
|
multipliedByHundred(str) { |
|
|
|
console.log(str); |
|
|
|
// console.log(str) |
|
|
|
if ( str != 0) { |
|
|
|
if (str != 0) { |
|
|
|
let floatVal = parseFloat(str); |
|
|
|
if (isNaN(floatVal)) { |
|
|
|
return 0; |
|
|
|
} |
|
|
|
floatVal = Math.round(str * 10000) / 100; |
|
|
|
let strVal = floatVal.toString(); |
|
|
|
let searchVal = strVal.indexOf('.'); |
|
|
|
let searchVal = strVal.indexOf("."); |
|
|
|
if (searchVal < 0) { |
|
|
|
searchVal = strVal.length; |
|
|
|
strVal += '.'; |
|
|
|
strVal += "."; |
|
|
|
} |
|
|
|
while (strVal.length <= searchVal + 2) { |
|
|
|
strVal += '0'; |
|
|
|
strVal += "0"; |
|
|
|
} |
|
|
|
return parseFloat(strVal); |
|
|
|
} |
|
|
|
|
|
|
|
}, |
|
|
|
async getDataList() { |
|
|
|
}, |
|
|
|
async getDataList() {}, |
|
|
|
add0(m) { |
|
|
|
return m < 10 ? '0' + m : m |
|
|
|
return m < 10 ? "0" + m : m; |
|
|
|
}, |
|
|
|
format(shijianchuo) { |
|
|
|
//shijianchuo是整数,否则要parseInt转换 |
|
|
|
var time = moment(new Date(shijianchuo)).format('YYYY-MM-DD HH:mm:ss') |
|
|
|
var time = moment(new Date(shijianchuo)).format("YYYY-MM-DD HH:mm:ss"); |
|
|
|
// console.log(time) |
|
|
|
// var y = time.getFullYear(); |
|
|
|
// var m = time.getMonth() + 1; |
|
|
@@ -270,9 +376,9 @@ export default { |
|
|
|
// var h = time.getHours(); |
|
|
|
// var mm = time.getMinutes(); |
|
|
|
// var s = time.getSeconds(); |
|
|
|
return time |
|
|
|
return time; |
|
|
|
}, |
|
|
|
// changeTime(val) { |
|
|
|
// changeTime(val) { |
|
|
|
// if (val) { |
|
|
|
// // console.log(val) |
|
|
|
// // console.log(val.setHours(7, 0, 0)) |
|
|
@@ -284,35 +390,41 @@ export default { |
|
|
|
// this.listQuery.reportTime[0] = this.format(val.setHours(7, 0, 1)) //+ ' 00:00:00' //new Date(this.startTimeStamp + ' 00:00:00').getTime() / 1000 |
|
|
|
// this.listQuery.reportTime[1] = this.format(val.setHours(7, 0, 0) + 24 * 60 * 60 * 1000) //+ ' 23:59:59' //new Date(this.endTimeStamp + ' 23:59:59').getTime() / 1000 |
|
|
|
// console.log(this.listQuery.reportTime); |
|
|
|
// } else { |
|
|
|
// this.listQuery.reportTime = [] |
|
|
|
// } |
|
|
|
// }, |
|
|
|
// } else { |
|
|
|
// this.listQuery.reportTime = [] |
|
|
|
// } |
|
|
|
// }, |
|
|
|
|
|
|
|
//时间戳转为yy-mm-dd hh:mm:ss |
|
|
|
timeFun(unixtimestamp) { |
|
|
|
var unixtimestamp = new Date(unixtimestamp); |
|
|
|
var year = 1900 + unixtimestamp.getYear(); |
|
|
|
var month = "0" + (unixtimestamp.getMonth() + 1); |
|
|
|
var date = "0" + unixtimestamp.getDate(); |
|
|
|
return year + "-" + month.substring(month.length - 2, month.length) + "-" + date.substring(date.length - 2, date.length) |
|
|
|
}, |
|
|
|
buttonClick(val) { |
|
|
|
this.listQuery.reportTime = val.reportTime ? val.reportTime : undefined; |
|
|
|
switch (val.btnName) { |
|
|
|
case 'search': |
|
|
|
this.listQuery.pageNo = 1; |
|
|
|
this.listQuery.pageSize = 10; |
|
|
|
this.getDataList(); |
|
|
|
break; |
|
|
|
case 'export': |
|
|
|
this.handleExport(); |
|
|
|
break; |
|
|
|
default: |
|
|
|
console.log(val); |
|
|
|
} |
|
|
|
}, |
|
|
|
/** 导出按钮操作 */ |
|
|
|
//时间戳转为yy-mm-dd hh:mm:ss |
|
|
|
timeFun(unixtimestamp) { |
|
|
|
var unixtimestamp = new Date(unixtimestamp); |
|
|
|
var year = 1900 + unixtimestamp.getYear(); |
|
|
|
var month = "0" + (unixtimestamp.getMonth() + 1); |
|
|
|
var date = "0" + unixtimestamp.getDate(); |
|
|
|
return ( |
|
|
|
year + |
|
|
|
"-" + |
|
|
|
month.substring(month.length - 2, month.length) + |
|
|
|
"-" + |
|
|
|
date.substring(date.length - 2, date.length) |
|
|
|
); |
|
|
|
}, |
|
|
|
buttonClick(val) { |
|
|
|
this.listQuery.reportTime = val.reportTime ? val.reportTime : undefined; |
|
|
|
switch (val.btnName) { |
|
|
|
case "search": |
|
|
|
this.listQuery.pageNo = 1; |
|
|
|
this.listQuery.pageSize = 10; |
|
|
|
this.getDataList(); |
|
|
|
break; |
|
|
|
case "export": |
|
|
|
this.handleExport(); |
|
|
|
break; |
|
|
|
default: |
|
|
|
console.log(val); |
|
|
|
} |
|
|
|
}, |
|
|
|
/** 导出按钮操作 */ |
|
|
|
handleExport() { |
|
|
|
// 处理查询参数 |
|
|
|
// var xlsxParam = { raw: true }; |
|
|
@@ -344,25 +456,23 @@ export default { |
|
|
|
// return wbout; |
|
|
|
// //do something...... |
|
|
|
// }) |
|
|
|
|
|
|
|
}, |
|
|
|
}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |
|
|
|
|
|
|
|
<style scoped> |
|
|
|
.blueTip::before{ |
|
|
|
.blueTip::before { |
|
|
|
display: inline-block; |
|
|
|
content: ''; |
|
|
|
content: ""; |
|
|
|
width: 4px; |
|
|
|
height: 18px; |
|
|
|
background: #0B58FF; |
|
|
|
background: #0b58ff; |
|
|
|
border-radius: 1px; |
|
|
|
margin-right: 8PX; |
|
|
|
margin-right: 8px; |
|
|
|
margin-top: 8px; |
|
|
|
} |
|
|
|
.app-container { |
|
|
|
margin: 0 16px 0; |
|
|
|
background-color: #fff; |
|
|
|
border-radius: 4px; |
|
|
|
padding: 16px 16px 0; |
|
|
|