Skip to content

M
mes-ui
Commit a367dfcf authored by kangzhenfei's avatar kangzhenfei
Browse files
Options

Merge branch 'product' of git.mes123.com:zhouyx/mes-ui into product

parents 255c7be4 eb7b839d
Hide whitespace changes
Inline Side-by-side
Showing with 1590 additions and 80 deletions
i18n/locale/zh-CN.js
View file @ a367dfcf
...@@ -1573,7 +1573,9 @@ export default { ...@@ -1573,7 +1573,9 @@ export default {
creationTime1: '入库时间', creationTime1: '入库时间',
creator1: '入库人', creator1: '入库人',
total1: '库存', total1: '库存',
count:'出库数' count:'出库数',
code:'物料序号',
nowTotal:'库存'
}, },
stock_item: { stock_item: {
creationTime: '创建时间', creationTime: '创建时间',
......
pages/aps/plan/addAccessory.vue
View file @ a367dfcf
...@@ -26,11 +26,11 @@ ...@@ -26,11 +26,11 @@
:max="row.totalCount" :max="row.totalCount"
:min="0" :min="0"
v-model="row.count" v-model="row.count"
@on-blur="inputChange1(i,row,index)" @on-change="inputChange1(i,row,index)"
/> />
</template> </template>
<template slot-scope="{ row, index }" slot="remarks"> <template slot-scope="{ row, index }" slot="remarks">
<Input type="text" v-model="row.remark" @on-blur="inputChange1(i,row,index)" /> <Input type="text" v-model="row.remark" @on-change="inputChange1(i,row,index)" />
</template> </template>
</Table> </Table>
</div> </div>
......
pages/aps/plan/editAccessory.vue
View file @ a367dfcf
...@@ -32,7 +32,7 @@ ...@@ -32,7 +32,7 @@
:max="row.totalCount-row.applicationNumber" :max="row.totalCount-row.applicationNumber"
:min="0" :min="0"
v-model="row.count" v-model="row.count"
@on-blur="inputChange1(i,row,index)" @on-change="inputChange1(i,row,index)"
:disabled="row._disabled" :disabled="row._disabled"
/> />
</template> </template>
...@@ -40,7 +40,7 @@ ...@@ -40,7 +40,7 @@
<Input <Input
type="text" type="text"
v-model="row.remark" v-model="row.remark"
@on-blur="inputChange1(i,row,index)" @on-change="inputChange1(i,row,index)"
:disabled="row._disabled" :disabled="row._disabled"
/> />
</template> </template>
......
pages/aps/supprotMain/accessory.vue
View file @ a367dfcf
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
<span class="ml20">申请时间：{{row.creationTime}}</span> <span class="ml20">申请时间：{{row.creationTime}}</span>
<span class="ml20"> <span class="ml20">
状态： 状态：
<state code="aps.plan.supportingStatus" :value="row.status+''" type="text"></state> <state code="accessory.status" :value="row.status+''" type="text"></state>
</span> </span>
</p> </p>
<Split v-model="split" mode="vertical" @on-move-end="moveEnd"> <Split v-model="split" mode="vertical" @on-move-end="moveEnd">
...@@ -37,17 +37,24 @@ ...@@ -37,17 +37,24 @@
> >
<template slot-scope="{ row, index }" slot="counts"> <template slot-scope="{ row, index }" slot="counts">
<InputNumber <InputNumber
:max="row.total" :max="row.nowTotal"
:min="0" :min="0"
v-model="row.count" v-model="row.count"
@on-blur="inputChange(row,index)" @on-change="inputChange(row,index)"
/> />
</template> </template>
</Table> </Table>
</div> </div>
</Split> </Split>
<Modal v-model="ModalAccList" title="出库记录" width="1000" footer-hide> <Modal v-model="ModalAccList" title="出库记录" width="1000" footer-hide>
<DataGrid :action="action" :columns="colsList" ref="grid" :conditions="easySearch" height="400" :tool="false"></DataGrid> <DataGrid
:action="action"
:columns="colsList"
ref="grid"
:conditions="easySearch"
:height="400"
:tool="false"
></DataGrid>
</Modal> </Modal>
</div> </div>
</template> </template>
...@@ -85,18 +92,20 @@ export default { ...@@ -85,18 +92,20 @@ export default {
key: "count", key: "count",
title: this.l("count1"), title: this.l("count1"),
align: "right", align: "right",
width:150,
}, },
{ {
key: "outCount", key: "outCount",
title: "出库数", title: "出库数",
align: "right", align: "right",
width:150,
render: (h, params) => { render: (h, params) => {
return h( return h(
"op", "op",
{ {
attrs: { attrs: {
oprate: "detail", oprate: "detail",
title: "查看明细", title: params.row.outCount&&params.row.outCount>0?"出库明细":"",
}, },
style: { style: {
color: "blue", color: "blue",
...@@ -105,7 +114,7 @@ export default { ...@@ -105,7 +114,7 @@ export default {
click: () => this.openAccessoryList(params.row), click: () => this.openAccessoryList(params.row),
}, },
}, },
params.row.outCount params.row.outCount ? params.row.outCount : "0"
); );
}, },
}, },
...@@ -113,6 +122,7 @@ export default { ...@@ -113,6 +122,7 @@ export default {
key: "status", key: "status",
title: "状态", title: "状态",
align: "center", align: "center",
width:150,
render: (h, params) => { render: (h, params) => {
return h( return h(
"op", "op",
...@@ -144,6 +154,11 @@ export default { ...@@ -144,6 +154,11 @@ export default {
title: this.l1("name"), title: this.l1("name"),
align: "left", align: "left",
}, },
{
key: "code",
title: this.l1("code"),
align: "left",
},
{ {
key: "materialCode", key: "materialCode",
title: this.l1("materialCode"), title: this.l1("materialCode"),
...@@ -163,22 +178,25 @@ export default { ...@@ -163,22 +178,25 @@ export default {
key: "creationTime", key: "creationTime",
title: this.l1("creationTime1"), title: this.l1("creationTime1"),
align: "center", align: "center",
width:220,
}, },
{ {
key: "creator", key: "creator",
title: this.l1("creator1"), title: this.l1("creator1"),
align: "right", align: "left",
}, },
{ {
key: "total", key: "nowTotal",
title: this.l1("total1"), title: this.l1("nowTotal"),
align: "right", align: "right",
width:150,
}, },
{ {
key: "count", key: "count",
title: this.l1("count"), title: this.l1("count"),
align: "right", align: "right",
slot: "counts", slot: "counts",
width:150,
}, },
], ],
datasOut: [], datasOut: [],
...@@ -205,6 +223,7 @@ export default { ...@@ -205,6 +223,7 @@ export default {
key: "creationTime", key: "creationTime",
title: this.l2("creationTime"), title: this.l2("creationTime"),
align: "center", align: "center",
width:220,
}, },
{ {
key: "creatorUserId", key: "creatorUserId",
...@@ -215,6 +234,7 @@ export default { ...@@ -215,6 +234,7 @@ export default {
key: "count", key: "count",
title: this.l2("count"), title: this.l2("count"),
align: "right", align: "right",
width:150,
}, },
], ],
}; };
...@@ -330,6 +350,7 @@ export default { ...@@ -330,6 +350,7 @@ export default {
temItems.forEach((el) => { temItems.forEach((el) => {
if (el.count > 0) { if (el.count > 0) {
let temObj = { let temObj = {
stockItemId:el.id,
count: el.count, count: el.count,
storeId: el.storeId, storeId: el.storeId,
storeTitle: el.storeTitle, storeTitle: el.storeTitle,
...@@ -379,9 +400,11 @@ export default { ...@@ -379,9 +400,11 @@ export default {
this.$set(this.datasOut, index, row); this.$set(this.datasOut, index, row);
}, },
openAccessoryList(row) { openAccessoryList(row) {
this.ModalAccList = true; if (row.outCount && row.outCount > 0) {
this.easySearch.supportItemId.value = row.id; this.ModalAccList = true;
this.$refs.grid.reload(this.easySearch); this.easySearch.supportItemId.value = row.id;
this.$refs.grid.reload(this.easySearch);
}
}, },
l(key) { l(key) {
key = "support_main" + "." + key; key = "support_main" + "." + key;
......
pages/aps/supprotMain/api.js
View file @ a367dfcf
...@@ -39,4 +39,7 @@ export default { ...@@ -39,4 +39,7 @@ export default {
return Api.post(`${resourceUrl}/outmain/batchdelete`, params); return Api.post(`${resourceUrl}/outmain/batchdelete`, params);
}, },
indexAcc: `${resourceUrl}/outitem/paged`, indexAcc: `${resourceUrl}/outitem/paged`,
listbysupportitem(params) {//查询所有或单个表单出库信息
return Api.post(`${resourceUrl}/outitem/listbysupportitem`, params);
},
} }
pages/aps/supprotMain/index.vue
View file @ a367dfcf
...@@ -52,6 +52,7 @@ export default { ...@@ -52,6 +52,7 @@ export default {
title: this.l("finishDate"), title: this.l("finishDate"),
align: "center", align: "center",
type: "date", type: "date",
width:200,
}, },
{ {
key: "orderCode", key: "orderCode",
...@@ -64,10 +65,30 @@ export default { ...@@ -64,10 +65,30 @@ export default {
title: this.l("creationTime"), title: this.l("creationTime"),
align: "center", align: "center",
type: "date", type: "date",
width:200,
}, },
{ key: "creator", title: this.l("creator"), align: "left" }, { key: "creator", title: this.l("creator"), align: "left" },
{ key: "status", title: this.l("status"), align: "center" }, {
{ key: "status1", title: this.l("status1"), align: "center" }, key: "status",
title: this.l("status"),
align: "center",
width:150,
render: (h, params) => {
return h(
"op",
{
attrs: {
oprate: "detail",
},
style: {
color: this.setName(this.statuList,params.row.status).color,
},
},
this.setName(this.statuList,params.row.status).name
);
},
},
{ key: "status1", title: this.l("status1"), align: "center",width:150, },
{ {
title: "操作", title: "操作",
key: "action", key: "action",
...@@ -87,7 +108,7 @@ export default { ...@@ -87,7 +108,7 @@ export default {
"op", "op",
{ {
attrs: { oprate: "edit" }, attrs: { oprate: "edit" },
on: { click: () => this.getOutBound(params.row) },
}, },
"出库单" "出库单"
), ),
...@@ -123,6 +144,7 @@ export default { ...@@ -123,6 +144,7 @@ export default {
getOutBound(row) { getOutBound(row) {
this.curId = row.id; this.curId = row.id;
this.title = "出库单"; this.title = "出库单";
this.entity = row;
this.detail = () => import("./outbound"); this.detail = () => import("./outbound");
this.modal = true; this.modal = true;
}, },
......
pages/aps/supprotMain/outbound.vue
View file @ a367dfcf
<template> <template>
<div>444444</div> <div class="h100">
</template> <p class="mb10">
\ No newline at end of file 申请单号：{{row.code}}
<span class="ml20">齐套日期：{{row.finishDate.substring(0,10)}}</span>
<span class="ml50">申请人：{{row.creator}}</span>
<span class="ml20">申请时间：{{row.creationTime}}</span>
<span class="ml20">
状态：
<state code="outstore.status" :value="row.status+''" type="text"></state>
</span>
<Button
type="primary"
shape="circle"
:icon="iconLabel"
class="fr"
size="small"
@click="openMore"
>{{butTxt}}</Button>
</p>
<Table
:columns="cols"
:data="datas"
class="tableCommon"
ref="gridTable"
border
highlight-row
@on-current-change="curChange"
:height="tableHeight1"
></Table>
<div class="mt20 mb50">
<Table
:columns="colsList"
:data="dataList"
class="tableCommon"
ref="gridTable1"
border
@on-selection-change="selectChange"
></Table>
</div>
<div>
<FooterToolbar v-show="footerToolbar" class="ftball">
<!--<div class="tip">已选{{selectItems.length}}项</div>-->
<Button type="primary" class="mr10 ml10" @click="application(1,null)">批量撤回</Button>
<Button @click="cancelBatch">取消</Button>
</FooterToolbar>
</div>
</div>
</template>
<script>
import Api from "./api";
export default {
name: "Edit",
data() {
return {
disabled: false,
entity: {},
statuList: this.$store.getters.dictionaryByKey("accessory.status") || [],
statuList1: this.$store.getters.dictionaryByKey("outstore.status") || [],
cols: [
{
key: "materialName",
title: this.l("materialName"),
align: "left",
},
{
key: "materialNumber",
title: this.l("materialNumber"),
align: "left",
},
{
key: "count",
title: this.l("count1"),
align: "right",
width: 150,
},
{
key: "outCount",
title: "出库数",
align: "right",
width: 150,
},
{
key: "status",
title: "状态",
align: "center",
width: 150,
render: (h, params) => {
return h(
"op",
{
attrs: {
oprate: "detail",
},
style: {
color: this.setName(this.statuList1, params.row.status).color,
},
},
this.setName(this.statuList1, params.row.status).name
);
},
},
{
key: "remark",
title: this.l("remark"),
align: "left",
},
],
datas: [],
splitHeight: "",
tempOut: [],
colsList: [
{
type: "selection",
width: 70,
align: "center",
},
{
key: "materialName",
title: this.l2("materialName"),
align: "left",
},
{
key: "materialNumber",
title: this.l2("materialNumber"),
align: "left",
},
{
key: "storeTitle",
title: this.l2("storeTitle"),
align: "left",
},
{
key: "creationTime",
title: this.l2("creationTime"),
align: "center",
width: 220,
},
{
key: "creatorUserId",
title: this.l2("creatorUserId"),
render: (h, params) => {
if (params.row.creatorUserId) {
return h("User", {
props: {
value: params.row.creatorUserId,
},
});
}
},
},
{
key: "count",
title: this.l2("count"),
align: "right",
width: 150,
},
{
key: "action",
title: "操作",
align: "center",
width: "120",
render: (h, params) => {
return h(
"op",
{
attrs: {
oprate: "edit",
},
on: {
click: () => this.application(2, params.row),
},
},
"撤回"
);
},
},
],
dataList: [],
footerToolbar: false,
tableHeight1: "96",
butTxt: "更多",
iconLabel: "md-arrow-dropdown",
tempList: [],
tempID: null,
};
},
props: {
eid: Number,
row: Object,
},
mounted() {
//this.splitHeight = window.innerHeight - 150;
//this.tableHeight1 = "120";
window.onresize = () => {
///浏览器窗口大小变化
return (() => {
window.screenHeight = window.innerHeight;
//this.splitHeight = window.screenHeight - 150;
//this.tableHeight1 = this.splitHeight * this.split;
})();
};
if (this.eid > 0) {
this.load(this.eid);
}
},
methods: {
load(v) {
Api.getitemlist({ id: v }).then((r) => {
if (r.success) {
//----测试多条数据start----
// let temData = [];
// for (let i = 0; i < 10; i++) {
// temData = temData.concat(r.result.children);
// }
//this.datas = temData;
//----测试多条数据end----
//this.datas = r.result.children;
this.tempList = r.result.children;
this.datas = this.tempList.slice(0, 1);
let parm = { orderId: r.result.orderId };
Api.listbysupportitem(parm).then((res) => {
if (res.success) {
this.dataList = res.result;
}
});
}
});
},
//状态名称过滤
setName(list, v) {
let outPar = {
name: "",
color: "",
};
if ((v + "").indexOf(",") == -1) {
var item;
list.map((u) => {
if (u.code == v) {
item = u;
}
});
if (item) {
//this.items = item;
outPar = {
name: item.name,
color: item.color,
};
}
}
return outPar;
},
curChange(curRow, oldRow) {
//当前物料过滤
//点击物料行
this.getList(curRow.id)
},
getList(id) {
let parm = { supportItemId: id };
Api.listbysupportitem(parm).then((res) => {
if (res.success) {
this.dataList = res.result;
}
});
this.footerToolbar = false;
},
openMore() {
//展开收起按钮
if (this.butTxt == "更多") {
//for (var i = 0; i < 3; i++) {
// this.datas = this.datas.concat(this.datas);
// }
this.datas = this.tempList;
if (this.datas.length > 4) {
this.tableHeight1 = "240";
} else {
this.tableHeight1 = "";
}
this.butTxt = "收起";
this.iconLabel = "md-arrow-dropup";
} else {
this.tableHeight1 = "96";
this.butTxt = "更多";
this.iconLabel = "md-arrow-dropdown";
this.datas = this.tempList.slice(0, 1);
}
},
selectChange(selections) {
this.tempOut = selections;
//复选框选择
if (selections.length > 0) {
this.footerToolbar = true;
} else {
this.footerToolbar = false;
}
},
cancelBatch() {
this.footerToolbar = false;
this.$refs["gridTable1"].selectAll(false);
},
application(type, row) {
//撤销出库(批量type 1 ，单挑type 2)
if (type == 1) {
alert(JSON.stringify(this.tempOut));
} else {
alert(JSON.stringify(this.row));
}
this.load(this.eid);
},
l(key) {
key = "support_main" + "." + key;
return this.$t(key);
},
l1(key) {
key = "stock" + "." + key;
return this.$t(key);
},
l2(key) {
key = "support_item" + "." + key;
return this.$t(key);
},
},
watch: {
eid(v) {
if (v != 0) {
this.load(v);
}
},
},
};
</script>
<style scoped>
.ftball {
background: rgba(0, 0, 0, 0.7);
color: #fff;
}
</style>
\ No newline at end of file
pages/home/component/approval.vue
View file @ a367dfcf
...@@ -63,27 +63,27 @@ export default { ...@@ -63,27 +63,27 @@ export default {
align: "center", align: "center",
width: 100, width: 100,
render: (h, parmse) => { render: (h, parmse) => {
return h("div", { class: "action" }, [ return h("div", [
h( h(
"op", "op",
{ {
attrs: { attrs: {
oprate: "add", oprate: "add",
title: "查看" title: "查看",
}, },
on: { on: {
click: () => { click: () => {
this.viewRow(parmse.row); this.viewRow(parmse.row);
} },
} },
}, },
"查看" "查看"
) ),
]); ]);
} },
} },
], ],
data1: [] data1: [],
}; };
}, },
created() { created() {
...@@ -98,10 +98,10 @@ export default { ...@@ -98,10 +98,10 @@ export default {
pageIndex: 1, pageIndex: 1,
pageSize: 20, pageSize: 20,
conditions: [ conditions: [
{ fieldName: "type", fieldValue: 2, conditionalType: "Equal" } { fieldName: "type", fieldValue: 2, conditionalType: "Equal" },
] ],
}; };
Api.getpaged(parme).then(res => { Api.getpaged(parme).then((res) => {
let arry = res.result.items; let arry = res.result.items;
let arr = arry.slice(0, 4); let arr = arry.slice(0, 4);
this.data1 = arr; this.data1 = arr;
...@@ -115,9 +115,9 @@ export default { ...@@ -115,9 +115,9 @@ export default {
var info = { id: "123", message: "成功" }; var info = { id: "123", message: "成功" };
this.$router.push({ name: "handle", params: info }); this.$router.push({ name: "handle", params: info });
// tab(1) // tab(1)
} },
}, },
mounted() {} mounted() {},
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
...@@ -129,12 +129,12 @@ export default { ...@@ -129,12 +129,12 @@ export default {
.row_head { .row_head {
height: 30px; height: 30px;
color: #0099ff; color: #0099ff;
border-bottom: 1px solid #dcdfe6; border-bottom: 1px solid #dcdfe6;
a { a {
color: #0099ff; color: #0099ff;
} }
} }
.row_card_body{ .row_card_body {
margin-top: 10px; margin-top: 10px;
} }
.mo_cont { .mo_cont {
......
pages/home/component/materielChart.vue 0 → 100644
View file @ a367dfcf
<template>
<div class="stachart" :style="setStatistics?{width:'620px',height:'300px'}:{width:'100%',height:'100%'}">
<div :gutter="16" class="row_head" v-if="setStatistics?false:true">
<Icon type="ios-images" class="f20" />
<span class="ml10">物料相关统计</span>
</div>
<div class="echarts-map">
<v-chart :options="braking" />
</div>
</div>
</template>
<script>
import Api from "../api";
import ECharts from "vue-echarts";
import echarts from "echarts/lib/echarts";
import "echarts/lib/chart/pie";
// import "echarts/lib/chart/bar";
import "echarts/lib/component/tooltip";
import "echarts/lib/component/title";
import "echarts/lib/component/legend";
import "echarts/lib/component/grid";
export default {
name: "echarts",
components: {
"v-chart": ECharts,
},
props: {
setStatistics: Boolean,
},
data() {
return {
value2: "",
braking: {},
};
},
mounted() {
this.statistics();
},
methods: {
statistics() {
// let conditions = [
// {
// fieldName: "status",
// fieldValue: "1",
// conditionalType: "Equal",
// },
// ];
// let data = {
// conditions: conditions,
// };
// Api.planorderstatuscount(data).then((r) => {
// var allTotal = "";
// var listData = [];
// var status = ["计划数量"];
// r.result.chidren.map((e) => {
// status.push(e.status);
// });
// allTotal = r.result.allTotal;
// listData = r.result.chidren;
var data = [
{
name: "待复验",
value: 6,
},
{
name: "待配套",
value: 16,
},
{
name: "库存预警",
value: 54,
},
{
name: "现场缺料呼叫",
value: 27,
},
];
var titleArr = [],
seriesArr = [];
var sCenter,
TitleXy = {};
var colors = [
["#2680EB", "#E7E7E7"],
["#0DD78D", "#E7E7E7"],
["#FE7777", "#E7E7E7"],
["#FFA000", "#E7E7E7"],
];
data.forEach(function (item, index) {
if (index < 2) {
sCenter = [index * 50 + 10 + "%", "35%"];
TitleXy = {
left: index * 50 + 10 + "%",
top: "58%",
};
} else {
sCenter = [(index - 2) * 50 + 35 + "%", "65%"];
TitleXy = {
left: (index - 2) * 50 + 35 + "%",
top: "88%",
};
}
titleArr.push({
text: item.name,
left: TitleXy.left,
top: TitleXy.top,
textAlign: "center",
textStyle: {
fontWeight: "bold",
fontSize: "14",
color: colors[index][0],
textAlign: "center",
},
});
seriesArr.push({
name: item.name,
type: "pie",
clockWise: false,
radius: [50, 55],
itemStyle: {
normal: {
color: colors[index][0],
shadowColor: colors[index][0],
shadowBlur: 0,
label: {
show: false,
},
labelLine: {
show: false,
},
},
},
hoverAnimation: false,
center: sCenter,
data: [
{
value: item.value,
label: {
normal: {
formatter: function (params) {
return params.value;
},
position: "center",
show: true,
textStyle: {
fontSize: "20",
fontWeight: "bold",
color: colors[index][0],
},
},
},
},
{
value: 100 - item.value,
name: "invisible",
itemStyle: {
normal: {
color: colors[index][1],
},
emphasis: {
color: colors[index][1],
},
},
},
],
});
});
this.braking = {
backgroundColor: "#fff",
title: titleArr,
series: seriesArr,
};
// });
},
statistics1() {
// let conditions = [];
// let data = {
// conditions: conditions,
// };
// Api.orderstatuscount(data).then((r) => {
// let listData = [];
// let name = [];
// let allTotal = [];
// listData = r.result;
// r.result.map((e) => {
// name.push(e.name);
// allTotal.push(e.allTotal);
// });
// });
},
viewRow(rowData) {
// this.viewModal = true;
// this.viewData = rowData;
},
},
};
</script>
<style lang="less" scoped>
.stachart {
background: rgba(255, 255, 255, 1);
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.16);
border-radius: 8px;
padding: 10px;
margin: 0 auto;
.echarts-map {
width: 100%;
height: 280px;
.echarts {
height: 280px;
}
}
.row_head {
height: 35px;
line-height: 30px;
color: #0099ff;
margin-left: 10px;
border-bottom: 1px solid #dcdfe6;
}
}
</style>
\ No newline at end of file
pages/home/component/staChart.vue
View file @ a367dfcf
...@@ -2,16 +2,19 @@ ...@@ -2,16 +2,19 @@
<div class="stachart"> <div class="stachart">
<Row :gutter="16"> <Row :gutter="16">
<Col :span="8" style="padding-right:50px;"> <Col :span="8" style="padding-right:50px;">
<div class="row_head"> <div class="row_head" v-if="setStatistics?false:true">
<Icon type="ios-images" class="f20" /> <Icon type="ios-images" class="f20" />
<span class="ml10">年度计划各产品类型总数量和各状态数量</span> <span class="ml10">年度计划各产品类型总数量和各状态数量</span>
</div> </div>
<div class="echarts-map"> <div class="echarts-map">
<v-chart :options="braking" style="width:100%;100%;" /> <v-chart
:options="braking"
:style="setStatistics?{width:'400px',height:'270px'}:{width:'100%',height:'100%'}"
/>
</div> </div>
</Col> </Col>
<Col :span="16"> <Col :span="16" style="padding-right:20px;">
<Row :gutter="16" class="row_head"> <Row :gutter="16" class="row_head" v-if="setStatistics?false:true">
<Col span="7"> <Col span="7">
<Icon type="ios-images" class="f20" /> <Icon type="ios-images" class="f20" />
<span class="ml10">各车间计划执行状态的详细情况</span> <span class="ml10">各车间计划执行状态的详细情况</span>
...@@ -27,12 +30,12 @@ ...@@ -27,12 +30,12 @@
></DatePicker> ></DatePicker>
<Button type="primary">查询</Button> <Button type="primary">查询</Button>
</Col> </Col>
<Col span="8" class="geng-duo">
<Icon type="md-settings" class="f20" />
</Col>
</Row> </Row>
<div class="echarts-map"> <div class="echarts-map">
<v-chart :options="braking1" style="width:100%;100%;" /> <v-chart
:options="braking1"
:style="setStatistics?{width:'800px',height:'270px'}:{width:'100%',height:'100%'}"
/>
</div> </div>
</Col> </Col>
</Row> </Row>
...@@ -53,6 +56,9 @@ export default { ...@@ -53,6 +56,9 @@ export default {
components: { components: {
"v-chart": ECharts, "v-chart": ECharts,
}, },
props: {
setStatistics: Boolean,
},
data() { data() {
return { return {
value2: "", value2: "",
...@@ -60,6 +66,7 @@ export default { ...@@ -60,6 +66,7 @@ export default {
braking1: {}, braking1: {},
}; };
}, },
created() {},
mounted() { mounted() {
this.statistics(); this.statistics();
this.statistics1(); this.statistics1();
...@@ -186,7 +193,7 @@ export default { ...@@ -186,7 +193,7 @@ export default {
], ],
type: "bar", type: "bar",
barWidth: 10, //柱图宽度 barWidth: 10, //柱图宽度
barGap: "-20%", //柱图间距 barGap: "10%", //柱图间距
}, },
], ],
}; };
...@@ -316,12 +323,16 @@ export default { ...@@ -316,12 +323,16 @@ export default {
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.16); box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.16);
border-radius: 8px; border-radius: 8px;
padding: 10px; padding: 10px;
width: 100%;
.echarts-map { .echarts-map {
width: 100%; width: 100%;
height: 300px; height: 270px;
.echarts { .echarts {
height: 300px; width: 100%;
height: 100%;
div {
width: 100%;
height: 100%;
}
} }
} }
.row_head { .row_head {
......
pages/home/component/suspendChart.vue 0 → 100644
View file @ a367dfcf
<template>
<div
class="stachart"
:style="setStatistics?{width:'620px',height:'280px'}:{width:'100%',height:'100%'}"
>
<div class="row_head" v-if="setStatistics?false:true">
<Icon type="ios-images" class="f20" />
<span class="ml10">暂停任务统计</span>
</div>
<div class="echarts-map">
<v-chart :options="braking" />
</div>
</div>
</template>
<script>
import Api from "../api";
import ECharts from "vue-echarts";
import echarts from "echarts/lib/echarts";
import "echarts/lib/chart/pie";
// import "echarts/lib/chart/bar";
import "echarts/lib/component/tooltip";
import "echarts/lib/component/title";
import "echarts/lib/component/legend";
import "echarts/lib/component/grid";
export default {
name: "echarts",
components: {
"v-chart": ECharts,
},
props: {
setStatistics: Boolean,
},
data() {
return {
value2: "",
braking: {},
};
},
mounted() {
this.statistics();
},
methods: {
statistics() {
// let conditions = [
// {
// fieldName: "status",
// fieldValue: "1",
// conditionalType: "Equal",
// },
// ];
// let data = {
// conditions: conditions,
// };
// Api.planorderstatuscount(data).then((r) => {
// var allTotal = "";
// var listData = [];
// var status = ["计划数量"];
// r.result.chidren.map((e) => {
// status.push(e.status);
// });
// allTotal = r.result.allTotal;
// listData = r.result.chidren;
this.braking = {
xAxis: {
// type: "category",
data: ["fp-2", "fp-4", "fp-5", "fp-7", "fp-8"],
axisTick: {
show: false,
},
axisLine: {
show: false,
},
axisLabel: {
textStyle: {
color: "#515A6E",
},
},
},
yAxis: {
splitLine: {
show: true,
lineStyle: {
color: "#eee",
type: "solid",
},
},
axisTick: {
show: false,
},
axisLine: {
show: false,
},
axisLabel: {
textStyle: {
color: "#515A6E",
},
},
},
grid: {
left: "3%",
right: "4%",
bottom: "5%",
top: "8%",
containLabel: true,
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow",
},
},
color: ["#73DDFF"],
series: [
{
data: [
{
// name:'计划数量',
value: 331,
itemStyle: {
normal: {
color: "#2680EB",
barBorderRadius: [30, 30, 0, 0],
},
},
},
{
value: 112,
itemStyle: {
normal: {
color: "#0DD78D",
barBorderRadius: [30, 30, 0, 0],
},
},
},
{
value: 112,
itemStyle: {
normal: {
color: "#FFA000",
barBorderRadius: [30, 30, 0, 0],
},
},
},
{
value: 152,
itemStyle: {
normal: {
color: "#FE7777",
barBorderRadius: [30, 30, 0, 0],
},
},
},
{
value: 24,
itemStyle: {
normal: {
color: "#515A6E",
barBorderRadius: [30, 30, 0, 0],
},
},
},
],
type: "bar",
barWidth: 10, //柱图宽度
barGap: "-20%", //柱图间距
},
],
};
// });
},
statistics1() {
// let conditions = [];
// let data = {
// conditions: conditions,
// };
// Api.orderstatuscount(data).then((r) => {
// let listData = [];
// let name = [];
// let allTotal = [];
// listData = r.result;
// r.result.map((e) => {
// name.push(e.name);
// allTotal.push(e.allTotal);
// });
// });
},
viewRow(rowData) {
// this.viewModal = true;
// this.viewData = rowData;
},
},
};
</script>
<style lang="less" scoped>
.stachart {
background: rgba(255, 255, 255, 1);
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.16);
border-radius: 8px;
padding: 10px;
margin: 0 auto;
.echarts-map {
width: 100%;
height: 280px;
.echarts {
height: 280px;
}
}
.row_head {
height: 35px;
line-height: 30px;
margin-left: 10px;
color: #0099ff;
border-bottom: 1px solid #dcdfe6;
}
}
</style>
\ No newline at end of file
pages/home/component/unqualifiedEcharts.vue 0 → 100644
View file @ a367dfcf
<template>
<div class="stachart">
<div :gutter="16" class="row_head" v-if="setStatistics?false:true">
<Icon type="ios-images" class="f20" />
<span class="ml10">不合格品审理单统计</span>
</div>
<Row :gutter="16">
<Col :span="8" style="padding-right:50px;">
<div class="echarts-map">
<v-chart
:options="braking"
:style="setStatistics?{width:'380px',height:'280px'}:{width:'100%',height:'100%'}"
/>
</div>
</Col>
<Col :span="16">
<div class="table-b">
<Table border :columns="columns1" :data="data1" height="260"></Table>
</div>
</Col>
</Row>
</div>
</template>
<script>
import Api from "../api";
import ECharts from "vue-echarts";
import echarts from "echarts/lib/echarts";
import "echarts/lib/chart/pie";
// import "echarts/lib/chart/bar";
import "echarts/lib/component/tooltip";
import "echarts/lib/component/title";
import "echarts/lib/component/legend";
import "echarts/lib/component/grid";
export default {
name: "echarts",
components: {
"v-chart": ECharts,
},
props: {
setStatistics: Boolean,
},
data() {
return {
value2: "",
braking: {},
columns1: [
{ type: "index", title: "序号", width: 70, align: "center" },
{ key: "schemaName", title: "产品名称", align: "center" },
{ key: "currentNodeName", title: "车间", align: "center" },
{ key: "nextNodeName", title: "审批结果", align: "center" },
{ key: "creationTime", title: "审批时间", align: "center" },
{
key: "id",
title: "操作",
align: "center",
width: 100,
render: (h, parmse) => {
return h("div", [
h(
"op",
{
attrs: {
oprate: "add",
title: "查看",
},
on: {
click: () => {
this.viewRow(parmse.row);
},
},
},
"查看"
),
]);
},
},
],
data1: [
{ creationTime: "2020-08-01" },
{ creationTime: "2020-08-01" },
{ creationTime: "2020-08-01" },
{ creationTime: "2020-08-01" },
{ creationTime: "2020-08-01" },
{ creationTime: "2020-08-01" },
],
};
},
mounted() {
this.statistics();
// this.statistics1();
},
methods: {
statistics() {
// let conditions = [
// {
// fieldName: "status",
// fieldValue: "1",
// conditionalType: "Equal",
// },
// ];
// let data = {
// conditions: conditions,
// };
// Api.planorderstatuscount(data).then((r) => {
// var allTotal = "";
// var listData = [];
// var status = ["计划数量"];
// r.result.chidren.map((e) => {
// status.push(e.status);
// });
// allTotal = r.result.allTotal;
// listData = r.result.chidren;
this.braking = {
tooltip: {
// trigger: "item",
// formatter: "{a} <br/>{b}: {c} ({d}%)",
},
legend: {
orient: "vertical",
right: 0,
bottom: 10,
data: ["一车间", "三车间", "五车间", "六车间"],
},
color: ["#2680EB", "#0DD78D", "#FFA000", "#FE7777"],
series: [
{
name: "访问来源",
type: "pie",
radius: ["55%", "80%"],
avoidLabelOverlap: false,
label: {
show: false,
position: "center",
},
emphasis: {
label: {
show: true,
fontSize: "30",
fontWeight: "bold",
},
},
labelLine: {
show: false,
},
data: [
{ value: 335, name: "一车间" },
{ value: 310, name: "三车间" },
{ value: 234, name: "五车间" },
{ value: 135, name: "六车间" },
],
},
],
};
// });
},
statistics1() {
// let conditions = [];
// let data = {
// conditions: conditions,
// };
// Api.orderstatuscount(data).then((r) => {
// let listData = [];
// let name = [];
// let allTotal = [];
// listData = r.result;
// r.result.map((e) => {
// name.push(e.name);
// allTotal.push(e.allTotal);
// });
// });
},
viewRow(rowData) {
// this.viewModal = true;
// this.viewData = rowData;
},
},
};
</script>
<style lang="less" scoped>
.stachart {
background: rgba(255, 255, 255, 1);
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.16);
border-radius: 8px;
padding: 10px 20px 0 20px;
width: 100%;
.echarts-map {
width: 100%;
height: 280px;
.echarts {
height: 280px;
}
}
.row_head {
height: 35px;
line-height: 30px;
color: #0099ff;
// margin: 0 10px;
border-bottom: 1px solid #dcdfe6;
.geng-duo {
text-align: right;
}
}
.table-b {
margin-top: 10px;
}
}
</style>
\ No newline at end of file
pages/home/component/workChart.vue 0 → 100644
View file @ a367dfcf
<template>
<div
class="stachart"
:style="setStatistics?{width:'620px',height:'280px'}:{width:'100%',height:'100%'}"
>
<div :gutter="16" class="row_head" v-if="setStatistics?false:true">
<Icon type="ios-images" class="f20" />
<span class="ml10">工单任务状态分布</span>
</div>
<div class="echarts-map">
<v-chart :options="braking" />
</div>
</div>
</template>
<script>
import Api from "../api";
import ECharts from "vue-echarts";
import echarts from "echarts/lib/echarts";
import "echarts/lib/chart/pie";
// import "echarts/lib/chart/bar";
import "echarts/lib/component/tooltip";
import "echarts/lib/component/title";
import "echarts/lib/component/legend";
import "echarts/lib/component/grid";
export default {
name: "echarts",
components: {
"v-chart": ECharts,
},
props: {
setStatistics: Boolean,
},
data() {
return {
value2: "",
braking: {},
};
},
mounted() {
this.statistics();
},
methods: {
statistics() {
// let conditions = [
// {
// fieldName: "status",
// fieldValue: "1",
// conditionalType: "Equal",
// },
// ];
// let data = {
// conditions: conditions,
// };
// Api.planorderstatuscount(data).then((r) => {
// var allTotal = "";
// var listData = [];
// var status = ["计划数量"];
// r.result.chidren.map((e) => {
// status.push(e.status);
// });
// allTotal = r.result.allTotal;
// listData = r.result.chidren;
this.braking = {
title: {
// text: "广州市天河区网络安全建设情况",
// textStyle: {
// color: "#fff",
// fontSize: 20,
// fontWeight: "400",
// },
},
color: ["#2680EB", "#0DD78D", "#FFA000", "#FE7777", "#515A6E"],
// title: {
// text: '网络/安全设备',
// left: '60',
// top: 0,
// textAlign: 'center',
// textStyle: {
// color: '#fff',
// fontSize: 14,
// fontWeight: 0
// }
// },
grid: {
left: -100,
top: 50,
bottom: 10,
right: 25,
containLabel: true,
},
tooltip: {
trigger: "item",
formatter: "{b} : {c} ({d}%)",
},
legend: {
type: "scroll",
orient: "vartical",
// x: "right",
// top: "center",
right: "10",
bottom: "10",
// itemWidth: 16,
// itemHeight: 8,
// itemGap: 16,
// textStyle: {
// color: "#A3E2F4",
// fontSize: 12,
// fontWeight: 0,
// },
data: ["已派工", "待派工", "执行中", "暂停中", "未开工"],
},
polar: {},
angleAxis: {
interval: 1,
type: "category",
data: [],
z: 10,
axisLine: {
show: false,
lineStyle: {
// color: "#0B4A6B",
width: 1,
type: "solid",
},
},
axisLabel: {
interval: 0,
show: true,
// color: "#0B4A6B",
margin: 8,
fontSize: 16,
},
},
radiusAxis: {
min: 40,
max: 100,
interval: 10,
axisLine: {
show: false,
lineStyle: {
// color: "#0B3E5E",
width: 1,
type: "solid",
},
},
axisLabel: {
formatter: "{value} %",
show: false,
padding: [0, 0, 10, 0],
// color: "#0B3E5E",
fontSize: 16,
},
splitLine: {
lineStyle: {
// color: "#0B3E5E",
width: 2,
type: "solid",
},
},
},
calculable: true,
series: [
{
type: "pie",
radius: ["5%", "10%"],
hoverAnimation: false,
labelLine: {
normal: {
show: false,
length: 30,
length2: 55,
},
emphasis: {
show: false,
},
},
data: [
{
name: "",
value: 0,
itemStyle: {
normal: {
color: "#0B4A6B",
},
},
},
],
},
{
type: "pie",
radius: ["75%", "80%"],
hoverAnimation: false,
labelLine: {
normal: {
show: false,
length: 10,
length2: 35,
},
emphasis: {
show: false,
},
},
name: "",
data: [
{
name: "",
value: 0,
itemStyle: {
normal: {
color: "#ccc",
},
},
},
],
},
{
stack: "a",
type: "pie",
radius: ["20%", "60%"],
roseType: "area",
zlevel: 5,
label: {
normal: {
show: true,
formatter: "{c}",
textStyle: {
fontSize: 12,
},
position: "outside",
},
emphasis: {
show: true,
},
},
labelLine: {
normal: {
show: true,
length: 5,
length2: 35,
},
emphasis: {
show: false,
},
},
data: [
{
value: 10,
name: "已派工",
},
{
value: 5,
name: "待派工",
},
{
value: 15,
name: "执行中",
},
{
value: 25,
name: "暂停中",
},
{
value: 20,
name: "未开工",
},
],
},
],
};
// });
},
statistics1() {
// let conditions = [];
// let data = {
// conditions: conditions,
// };
// Api.orderstatuscount(data).then((r) => {
// let listData = [];
// let name = [];
// let allTotal = [];
// listData = r.result;
// r.result.map((e) => {
// name.push(e.name);
// allTotal.push(e.allTotal);
// });
// });
},
viewRow(rowData) {
// this.viewModal = true;
// this.viewData = rowData;
},
},
};
</script>
<style lang="less" scoped>
.stachart {
background: rgba(255, 255, 255, 1);
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.16);
border-radius: 8px;
padding: 10px;
margin: 0 auto;
.echarts-map {
width: 100%;
height: 280px;
// margin: 0 auto;
// text-align: center;
.echarts {
height: 280px;
}
}
.row_head {
height: 35px;
line-height: 30px;
color: #0099ff;
margin-left: 10px;
border-bottom: 1px solid #dcdfe6;
.geng-duo {
text-align: right;
}
}
}
</style>
\ No newline at end of file
pages/home/index.vue
View file @ a367dfcf
...@@ -16,36 +16,40 @@ ...@@ -16,36 +16,40 @@
<div class="bg-b"> <div class="bg-b">
<Icon type="ios-arrow-back" /> <Icon type="ios-arrow-back" />
</div> </div>
<div class="bg" v-for="(item,i) in collect" :key="i" @click="toPage(item)"> <div class="bg" v-for="(item,i) in collect" :key="i" @click="toPage(item)">
<Icon :type="item.icon||'md-mail'" /> <Icon :type="item.icon||'md-mail'" />
<p>{{item.title}}</p> <p>{{item.title}}</p>
</div> </div>
<div class="bg-l"> <div class="bg-l">
<Icon type="ios-arrow-forward" /> <Icon type="ios-arrow-forward" />
</div> </div>
</div> </div>
</div> </div>
<div class="card-list"> <div class="card-list">
<div class="bg-b"> <!-- <div class="bg-b"> -->
<Icon type="ios-arrow-back" /> <Icon type="ios-arrow-back" class="bg-b" />
</div> <!-- </div> -->
<Card <div class="list-c">
v-for="(item,index) in listTask" <div
:key="index" v-for="(item,index) in listTask"
:class="item.name=='物料复验' ? 'img_bg02':(item.name=='产品合格证' ? 'img_bg03':(item.name=='生产执行' ? 'img_bg04' : 'img_bg01'))" :key="index"
@click.native="goPage(item)" :class="item.name=='订单报价' ? 'img_bg02':(item.name=='质量检验' ? 'img_bg03':(item.name=='生产执行' ? 'img_bg04' : 'img_bg01'))"
> @click="goPage(item)"
<div class="leftIco"> >
<img class="img_icon" :src="imgUrl + item.image" alt /> <div class="leftIco">
</div> <img class="img_icon" :src="imgUrl + item.image" alt />
<div class="text-p"> </div>
<p>{{item.totalUrl}}</p> <div class="text-p">
<p>{{item.name}}</p> <p>{{item.totalUrl}}</p>
<p>{{item.name}}</p>
</div>
</div> </div>
</Card>
<div class="bg-l">
<Icon type="ios-arrow-forward" />
</div> </div>
<!-- <div class="bg-l"> -->
<Icon type="ios-arrow-forward" class="bg-l" />
<!-- </div> -->
</div> </div>
<Row class="table" :gutter="16"> <Row class="table" :gutter="16">
<Col :span="15"> <Col :span="15">
...@@ -55,9 +59,83 @@ ...@@ -55,9 +59,83 @@
<UnreadMessage /> <UnreadMessage />
</Col> </Col>
</Row> </Row>
<div class="table"> <div class="table title-r" v-if="show">
<a class="a-r" @click="set(show)">
<Icon type="md-settings" class="f20" />
</a>
<StaChart /> <StaChart />
</div> </div>
<div class="table title-r" v-if="show1">
<a class="a-r" @click="set">
<Icon type="md-settings" class="f20" />
</a>
<UnqualifiedEcharts />
</div>
<Row class="table title-r" :gutter="16">
<Col :span="8" class="title-r" v-if="show2">
<a class="a-r" @click="set(show2)">
<Icon type="md-settings" class="f20" />
</a>
<WorkChart />
</Col>
<Col :span="8" class="title-r" v-if="show3">
<a class="a-r" @click="set">
<Icon type="md-settings" class="f20" />
</a>
<SuspendChart />
</Col>
<Col :span="8" class="title-r" v-if="show4">
<a class="a-r" @click="set">
<Icon type="md-settings" class="f20" />
</a>
<MaterielChart />
</Col>
</Row>
<Modal v-model="modal1" title="统计列表显示设置" width="1200" footer-hide>
<Divider>
<span style="color: #2680eb;">
生产计划状态监控
<Icon :type="show?'md-eye':'md-eye-off'" @click="clickEye" />
</span>
</Divider>
<StaChart :setStatistics="setStatistics" />
<div class="divider-t">
<Divider>
<span style="color: #2680eb;">
不合格品审理单统计
<Icon :type="show1?'md-eye':'md-eye-off'" @click="clickEye1" />
</span>
</Divider>
<UnqualifiedEcharts :setStatistics="setStatistics" />
</div>
<div class="divider-t">
<Divider>
<span style="color: #2680eb;">
班组工单监控
<Icon :type="show2?'md-eye':'md-eye-off'" @click="clickEye2" />
</span>
</Divider>
<WorkChart :setStatistics="setStatistics" />
</div>
<div class="divider-t">
<Divider>
<span style="color: #2680eb;">
暂停任务统计
<Icon :type="show3?'md-eye':'md-eye-off'" @click="clickEye3" />
</span>
</Divider>
<SuspendChart :setStatistics="setStatistics" />
</div>
<div class="divider-t">
<Divider>
<span style="color: #2680eb;">
物料相关统计
<Icon :type="show4?'md-eye':'md-eye-off'" @click="clickEye4" />
</span>
</Divider>
<MaterielChart :setStatistics="setStatistics" />
</div>
</Modal>
</div> </div>
</template> </template>
<script> <script>
...@@ -65,21 +143,38 @@ import Api from "./api"; ...@@ -65,21 +143,38 @@ import Api from "./api";
import Approval from "./component/approval"; import Approval from "./component/approval";
import UnreadMessage from "./component/unreadMessage"; import UnreadMessage from "./component/unreadMessage";
import StaChart from "./component/staChart"; import StaChart from "./component/staChart";
import UnqualifiedEcharts from "./component/unqualifiedEcharts";
import WorkChart from "./component/workChart";
import SuspendChart from "./component/suspendChart";
import MaterielChart from "./component/materielChart";
import { mapState } from "vuex"; import { mapState } from "vuex";
export default { export default {
components: { components: {
Approval, Approval,
UnreadMessage, UnreadMessage,
StaChart, StaChart,
UnqualifiedEcharts,
WorkChart,
SuspendChart,
MaterielChart,
}, },
data() { data() {
return { return {
modal1: false,
listTask: [], listTask: [],
listFavorite: [], listFavorite: [],
imgUrl: iconImg, imgUrl: iconImg,
userData: {}, userData: {},
avatorPath: "", avatorPath: "",
imgPath: true, imgPath: true,
setStatistics: true,
show: true,
show1: false,
show2: false,
show3: false,
show4: false,
}; };
}, },
async fetch({ store, params }) { async fetch({ store, params }) {
...@@ -125,17 +220,34 @@ export default { ...@@ -125,17 +220,34 @@ export default {
return (data.totalUrl = r.result); return (data.totalUrl = r.result);
}); });
}); });
this.listTask = list; this.listTask = list;
}); });
}, },
goPage(u) { goPage(u) {
this.$router.push(u.menuUrl); this.$router.push(u.menuUrl);
}, },
toPage(u) { toPage(u) {
this.$router.push(u.url); this.$router.push(u.url);
}, },
set() {
this.modal1 = true;
this.setStatistics = true;
},
clickEye() {
this.show = !this.show;
},
clickEye1() {
this.show1 = !this.show1;
},
clickEye2() {
this.show2 = !this.show2;
},
clickEye3() {
this.show3 = !this.show3;
},
clickEye4() {
this.show4 = !this.show4;
},
}, },
}; };
</script> </script>
...@@ -197,58 +309,76 @@ export default { ...@@ -197,58 +309,76 @@ export default {
} }
} }
.card-list { .card-list {
display: flex;
display: -webkit-flex;
margin-top: 15px; margin-top: 15px;
justify-content: space-around; position: relative;
text-align: center;
.bg-b { .bg-b {
margin-top: 40px;
font-size: 30px; font-size: 30px;
color: #dcdfe6; color: #dcdfe6;
width: 35px; width: 35px;
position: absolute;
top: 45px;
left: 0;
}
.list-c {
// display: flex;
// display: -webkit-flex;
// justify-content: space-around;
width: 98%;
margin: 0 auto;
display: -webkit-inline-box;
overflow-x: hidden;
} }
.bg-l { .bg-l {
margin-top: 40px; position: absolute;
font-size: 30px; font-size: 30px;
color: #dcdfe6; color: #dcdfe6;
top: 45px;
right: 0;
width: 35px; width: 35px;
} }
.img_bg01 { .img_bg01 {
background-color: #ff9100; background-color: #ff9100;
width: 290px; width: 290px;
height: 130px; height: 130px;
border-radius: 8px;
cursor: pointer; cursor: pointer;
margin: 0 40px;
background: linear-gradient(to left, #0673df, #26c2e9); background: linear-gradient(to left, #0673df, #26c2e9);
} }
.img_bg02 { .img_bg02 {
width: 290px; width: 290px;
height: 130px; height: 130px;
cursor: pointer; cursor: pointer;
margin: 0 40px;
border-radius: 8px;
background: linear-gradient(to left, #5140e9, #8a92fc); background: linear-gradient(to left, #5140e9, #8a92fc);
} }
.img_bg03 { .img_bg03 {
cursor: pointer; cursor: pointer;
width: 290px; width: 290px;
height: 130px; height: 130px;
margin: 0 40px;
border-radius: 8px;
background: linear-gradient(to left, #04b573, #69fc8a); background: linear-gradient(to left, #04b573, #69fc8a);
} }
.img_bg04 { .img_bg04 {
cursor: pointer; cursor: pointer;
width: 290px; width: 290px;
height: 130px; height: 130px;
margin: 0 40px;
border-radius: 8px;
background: linear-gradient(to left, #6514cf, #a972fe); background: linear-gradient(to left, #6514cf, #a972fe);
} }
.img_icon { .img_icon {
width: 40px; width: 40px;
height: 40px; height: 40px;
margin: 45% 0 0 20%; margin: 72% 0 0 38px;
} }
.text-p { .text-p {
text-align: center; text-align: center;
color: #fff; color: #fff;
padding: 2% 0 0 40%; padding: 7% 0 0 35%;
p:first-child { p:first-child {
font-size: 30px; font-size: 30px;
font-weight: bold; font-weight: bold;
...@@ -268,5 +398,21 @@ export default { ...@@ -268,5 +398,21 @@ export default {
.table { .table {
margin-top: 15px; margin-top: 15px;
} }
.title-r {
position: relative;
}
.a-r {
position: absolute;
top: 15px;
right: 15px;
z-index: 100;
}
.set-p {
width: 100%;
margin: 0 auto;
}
}
.divider-t {
padding-top: 25px;
} }
</style> </style>
\ No newline at end of file
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