|
|
@@ -47,6 +47,7 @@
|
|
|
<script src="https://img.hcharts.cn/highcharts/highcharts.js"></script>
|
|
|
<script src="https://img.hcharts.cn/highcharts/modules/exporting.js"></script>
|
|
|
<script src="https://img.hcharts.cn/highcharts-plugins/highcharts-zh_CN.js"></script>
|
|
|
+ <script src="https://img.hcharts.cn/highcharts/themes/dark-unica.js"></script>
|
|
|
<script>
|
|
|
var timer = null;
|
|
|
|
|
|
@@ -71,7 +72,7 @@
|
|
|
var minutes = displayClock(time.getMinutes()) + ":";
|
|
|
var seconds = displayClock(time.getSeconds());
|
|
|
//显示时间
|
|
|
- show.innerHTML = hours + minutes + seconds;//在id为show的块区域显示
|
|
|
+ $("#clockt").innerHTML = hours + minutes + seconds;//在id为show的块区域显示
|
|
|
timer = setTimeout("startClock()", 1000);//延时器
|
|
|
}
|
|
|
</script>
|
|
|
@@ -83,51 +84,255 @@
|
|
|
text-align: center;
|
|
|
}
|
|
|
</style>
|
|
|
-<body>
|
|
|
-<nav class="navbar navbar-expand-lg navbar-light bg-light" style-height="10">
|
|
|
- <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
|
|
|
- aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
|
|
+<body class="theme-black" style="background-color: #17253f !important;">
|
|
|
+<nav class="navbar">
|
|
|
+ <div class="container-fluid">
|
|
|
+ <div class="navbar-header">
|
|
|
+ <a class="navbar-brand" href="index.html">工厂产能监控系统</a>
|
|
|
+ </div>
|
|
|
+ <div class="collapse navbar-collapse" id="navbar-collapse">
|
|
|
+ <ul class="nav navbar-nav navbar-right">
|
|
|
+ <!-- Call Search -->
|
|
|
+ <li><a href="javascript:void(0);" class="js-search" data-close="true"><i class="material-icons">search</i></a></li>
|
|
|
+ <!-- #END# Call Search -->
|
|
|
+ <!-- Notifications -->
|
|
|
+ <li class="dropdown">
|
|
|
+ <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown" role="button">
|
|
|
+ <i class="material-icons">notifications</i>
|
|
|
+ <span class="label-count">7</span>
|
|
|
+ </a>
|
|
|
+ <ul class="dropdown-menu">
|
|
|
+ <li class="header">NOTIFICATIONS</li>
|
|
|
+ <li class="body">
|
|
|
+ <div class="slimScrollDiv" style="position: relative; overflow: hidden; width: auto; height: 254px;"><ul class="menu" style="overflow: hidden; width: auto; height: 254px;">
|
|
|
+ <li>
|
|
|
+ <a href="javascript:void(0);" class=" waves-effect waves-block">
|
|
|
+ <div class="icon-circle bg-light-green">
|
|
|
+ <i class="material-icons">person_add</i>
|
|
|
+ </div>
|
|
|
+ <div class="menu-info">
|
|
|
+ <h4>12 new members joined</h4>
|
|
|
+ <p>
|
|
|
+ <i class="material-icons">access_time</i> 14 mins ago
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <a href="javascript:void(0);" class=" waves-effect waves-block">
|
|
|
+ <div class="icon-circle bg-cyan">
|
|
|
+ <i class="material-icons">add_shopping_cart</i>
|
|
|
+ </div>
|
|
|
+ <div class="menu-info">
|
|
|
+ <h4>4 sales made</h4>
|
|
|
+ <p>
|
|
|
+ <i class="material-icons">access_time</i> 22 mins ago
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <a href="javascript:void(0);" class=" waves-effect waves-block">
|
|
|
+ <div class="icon-circle bg-red">
|
|
|
+ <i class="material-icons">delete_forever</i>
|
|
|
+ </div>
|
|
|
+ <div class="menu-info">
|
|
|
+ <h4><b>Nancy Doe</b> deleted account</h4>
|
|
|
+ <p>
|
|
|
+ <i class="material-icons">access_time</i> 3 hours ago
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <a href="javascript:void(0);" class=" waves-effect waves-block">
|
|
|
+ <div class="icon-circle bg-orange">
|
|
|
+ <i class="material-icons">mode_edit</i>
|
|
|
+ </div>
|
|
|
+ <div class="menu-info">
|
|
|
+ <h4><b>Nancy</b> changed name</h4>
|
|
|
+ <p>
|
|
|
+ <i class="material-icons">access_time</i> 2 hours ago
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <a href="javascript:void(0);" class=" waves-effect waves-block">
|
|
|
+ <div class="icon-circle bg-blue-grey">
|
|
|
+ <i class="material-icons">comment</i>
|
|
|
+ </div>
|
|
|
+ <div class="menu-info">
|
|
|
+ <h4><b>John</b> commented your post</h4>
|
|
|
+ <p>
|
|
|
+ <i class="material-icons">access_time</i> 4 hours ago
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <a href="javascript:void(0);" class=" waves-effect waves-block">
|
|
|
+ <div class="icon-circle bg-light-green">
|
|
|
+ <i class="material-icons">cached</i>
|
|
|
+ </div>
|
|
|
+ <div class="menu-info">
|
|
|
+ <h4><b>John</b> updated status</h4>
|
|
|
+ <p>
|
|
|
+ <i class="material-icons">access_time</i> 3 hours ago
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <a href="javascript:void(0);" class=" waves-effect waves-block">
|
|
|
+ <div class="icon-circle bg-purple">
|
|
|
+ <i class="material-icons">settings</i>
|
|
|
+ </div>
|
|
|
+ <div class="menu-info">
|
|
|
+ <h4>Settings updated</h4>
|
|
|
+ <p>
|
|
|
+ <i class="material-icons">access_time</i> Yesterday
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ </ul><div class="slimScrollBar" style="background: rgba(0, 0, 0, 0.5); width: 4px; position: absolute; top: 0px; opacity: 0.4; display: block; border-radius: 0px; z-index: 99; right: 1px;"></div><div class="slimScrollRail" style="width: 4px; height: 100%; position: absolute; top: 0px; display: none; border-radius: 0px; background: rgb(51, 51, 51); opacity: 0.2; z-index: 90; right: 1px;"></div></div>
|
|
|
+ </li>
|
|
|
+ <li class="footer">
|
|
|
+ <a href="javascript:void(0);" class=" waves-effect waves-block">View All Notifications</a>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </li>
|
|
|
+ <!-- #END# Notifications -->
|
|
|
+ <!-- Tasks -->
|
|
|
+ <li class="dropdown">
|
|
|
+ <a href="javascript:void(0);" class="dropdown-toggle" data-toggle="dropdown" role="button">
|
|
|
+ <i class="material-icons">flag</i>
|
|
|
+ <span class="label-count">9</span>
|
|
|
+ </a>
|
|
|
+ <ul class="dropdown-menu">
|
|
|
+ <li class="header">TASKS</li>
|
|
|
+ <li class="body">
|
|
|
+ <div class="slimScrollDiv" style="position: relative; overflow: hidden; width: auto; height: 254px;"><ul class="menu tasks" style="overflow: hidden; width: auto; height: 254px;">
|
|
|
+ <li>
|
|
|
+ <a href="javascript:void(0);" class=" waves-effect waves-block">
|
|
|
+ <h4>
|
|
|
+ Footer display issue
|
|
|
+ <small>32%</small>
|
|
|
+ </h4>
|
|
|
+ <div class="progress">
|
|
|
+ <div class="progress-bar bg-pink" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 32%">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <a href="javascript:void(0);" class=" waves-effect waves-block">
|
|
|
+ <h4>
|
|
|
+ Make new buttons
|
|
|
+ <small>45%</small>
|
|
|
+ </h4>
|
|
|
+ <div class="progress">
|
|
|
+ <div class="progress-bar bg-cyan" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 45%">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <a href="javascript:void(0);" class=" waves-effect waves-block">
|
|
|
+ <h4>
|
|
|
+ Create new dashboard
|
|
|
+ <small>54%</small>
|
|
|
+ </h4>
|
|
|
+ <div class="progress">
|
|
|
+ <div class="progress-bar bg-teal" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 54%">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <a href="javascript:void(0);" class=" waves-effect waves-block">
|
|
|
+ <h4>
|
|
|
+ Solve transition issue
|
|
|
+ <small>65%</small>
|
|
|
+ </h4>
|
|
|
+ <div class="progress">
|
|
|
+ <div class="progress-bar bg-orange" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 65%">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ <li>
|
|
|
+ <a href="javascript:void(0);" class=" waves-effect waves-block">
|
|
|
+ <h4>
|
|
|
+ Answer GitHub questions
|
|
|
+ <small>92%</small>
|
|
|
+ </h4>
|
|
|
+ <div class="progress">
|
|
|
+ <div class="progress-bar bg-purple" role="progressbar" aria-valuenow="85" aria-valuemin="0" aria-valuemax="100" style="width: 92%">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </a>
|
|
|
+ </li>
|
|
|
+ </ul><div class="slimScrollBar" style="background: rgba(0, 0, 0, 0.5); width: 4px; position: absolute; top: 0px; opacity: 0.4; display: block; border-radius: 0px; z-index: 99; right: 1px;"></div><div class="slimScrollRail" style="width: 4px; height: 100%; position: absolute; top: 0px; display: none; border-radius: 0px; background: rgb(51, 51, 51); opacity: 0.2; z-index: 90; right: 1px;"></div></div>
|
|
|
+ </li>
|
|
|
+ <li class="footer">
|
|
|
+ <a href="javascript:void(0);" class=" waves-effect waves-block">View All Tasks</a>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </li>
|
|
|
+ <!-- #END# Tasks -->
|
|
|
+ <li class="pull-right"><a href="javascript:void(0);" class="js-right-sidebar" data-close="true"><i class="material-icons">more_vert</i></a></li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</nav>
|
|
|
+<!--<nav class="navbar navbar-expand-lg navbar-light bg-light" style-height="10">-- >
|
|
|
+ <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarTogglerDemo01" aria-controls="navbarTogglerDemo01" aria-expanded="false" aria-label="Toggle navigation">
|
|
|
<span class="navbar-toggler-icon"></span>
|
|
|
</button>
|
|
|
-
|
|
|
- <div class="collapse navbar-collapse" id="navbarSupportedContent">
|
|
|
- <ul class="navbar-nav mr-auto">
|
|
|
- <li class="nav-item active navbar-brand">
|
|
|
- <h1 class="navbar-brand" href="#">生产线<span>1</span>号</h1>
|
|
|
+ <div class="collapse navbar-collapse" id="navbarTogglerDemo01">
|
|
|
+ <a class="navbar-brand" href="#">Hidden brand</a>
|
|
|
+ <ul class="navbar-nav mr-auto mt-2 mt-lg-0">
|
|
|
+ <li class="nav-item active">
|
|
|
+ <a class="nav-link" href="#">生产线<span>1</span>号 </a>
|
|
|
</li>
|
|
|
- <li class="nav-item btn navbar-nav" id="show">
|
|
|
+ <li class="nav-item">
|
|
|
+ <a class="nav-link" href="#"><span id="clockt"></span></a>
|
|
|
+ </li>
|
|
|
+ <li class="nav-item">
|
|
|
+ <a class="nav-link disabled" href="#">Disabled</a>
|
|
|
</li>
|
|
|
</ul>
|
|
|
- <ul style="margin: 0">
|
|
|
- <button type="button" class="btn btn-danger btn-lg" style="width:100% ;background: red;font-size: 2em">
|
|
|
- 下班
|
|
|
- </button>
|
|
|
- </ul>
|
|
|
- <div class="dropdown" style="font-size: 2em">
|
|
|
- <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown"
|
|
|
- aria-haspopup="true" aria-expanded="false" style="font-size: 0.5em">
|
|
|
- <div class="row">
|
|
|
- <div class="col-4">
|
|
|
- 拉长
|
|
|
- </div>
|
|
|
- <div class="col-5">
|
|
|
- 张三
|
|
|
+ <form class="form-inline my-2 my-lg-0">
|
|
|
+ <input class="form-control mr-sm-2" type="search" placeholder="Search" aria-label="Search">
|
|
|
+ <button class="btn btn-outline-success my-2 my-sm-0" type="submit">下班</button>
|
|
|
+
|
|
|
+ <div class="dropdown">
|
|
|
+ <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown"
|
|
|
+ aria-haspopup="true" aria-expanded="false" style="font-size: 0.5em">
|
|
|
+ <div class="row">
|
|
|
+ <div class="col-4">
|
|
|
+ 拉长
|
|
|
+ </div>
|
|
|
+ <div class="col-5">
|
|
|
+ 张三
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
-
|
|
|
- </button>
|
|
|
- <ul class="dropdown-menu" aria-labelledby="dropdownMenu2">
|
|
|
- <li><a href="#">更改密码</a></li>
|
|
|
- <li><a href="#">退出登录</a></li>
|
|
|
- </ul>
|
|
|
- </div>
|
|
|
|
|
|
+ </button>
|
|
|
+ <ul class="dropdown-menu" aria-labelledby="dropdownMenu2">
|
|
|
+ <li><a href="#">更改密码</a></li>
|
|
|
+ <li><a href="#">退出登录</a></li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
</div>
|
|
|
-</nav>
|
|
|
-<section class="content" style="margin: 0 auto;">
|
|
|
- <div class="row" style-height="10"></div>
|
|
|
+</nav>-->
|
|
|
+<section class="content" style="margin: 0 auto; margin-top: 100px;">
|
|
|
+ <div class="row"></div>
|
|
|
<div class="container-fluid " style="margin-bottom: 1em">
|
|
|
- <div style-height="20" class="row text-center">
|
|
|
+ <div class="row text-center">
|
|
|
<div class="col-lg-3 col-md-3 col-sm-6 col-xs-12">
|
|
|
<div class="info-box bg-green hover-expand-effect" style="margin: 0;">
|
|
|
<div class="icon">
|
|
|
@@ -184,8 +389,8 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="container-fluid" style="margin-top: 0.5em;padding-top: 1em">
|
|
|
- <div id="graph-1" style-height="40"></div>
|
|
|
- <div class="card" style-height="20" style="margin: 0 auto;">
|
|
|
+
|
|
|
+ <div class="card" style-height="30-8" style="margin: 0 auto;">
|
|
|
<div>
|
|
|
<div class="" style="">
|
|
|
<div class="table-responsive" style="width: 30%;float: left">
|
|
|
@@ -236,12 +441,11 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
-
|
|
|
-
|
|
|
- <!-- #END# Answered Tickets -->
|
|
|
+ <div class="row" style="height: 3em;"></div>
|
|
|
+ <div class="row" style-height="50-8">
|
|
|
+ <div id="graph-1"></div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
-
|
|
|
-
|
|
|
</section>
|
|
|
|
|
|
<!-- Jquery Core Js -->
|
|
|
@@ -312,25 +516,26 @@
|
|
|
}
|
|
|
|
|
|
for (i = 0; i < triGap; i++) {
|
|
|
- one_person = namedata[i+triGap];
|
|
|
- htmlbody = getSpotHtml(htmlbody, one_person, i+triGap);
|
|
|
+ one_person = namedata[i + triGap];
|
|
|
+ htmlbody = getSpotHtml(htmlbody, one_person, i + triGap);
|
|
|
$("#rank-two").html(htmlbody);
|
|
|
}
|
|
|
|
|
|
for (i = 0; i < remain; i++) {
|
|
|
- one_person = namedata[i+triGap*2];
|
|
|
- htmlbody = getSpotHtml(htmlbody, one_person, i+triGap*2);
|
|
|
+ one_person = namedata[i + triGap * 2];
|
|
|
+ htmlbody = getSpotHtml(htmlbody, one_person, i + triGap * 2);
|
|
|
$("#rank-three").html(htmlbody);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
var thisPageFlow = 1;
|
|
|
+
|
|
|
function showChart() {
|
|
|
|
|
|
var data = [];
|
|
|
var ratedata = [];
|
|
|
var stackmax = 0;
|
|
|
- var failmax=0;
|
|
|
+ var failmax = 0;
|
|
|
|
|
|
for (i = 0; i < passNumber.length; i++) {
|
|
|
if (stackmax < stackeverynum[i]) {
|
|
|
@@ -343,12 +548,13 @@
|
|
|
ratedata.push(Math.floor(failrate[i]));
|
|
|
}
|
|
|
|
|
|
- stackmax = Math.max(stackmax,5);
|
|
|
- failmax =Math.max(failmax,5);
|
|
|
+ stackmax = Math.max(stackmax, 5);
|
|
|
+ failmax = Math.max(failmax, 5);
|
|
|
|
|
|
stackAndFailChart = Highcharts.chart('graph-1', {
|
|
|
chart: {
|
|
|
- zoomType: 'xy'
|
|
|
+ zoomType: 'xy',
|
|
|
+ height: (4 / 16 * 100) + '%' // 16:9 ratio
|
|
|
},
|
|
|
title: {
|
|
|
text: null
|
|
|
@@ -365,12 +571,12 @@
|
|
|
title: {
|
|
|
text: '员工',
|
|
|
style: {
|
|
|
- fontSize: '15px'
|
|
|
+ fontSize: '1.5em'
|
|
|
}
|
|
|
},
|
|
|
labels: {
|
|
|
style: {
|
|
|
- fontSize: '20px'
|
|
|
+ fontSize: '1.5em'
|
|
|
}
|
|
|
}
|
|
|
}],
|
|
|
@@ -379,7 +585,7 @@
|
|
|
format: '{value}',
|
|
|
style: {
|
|
|
color: Highcharts.getOptions().colors[0],
|
|
|
- fontSize: '20px'
|
|
|
+ fontSize: '1.5em'
|
|
|
}
|
|
|
},
|
|
|
min: 0,
|
|
|
@@ -388,7 +594,7 @@
|
|
|
text: '堆积数',
|
|
|
style: {
|
|
|
color: Highcharts.getOptions().colors[0],
|
|
|
- fontSize: '15px'
|
|
|
+ fontSize: '1em'
|
|
|
}
|
|
|
}
|
|
|
}, { // Secondary yAxis
|
|
|
@@ -396,13 +602,13 @@
|
|
|
text: '不良率',
|
|
|
style: {
|
|
|
color: 'red',
|
|
|
- fontSize: '15px'
|
|
|
+ fontSize: '1em'
|
|
|
}
|
|
|
},
|
|
|
min: 0,
|
|
|
max: 1.5 * failmax,
|
|
|
labels: {
|
|
|
- formatter: function() {
|
|
|
+ formatter: function () {
|
|
|
return Math.floor(this.value) + "%";
|
|
|
},
|
|
|
style: {
|
|
|
@@ -444,11 +650,12 @@
|
|
|
}]
|
|
|
});
|
|
|
}
|
|
|
- function updateChart(){
|
|
|
+
|
|
|
+ function updateChart() {
|
|
|
var data = [];
|
|
|
var ratedata = [];
|
|
|
var stackmax = 0;
|
|
|
- var failmax=0;
|
|
|
+ var failmax = 0;
|
|
|
|
|
|
for (i = 0; i < passNumber.length; i++) {
|
|
|
if (stackmax < stackeverynum[i]) {
|
|
|
@@ -461,33 +668,35 @@
|
|
|
ratedata.push(Math.floor(failrate[i]));
|
|
|
}
|
|
|
|
|
|
- stackmax = Math.max(stackmax,5);
|
|
|
- failmax =Math.max(failmax,5);
|
|
|
+ stackmax = Math.max(stackmax, 5);
|
|
|
+ failmax = Math.max(failmax, 5);
|
|
|
// https://api.hcharts.cn/highcharts#Series.addPoint;
|
|
|
stackAndFailChart.series[0].setData(data);
|
|
|
stackAndFailChart.series[1].setData(ratedata);
|
|
|
}
|
|
|
+
|
|
|
var stackAndFailChart = null;
|
|
|
|
|
|
$(document).ready(on_document_load);
|
|
|
window.onresize = resizeAll;
|
|
|
|
|
|
- function resizeAll(){
|
|
|
+ function resizeAll() {
|
|
|
$('[style-height="10"]').height(window.innerHeight / 10);
|
|
|
- $('[style-height="20"]').height(window.innerHeight / 5);
|
|
|
- $('[style-height="30"]').height(window.innerHeight / 3.33333);
|
|
|
+ $('[style-height="20"]').each(function(one,items){$(items).height(window.innerHeight / 5)});
|
|
|
+ $('[style-height="30"]').each(function(one,items){$(items).height(window.innerHeight * 0.3)});
|
|
|
$('[style-height="40"]').height(window.innerHeight / 2.5);
|
|
|
+ $('[style-height="30-8"]').height(window.innerHeight * 0.4 - 220);
|
|
|
var graph = $("#graph-1");
|
|
|
- graph.width(window.innerWidth);
|
|
|
+ graph.width(window.innerWidth - 35);
|
|
|
graph.height(window.innerHeight / 3.333);
|
|
|
- if(graph.highcharts !== undefined) {
|
|
|
+ if (graph.highcharts !== undefined) {
|
|
|
graph.highcharts().reflow();
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- setInterval(function(){
|
|
|
+ setInterval(function () {
|
|
|
resizeAll();
|
|
|
- },5000);
|
|
|
+ }, 5000);
|
|
|
|
|
|
resizeAll();
|
|
|
|
