From 99882f1e5c2ca6138a99a93bc5ed00b88ebf5225 Mon Sep 17 00:00:00 2001 From: ccongli <1441652193@qq.com> Date: Wed, 13 Sep 2023 14:10:00 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A4=A7=E5=B1=8F=E9=A1=B5=E9=9D=A2=E4=B8=8E?= =?UTF-8?q?=E6=8E=A5=E5=8F=A3=E5=BC=80=E5=8F=91v1?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../config/Partial/IData_ConfigService.cs | 2 + .../machine/Partial/IData_MachineService.cs | 2 + .../IServices/modbus/IDataProcessing.cs | 10 +- .../produce/Partial/IData_ProduceService.cs | 12 +- .../config/Partial/Data_ConfigService.cs | 9 +- .../Services/machine/Data_MachineService.cs | 20 +- .../machine/Partial/Data_MachineService.cs | 62 +- .../Services/modbus/DataProcessing.cs | 19 +- .../Services/produce/Data_ProduceService.cs | 2 + .../produce/Partial/Data_ProduceService.cs | 34 +- .../DomainModels/Core/PageGridData.cs | 3 + .../config/partial/Data_Config.cs | 16 + .../machine/partial/Data_Machine.cs | 51 ++ .../produce/partial/Data_Produce.cs | 7 + .../Controllers/Data/DataApiController.cs | 68 ++ .../Controllers/Data/DataCaptureController.cs | 82 ++- vol-vue3/package.json | 2 +- vol-vue3/src/api/http.js | 3 +- vol-vue3/src/components/echarts/Bar.vue | 175 +++++ vol-vue3/src/components/echarts/Gauge.vue | 140 ++++ vol-vue3/src/components/echarts/Line.vue | 172 +++++ vol-vue3/src/components/echarts/Number.vue | 71 ++ vol-vue3/src/extension/order/SellOrder.js | 1 + vol-vue3/src/mixin/index.js | 2 +- vol-vue3/src/uitils/common.js | 28 +- .../src/views/data/bigscreen/chart-options.js | 609 +++++++++++++++--- vol-vue3/src/views/data/bigscreen/index.less | 336 +++++----- vol-vue3/src/views/data/bigscreen/index.vue | 276 +++++++- vol-vue3/yarn.lock | 35 +- 29 files changed, 1854 insertions(+), 395 deletions(-) create mode 100644 vol-net6/VOL.WebApi/Controllers/Data/DataApiController.cs create mode 100644 vol-vue3/src/components/echarts/Bar.vue create mode 100644 vol-vue3/src/components/echarts/Gauge.vue create mode 100644 vol-vue3/src/components/echarts/Line.vue create mode 100644 vol-vue3/src/components/echarts/Number.vue diff --git a/vol-net6/VOL.Data/IServices/config/Partial/IData_ConfigService.cs b/vol-net6/VOL.Data/IServices/config/Partial/IData_ConfigService.cs index 4309979..8090314 100644 --- a/vol-net6/VOL.Data/IServices/config/Partial/IData_ConfigService.cs +++ b/vol-net6/VOL.Data/IServices/config/Partial/IData_ConfigService.cs @@ -9,5 +9,7 @@ namespace VOL.Data.IServices { public partial interface IData_ConfigService { + // 获取设备配置列表 + List getConfigList(); } } diff --git a/vol-net6/VOL.Data/IServices/machine/Partial/IData_MachineService.cs b/vol-net6/VOL.Data/IServices/machine/Partial/IData_MachineService.cs index 0609559..371b948 100644 --- a/vol-net6/VOL.Data/IServices/machine/Partial/IData_MachineService.cs +++ b/vol-net6/VOL.Data/IServices/machine/Partial/IData_MachineService.cs @@ -9,5 +9,7 @@ namespace VOL.Data.IServices { public partial interface IData_MachineService { + // 查询设备列表数据 + Dictionary GetMachineData(); } } diff --git a/vol-net6/VOL.Data/IServices/modbus/IDataProcessing.cs b/vol-net6/VOL.Data/IServices/modbus/IDataProcessing.cs index 4a3f381..4cf2b05 100644 --- a/vol-net6/VOL.Data/IServices/modbus/IDataProcessing.cs +++ b/vol-net6/VOL.Data/IServices/modbus/IDataProcessing.cs @@ -20,15 +20,13 @@ namespace VOL.Data.IServices.modbus Dictionary> readGSKData(IModbusService modbus); - // 写设备运行数据 - bool saveDeviceData(Data_Machine machine, out string message); + // 保存设备数据 + bool saveMachineData(Data_Machine machine, out string message); - // 写设备生产数据 + // 保存生产数据 bool saveProduceData(Data_Produce produce, out string message); - - // 写设备性能数据 - bool saveEfficiencyData(); + } } diff --git a/vol-net6/VOL.Data/IServices/produce/Partial/IData_ProduceService.cs b/vol-net6/VOL.Data/IServices/produce/Partial/IData_ProduceService.cs index c7c8b38..4b99c27 100644 --- a/vol-net6/VOL.Data/IServices/produce/Partial/IData_ProduceService.cs +++ b/vol-net6/VOL.Data/IServices/produce/Partial/IData_ProduceService.cs @@ -1,13 +1,19 @@ /* *所有关于Data_Produce类的业务代码接口应在此处编写 */ -using VOL.Core.BaseProvider; using VOL.Entity.DomainModels; -using VOL.Core.Utilities; -using System.Linq.Expressions; + + namespace VOL.Data.IServices { public partial interface IData_ProduceService { + // 根据查询对象获取最新的一条记录 + Data_Produce getLastProduceData(Func query); + + + // 最近一周生产加工数 + List produceDataGroupByWeekDays(); + } } diff --git a/vol-net6/VOL.Data/Services/config/Partial/Data_ConfigService.cs b/vol-net6/VOL.Data/Services/config/Partial/Data_ConfigService.cs index 82eb28a..ce52b68 100644 --- a/vol-net6/VOL.Data/Services/config/Partial/Data_ConfigService.cs +++ b/vol-net6/VOL.Data/Services/config/Partial/Data_ConfigService.cs @@ -37,5 +37,12 @@ namespace VOL.Data.Services //多租户会用到这init代码，其他情况可以不用 //base.Init(dbRepository); } - } + + public List getConfigList() { + var list = _repository.DbContext.Set().Select(x => new Data_Config(){ + id = x.id, name = x.name, type = x.type, device_ip = x.device_ip, com_ip = x.com_ip + }).OrderBy(x=> x.id).ToList(); + return list; + } + } } diff --git a/vol-net6/VOL.Data/Services/machine/Data_MachineService.cs b/vol-net6/VOL.Data/Services/machine/Data_MachineService.cs index ebb507c..edece9f 100644 --- a/vol-net6/VOL.Data/Services/machine/Data_MachineService.cs +++ b/vol-net6/VOL.Data/Services/machine/Data_MachineService.cs @@ -15,13 +15,15 @@ namespace VOL.Data.Services public partial class Data_MachineService : ServiceBase , IData_MachineService, IDependency { - public Data_MachineService(IData_MachineRepository repository) - : base(repository) - { - Init(repository); - } - public static IData_MachineService Instance - { - get { return AutofacContainerModule.GetService(); } } + public Data_MachineService(IData_MachineRepository repository) + : base(repository) + { + Init(repository); + } + public static IData_MachineService Instance + { + get { return AutofacContainerModule.GetService(); } + } } - } + +} diff --git a/vol-net6/VOL.Data/Services/machine/Partial/Data_MachineService.cs b/vol-net6/VOL.Data/Services/machine/Partial/Data_MachineService.cs index fbad578..68d23f0 100644 --- a/vol-net6/VOL.Data/Services/machine/Partial/Data_MachineService.cs +++ b/vol-net6/VOL.Data/Services/machine/Partial/Data_MachineService.cs @@ -17,6 +17,14 @@ using Microsoft.EntityFrameworkCore; using Microsoft.Extensions.DependencyInjection; using Microsoft.AspNetCore.Http; using VOL.Data.IRepositories; +using OfficeOpenXml.FormulaParsing.Excel.Functions.Math; +using SkiaSharp; +using StackExchange.Redis; +using System.Text.RegularExpressions; +using Microsoft.EntityFrameworkCore.Metadata.Internal; +using Newtonsoft.Json; +using System; +using System.Collections.Generic; namespace VOL.Data.Services { @@ -37,5 +45,57 @@ namespace VOL.Data.Services //多租户会用到这init代码，其他情况可以不用 //base.Init(dbRepository); } - } + + public Dictionary GetMachineData() + { + var db = _repository.DbContext.Set(); + var machineList = new Dictionary(); + List configList = Data_ConfigService.Instance.getConfigList(); + IQueryable query = db.Where(x => x.com_status == 5); + foreach ( Data_Config config in configList ) + { + // 机床数据，各自取最新一条 + Data_Machine? data_Machine = query.Where(x => x.config_id == config.id). + OrderByDescending(d => d.CreateDate).FirstOrDefault(); + if ( data_Machine != null ) + { + data_Machine.com_ip = config.com_ip; + data_Machine.name = config.name; + data_Machine.totalQuantity = data_Machine.quantity_total; + data_Machine.totalRuntime = data_Machine.run_time_total; + // 生产数据, 各自取最新一条 + Func where = p => p.config_id == config.id && p.com_status == 5; + Data_Produce data_Produce = Data_ProduceService.Instance.getLastProduceData(where); + if (data_Produce != null) + { + data_Machine.currentTurnout = data_Produce.turnout_all; + data_Machine.OEE = data_Produce.oee; + } + machineList.Add(config.id, data_Machine); + } + } + return machineList; + } + + + public void testQuery() { + //List data_Machines = _repository.DbContext.Set().ToList(); + //var list = db.Where(x => x.com_status == 5).GroupBy(e => e.config_id).Select(g => new { + // ConfigId = g.Key, + // Data_Machine = g.OrderByDescending(d => d.CreateDate).ToList() + //}).OrderBy(g => g.ConfigId).ToList(); + // 1. 查设备ID分组 + //var result1 = db.GroupBy(e => e.config_id).Select(g => new + //{ + // ConfigId = g.Key + //}).OrderBy(g => g.ConfigId).ToList(); + //List configIds = result1.Select(c => c.ConfigId).ToList(); + // 2. 查找设备名称并赋值 + //var result2 = db.Where(p => configIds.Contains(p.config_id) && p.com_status == 5).OrderByDescending(o => o.CreateDate).ToList(); + //Console.Write(JsonConvert.SerializeObject(result2)); + + //Console.Write(string.Join(",", data_Machines)); + //var list = db.GroupBy(e => e.config_id).Count(); + } + } } diff --git a/vol-net6/VOL.Data/Services/modbus/DataProcessing.cs b/vol-net6/VOL.Data/Services/modbus/DataProcessing.cs index 76189dd..9c3a115 100644 --- a/vol-net6/VOL.Data/Services/modbus/DataProcessing.cs +++ b/vol-net6/VOL.Data/Services/modbus/DataProcessing.cs @@ -54,12 +54,13 @@ namespace VOL.Data.Services.modbus { "cut_rate", modbus.readData(1, 1225, "single")}, // 切削倍率 { "main_rate", modbus.readData(1, 1231, "single")}, // 主轴倍率 { "run_program_no", modbus.readData(1, 6689, "string", 26)}, // 加工程序号 length = 52 + { "run_time_total", modbus.readData(1, 6435, "int16")}, // 累计运行时长 分钟 }; // 组装Map返回 Dictionary> map = new(); map.Add("produce", map1); - map.Add("device", map2); + map.Add("machine", map2); return map; } @@ -105,13 +106,13 @@ namespace VOL.Data.Services.modbus // 组装Map返回 Dictionary> map = new(); map.Add("produce", map1); - map.Add("device", map2); + map.Add("machine", map2); return map; } - // 写机床数据 - public bool saveDeviceData(Data_Machine machine, out string message) { + // 保存机床数据 + public bool saveMachineData(Data_Machine machine, out string message) { SaveModel model = new SaveModel(); Dictionary mapData = new() { @@ -142,7 +143,7 @@ namespace VOL.Data.Services.modbus - // 写生产数据 + // 保存生产数据 public bool saveProduceData(Data_Produce produce, out string message) { SaveModel model = new SaveModel(); @@ -174,13 +175,5 @@ namespace VOL.Data.Services.modbus message = "ok"; return true; } - - - // 写设备性能数据 - public bool saveEfficiencyData() - { - throw new NotImplementedException(); - } - } } diff --git a/vol-net6/VOL.Data/Services/produce/Data_ProduceService.cs b/vol-net6/VOL.Data/Services/produce/Data_ProduceService.cs index fbc8bd7..8a32282 100644 --- a/vol-net6/VOL.Data/Services/produce/Data_ProduceService.cs +++ b/vol-net6/VOL.Data/Services/produce/Data_ProduceService.cs @@ -24,4 +24,6 @@ namespace VOL.Data.Services { get { return AutofacContainerModule.GetService(); } } } + + } diff --git a/vol-net6/VOL.Data/Services/produce/Partial/Data_ProduceService.cs b/vol-net6/VOL.Data/Services/produce/Partial/Data_ProduceService.cs index 1d3eab6..869524f 100644 --- a/vol-net6/VOL.Data/Services/produce/Partial/Data_ProduceService.cs +++ b/vol-net6/VOL.Data/Services/produce/Partial/Data_ProduceService.cs @@ -17,6 +17,8 @@ using Microsoft.EntityFrameworkCore; using Microsoft.Extensions.DependencyInjection; using Microsoft.AspNetCore.Http; using VOL.Data.IRepositories; +using VOL.Core.DBManager; +using SkiaSharp; namespace VOL.Data.Services { @@ -37,5 +39,35 @@ namespace VOL.Data.Services //多租户会用到这init代码，其他情况可以不用 //base.Init(dbRepository); } - } + + + public Data_Produce getLastProduceData(Func query) { + //_repository.DbContext.Set().FirstOrDefault(query); + Data_Produce? data_Produce = _repository.DbContext.Set().Where(query) + .OrderByDescending(x => x.CreateDate).FirstOrDefault(); + return data_Produce; + } + + + public List produceDataGroupByWeekDays() { + var db = _repository.DbContext.Set(); + List data_Produces = new(); + data_Produces = + db.FromSqlRaw( + "SELECT c.datelist as date, COALESCE(MAX(turnout_all), 0) AS currentTurnout, d.* FROM Data_Calendar c" + + "LEFT JOIN Data_Produce d ON c.datelist = DATE(d.CreateDate) and d.com_status = 5 " + + "WHERE c.datelist BETWEEN CURDATE() - INTERVAL 6 DAY AND CURDATE()" + + "GROUP BY c.datelist").ToList(); + //var result = (from c in db.Set() + // join d in db.Set() + // on c.datelist equals DATE(d.CreateDate) && d.com_status = 5 into joinResult + // from d in joinResult.DefaultIfEmpty()); + //select new + //{ + // Column1 = t1.Column1, + // Column2 = t2.Column2 + //}; + return data_Produces; + } + } } diff --git a/vol-net6/VOL.Entity/DomainModels/Core/PageGridData.cs b/vol-net6/VOL.Entity/DomainModels/Core/PageGridData.cs index 4765eb8..8b616b6 100644 --- a/vol-net6/VOL.Entity/DomainModels/Core/PageGridData.cs +++ b/vol-net6/VOL.Entity/DomainModels/Core/PageGridData.cs @@ -13,6 +13,9 @@ namespace VOL.Entity.DomainModels public string msg { get; set; } public int total { get; set; } public List rows { get; set; } + /// + /// 统计求和数据 + /// public object summary { get; set; } /// /// 可以在返回前，再返回一些额外的数据，比如返回其他表的信息，前台找到查询后的方法取出来 diff --git a/vol-net6/VOL.Entity/DomainModels/config/partial/Data_Config.cs b/vol-net6/VOL.Entity/DomainModels/config/partial/Data_Config.cs index 74182b5..49154bd 100644 --- a/vol-net6/VOL.Entity/DomainModels/config/partial/Data_Config.cs +++ b/vol-net6/VOL.Entity/DomainModels/config/partial/Data_Config.cs @@ -17,5 +17,21 @@ namespace VOL.Entity.DomainModels public partial class Data_Config { //此处配置字段(字段配置见此model的另一个partial),如果表中没有此字段请加上 [NotMapped]属性，否则会异常 + /// + ///通讯状态 + /// + [Display(Name = "通讯状态")] + [Column(TypeName = "short")] + [Editable(true), NotMapped] + public short? com_status { get; set; } + + /// + ///运行状态 + /// + [Display(Name = "运行状态")] + [Column(TypeName = "short")] + [Editable(true), NotMapped] + public short? state { get; set; } + } } \ No newline at end of file diff --git a/vol-net6/VOL.Entity/DomainModels/machine/partial/Data_Machine.cs b/vol-net6/VOL.Entity/DomainModels/machine/partial/Data_Machine.cs index 6f1267c..05c11b9 100644 --- a/vol-net6/VOL.Entity/DomainModels/machine/partial/Data_Machine.cs +++ b/vol-net6/VOL.Entity/DomainModels/machine/partial/Data_Machine.cs @@ -17,5 +17,56 @@ namespace VOL.Entity.DomainModels public partial class Data_Machine { //此处配置字段(字段配置见此model的另一个partial),如果表中没有此字段请加上 [NotMapped]属性，否则会异常 + [Display(Name = "设备名称")] + [MaxLength(255)] + [Column(TypeName = "nvarchar(255)")] + [Editable(true), NotMapped] + public string name { get; set; } + + /// + ///通讯IP + /// + [Display(Name = "通讯IP")] + [MaxLength(60)] + [Column(TypeName = "nvarchar(60)")] + [Editable(true), NotMapped] + public string com_ip { get; set; } + + + /// + ///累计运行时长 + /// + [Display(Name = "当班产量")] + [Column(TypeName = "int")] + [Editable(true), NotMapped] + public int? currentTurnout { get; set; } + + + /// + ///累计加工数 + /// + [Display(Name = "累计加工数")] + [Column(TypeName = "bigint")] + [Editable(true), NotMapped] + public long? totalQuantity { get; set; } + + + /// + ///累计运行时长 + /// + [Display(Name = "累计运行时长")] + [Column(TypeName = "bigint")] + [Editable(true), NotMapped] + public long? totalRuntime { get; set; } + + + /// + ///设备综合效率 + /// + [Display(Name = "设备综合效率")] + [DisplayFormat(DataFormatString = "10,2")] + [Column(TypeName = "decimal")] + [Editable(true), NotMapped] + public decimal? OEE { get; set; } } } \ No newline at end of file diff --git a/vol-net6/VOL.Entity/DomainModels/produce/partial/Data_Produce.cs b/vol-net6/VOL.Entity/DomainModels/produce/partial/Data_Produce.cs index f02ed98..0e05f34 100644 --- a/vol-net6/VOL.Entity/DomainModels/produce/partial/Data_Produce.cs +++ b/vol-net6/VOL.Entity/DomainModels/produce/partial/Data_Produce.cs @@ -17,5 +17,12 @@ namespace VOL.Entity.DomainModels public partial class Data_Produce { //此处配置字段(字段配置见此model的另一个partial),如果表中没有此字段请加上 [NotMapped]属性，否则会异常 + /// + /// 日期 + /// + [Display(Name = "日期")] + [Column(TypeName = "date")] + [Editable(true), NotMapped] + public DateOnly? datelist { get; set; } } } \ No newline at end of file diff --git a/vol-net6/VOL.WebApi/Controllers/Data/DataApiController.cs b/vol-net6/VOL.WebApi/Controllers/Data/DataApiController.cs new file mode 100644 index 0000000..7c18023 --- /dev/null +++ b/vol-net6/VOL.WebApi/Controllers/Data/DataApiController.cs @@ -0,0 +1,68 @@ +using Microsoft.AspNetCore.Http; +using Microsoft.AspNetCore.Mvc; +using Microsoft.AspNetCore.Authorization; +using System; +using VOL.Core.Filters; +using VOL.Data.IServices.modbus; +using VOL.Data.Services.modbus; +using Microsoft.Extensions.DependencyInjection; +using VOL.WebApi.Utils; +using VOL.Entity.DomainModels; +using System.Collections.Generic; +using Confluent.Kafka; +using VOL.Data.IServices; + +namespace VOL.WebApi.Controllers.Data +{ + /// + /// 数据采集API类 + /// + [Route("api/Data_Screen")] + [JWTAuthorize, ApiController, AllowAnonymous] + public class DataApiController : Controller + { + private IData_ConfigService _configService; + private IData_MachineService _machineService; + private IData_ProduceService _produceService; + + private readonly IHttpContextAccessor _httpContextAccessor; + + [ActivatorUtilitiesConstructor] + public DataApiController( + IData_ConfigService configService, + IData_MachineService machineService, + IData_ProduceService produceService, + IHttpContextAccessor httpContextAccessor + ) + { + _configService = configService; + _machineService = machineService; + _produceService = produceService; + _httpContextAccessor = httpContextAccessor; + } + + + // 获取设备配置数据 + [HttpPost, Route("GetDeviceConfig")] + public IActionResult getDeviceConfig([FromBody] PageDataOptions loadData) + { + return Json(_configService.GetPageData(loadData)); + } + + // 获取机床数据 + [HttpPost, Route("GetMachineData")] + public IActionResult getMachineData() + { + return Json(_machineService.GetMachineData()); + } + + + // 获取生产数据 + [HttpPost, Route("GetProduceData")] + public IActionResult getProduceData() + { + return Json(_produceService.produceDataGroupByWeekDays()); + } + + } +} diff --git a/vol-net6/VOL.WebApi/Controllers/Data/DataCaptureController.cs b/vol-net6/VOL.WebApi/Controllers/Data/DataCaptureController.cs index 140f109..33b1779 100644 --- a/vol-net6/VOL.WebApi/Controllers/Data/DataCaptureController.cs +++ b/vol-net6/VOL.WebApi/Controllers/Data/DataCaptureController.cs @@ -8,6 +8,8 @@ using VOL.Data.Services.modbus; using Microsoft.Extensions.DependencyInjection; using VOL.WebApi.Utils; using VOL.Entity.DomainModels; +using System.Collections.Generic; +using Confluent.Kafka; namespace VOL.WebApi.Controllers.Data { @@ -42,34 +44,94 @@ namespace VOL.WebApi.Controllers.Data /// IActionResult [ApiTask] [HttpGet, HttpPost, Route("gatherSiemens")] - public IActionResult Collection() + public IActionResult gatherSiemens() { try { - _service = new ModbusTcpService("127.0.0.1", 502); - Console.WriteLine("master modbus tcp connected..."); + _service = new ModbusTcpService("192.168.1.99", 502); + Console.WriteLine("siemens modbus tcp connected..."); } catch (Exception) { - Console.WriteLine("master modbus tcp connect failed！"); - return Content("master modbus connect failed!"); + Console.WriteLine("siemens modbus tcp connect failed！"); + return Content("siemens modbus tcp connect failed!"); } if (!_service.isConnected) { - Console.WriteLine("master modbus disconnect!"); - return Content("master modbus disconnect!"); + Console.WriteLine("siemens modbus tcp disconnect!"); + return Content("siemens modbus tcp disconnect!"); } + string message = ""; try { - + Dictionary> dataMap = _dataService.readSiemensData(_service); + message = saveSourceData(dataMap); } catch (Exception ex) { Console.WriteLine(ex.Message); - return Content("read data error!"); + message = "read data error: " + ex.Message; } finally { _service.disConnent(); } - return Content("ok!"); + return Content(message); } + /// + /// 采集广数设备 + /// + /// IActionResult + [ApiTask] + [HttpGet, HttpPost, Route("gatherGSK")] + public IActionResult gatherGSK() + { + try + { + _service = new ModbusTcpService("192.168.1.100", 502); + Console.WriteLine("siemens modbus tcp connected..."); + } + catch (Exception) + { + Console.WriteLine("siemens modbus tcp connect failed！"); + return Content("siemens modbus tcp connect failed!"); + } + if (!_service.isConnected) + { + Console.WriteLine("siemens modbus tcp disconnect!"); + return Content("siemens modbus tcp disconnect!"); + } + string message = ""; + try + { + Dictionary> dataMap = _dataService.readGSKData(_service); + message = saveSourceData(dataMap); + } + catch (Exception ex) + { + Console.WriteLine(ex.Message); + message = "read data error: " + ex.Message; + } + finally + { + _service.disConnent(); + } + return Content(message); + } + + + private string saveSourceData(Dictionary> dataMap) { + // 获取当前系统时间, 保证插入时间一致 + DateTime now = DateTime.Now; + + Dictionary machineData = dataMap["machine"]; + Data_Machine data_Machine = CommonUtil.ConvertToObject(machineData); + data_Machine.CreateDate = now; + bool result1 = _dataService.saveMachineData(data_Machine, out string message1); + + Dictionary produceData = dataMap["produce"]; + Data_Produce data_Produce = CommonUtil.ConvertToObject(produceData); + data_Produce.CreateDate = now; + bool result2 = _dataService.saveProduceData(data_Produce, out string message2); + + return (result1 && result2) ? "OK" : "save machine: " + message1 + "; save produce" + message2 + ";"; + } } } diff --git a/vol-vue3/package.json b/vol-vue3/package.json index 1c11d08..94f5380 100644 --- a/vol-vue3/package.json +++ b/vol-vue3/package.json @@ -15,7 +15,7 @@ "ali-oss": "^6.17.1", "axios": "^0.21.1", "core-js": "^3.6.5", - "echarts": "^5.0.2", + "echarts": "^5.3.0", "element-plus": "^2.2.14", "less": "^4.1.1", "vue": "^3.2.37", diff --git a/vol-vue3/src/api/http.js b/vol-vue3/src/api/http.js index aacf4e1..3ec6bbd 100644 --- a/vol-vue3/src/api/http.js +++ b/vol-vue3/src/api/http.js @@ -12,7 +12,7 @@ import { ElLoading as Loading, ElMessage as Message } from 'element-plus'; let loadingInstance; let loadingStatus = false; if (process.env.NODE_ENV == 'development') { - axios.defaults.baseURL = 'http://127.0.0.1:9991/'; + axios.defaults.baseURL = 'http://192.168.0.187:9991/'; } else if (process.env.NODE_ENV == 'debug') { axios.defaults.baseURL = 'http://127.0.0.1:9991/'; @@ -205,6 +205,7 @@ function createXHR () { } function redirect (responseText, message) { + console.log(typeof responseText); try { let responseData = typeof responseText == 'string' ? JSON.parse(responseText) : responseText; if ((responseData.hasOwnProperty('code') && responseData.code == 401) diff --git a/vol-vue3/src/components/echarts/Bar.vue b/vol-vue3/src/components/echarts/Bar.vue new file mode 100644 index 0000000..22dd24a --- /dev/null +++ b/vol-vue3/src/components/echarts/Bar.vue @@ -0,0 +1,175 @@ + + + + + + + + + \ No newline at end of file diff --git a/vol-vue3/src/components/echarts/Gauge.vue b/vol-vue3/src/components/echarts/Gauge.vue new file mode 100644 index 0000000..8710a27 --- /dev/null +++ b/vol-vue3/src/components/echarts/Gauge.vue @@ -0,0 +1,140 @@ + + + + + + + + + \ No newline at end of file diff --git a/vol-vue3/src/components/echarts/Line.vue b/vol-vue3/src/components/echarts/Line.vue new file mode 100644 index 0000000..2c64cc3 --- /dev/null +++ b/vol-vue3/src/components/echarts/Line.vue @@ -0,0 +1,172 @@ + + + + + + + + + \ No newline at end of file diff --git a/vol-vue3/src/components/echarts/Number.vue b/vol-vue3/src/components/echarts/Number.vue new file mode 100644 index 0000000..d26dd9e --- /dev/null +++ b/vol-vue3/src/components/echarts/Number.vue @@ -0,0 +1,71 @@ + + + + + + + + + \ No newline at end of file diff --git a/vol-vue3/src/extension/order/SellOrder.js b/vol-vue3/src/extension/order/SellOrder.js index 015c19c..2524966 100644 --- a/vol-vue3/src/extension/order/SellOrder.js +++ b/vol-vue3/src/extension/order/SellOrder.js @@ -188,6 +188,7 @@ let extension = { //你可以指定param查询的参数，处如果返回false，则不会执行查询 // this.$message.success(this.table.cnName + ',查询前' }); // console.log("扩展的"this.detailOptions.cnName + '触发loadDetailTableBefore'); + console.log(param); return true; }, searchAfter(result) { //查询ViewGird表数据后param查询参数,result回返查询的结果 diff --git a/vol-vue3/src/mixin/index.js b/vol-vue3/src/mixin/index.js index 3e34b94..f7f1bd7 100644 --- a/vol-vue3/src/mixin/index.js +++ b/vol-vue3/src/mixin/index.js @@ -29,7 +29,7 @@ const scale = { methods: { calcRate () { const appRef = this.$refs["appRef"] // 需要在指定节点上添加 ref="appRef" - console.log(this); + console.log(this); console.log(appRef); if (!appRef) return // 当前宽高比 diff --git a/vol-vue3/src/uitils/common.js b/vol-vue3/src/uitils/common.js index a745d8d..ef13946 100644 --- a/vol-vue3/src/uitils/common.js +++ b/vol-vue3/src/uitils/common.js @@ -146,7 +146,7 @@ let base = { // $img.src = src; $img.setAttribute('src', src); $div.appendChild($img); - $div.addEventListener('click', function() { + $div.addEventListener('click', function () { this.style.display = 'none'; }); document.body.appendChild($div); @@ -195,7 +195,7 @@ let base = { xmlResquest.setRequestHeader(key, data.header[key]); } } - xmlResquest.onload = function() { + xmlResquest.onload = function () { if (this.status == 200) { var blob = this.response; callback(window.URL.createObjectURL(blob)); @@ -215,7 +215,7 @@ let base = { convertTree(data, callback) { var treeIds = []; var root_data = []; - if (data.length>100) { + if (data.length > 100) { data = JSON.parse(JSON.stringify(data)); } data.forEach((x) => { @@ -251,7 +251,7 @@ let base = { if (!(data instanceof Array)) { return nodes; } - if (data.length>100) { + if (data.length > 100) { data = JSON.parse(JSON.stringify(data)); } data.forEach((x) => { @@ -292,7 +292,7 @@ let base = { if (!(data instanceof Array)) { return nodes; } - if (data.length>100) { + if (data.length > 100) { data = JSON.parse(JSON.stringify(data)); } var _child = data.find((x) => { @@ -324,6 +324,24 @@ let base = { return this.getTreeAllChildren(id, data).map((c) => { return c.id; }); + }, + //使用递归的方式实现数组、对象的深拷贝 + deepClone(obj) { + //判断拷贝的要进行深拷贝的是数组还是对象，是数组的话进行数组拷贝，对象的话进行对象拷贝 + var objClone = Array.isArray(obj) ? [] : {}; + //进行深拷贝的不能为空，并且是对象或者是 + if (obj && typeof obj === "object") { + for (let key in obj) { + if (obj.hasOwnProperty(key)) { + if (obj[key] && typeof obj[key] === "object") { + objClone[key] = this.deepClone(obj[key]); + } else { + objClone[key] = obj[key]; + } + } + } + } + return objClone; } }; export default base; diff --git a/vol-vue3/src/views/data/bigscreen/chart-options.js b/vol-vue3/src/views/data/bigscreen/chart-options.js index e04698e..4441d5f 100644 --- a/vol-vue3/src/views/data/bigscreen/chart-options.js +++ b/vol-vue3/src/views/data/bigscreen/chart-options.js @@ -1,128 +1,527 @@ -// 折线图 -let chartLeft1 = { - // color: ["#37a2da", "#32c5e9","#67e0e3"], // 图表折线默认配色 - title: { - text: '周销售额趋势', - offset: [-300, -30], // 标题[左右 上下]偏移 - style: { - fill: '#fff', - fontSize: 18, - fontWeight: 'bold', - textAlign: 'center', - textBaseline: 'bpttom' - } - }, - legend:{ // 图例标签 - data: ['图例一', '图例二'], - orient: 'horizontal', // 横向 - left:"50%", - top: '10%', - itemGap: 20, // 标签间距 - textStyle: { - fontFamily: 'Arial', - fontSize: 13, - fill: '#fff' - } - }, - xAxis: { // x轴 - name: '日期', - data: ['周一1', '周二2', '周三3', '周四4', '周五5', '周六6', '周日7'], - nameTextStyle: { // 名称样式 - fill: '#fff', - fontSize: 10 +let MachineInfo = { + series: [{ + radius: '130%', + type: 'gauge', + startAngle: 180, + endAngle: 0, + min: 0, + max: 1, + splitNumber: 10, + center: ["50%", "80%"], // 圆心坐标 + axisLine: { + lineStyle: { + width: 3, + color: [ + [0.2, '#FF6E76'], + [0.4, '#FF9F7F'], + [0.6, '#FDDD60'], + [0.8, '#58D9F9'], + [1.0, '#7CFFB2'] + ] + } }, - axisLine: { // 坐标轴 - style: { - stroke: '#fff', - lineWidth: 2 + pointer: { + icon: 'path://M12.8,0.7l12,40.1H0.7L12.8,0.7z', + length: '12%', + width: 20, + offsetCenter: [0, '-60%'], + itemStyle: { + color: 'auto' } }, - axisTick:{ // 坐标轴刻度线 - style: { - stroke: '#fff', - lineWidth: 2 + axisTick: { + length: 12, + lineStyle: { + color: 'auto', + width: 2 } }, - axisLabel: { // 坐标轴标签 - style: { - fill: '#fff', - fontSize: 12, - rotate: 10 // 倾斜度 + splitLine: { + length: 20, + lineStyle: { + color: 'auto', + width: 5 } - } - }, - yAxis: { - name: '销售额', - data: 'value', - axisLine: { // 坐标轴 - style: { - stroke: '#fff', - lineWidth: 2 + }, + axisLabel: { + color: '#fff', + fontSize: 20, + // distance: -60, + rotate: 'tangential', + formatter: function (value) { + switch (value) { + case 0.20: + return "差"; + case 0.50: + return "中"; + case 0.80: + return "良"; + default: + return ''; + } + } + }, + title: { + offsetCenter: [0, '-20%'], + fontSize: 20, + color: '#fff' + }, + detail: { + fontSize: 30, + offsetCenter: [0, '0%'], + valueAnimation: true, + formatter: function (value) { + return Math.round(value * 100) + '%'; + }, + color: 'auto' + }, + data: [ + { + value: 0.70, + name: '成绩评定' + } + ] + }] +}; + + +let WorkData = { + turnout: { + title: { + text: '产量折线图', + textStyle: { + fontSize: 20, + color: "#fff" + }, + left: 20 + }, + tooltip: { + trigger: 'axis', + axisPointer: { + type: 'cross', + label: { + backgroundColor: '#6a7985' + } } }, - axisTick:{ // 坐标轴刻度线 - style: { - stroke: '#fff', - lineWidth: 2 + legend: { + data: ['工单1', '工单2', '工单3'], + itemGap: 20, // 标签间距 + textStyle: { + fontSize: 14, + color: '#fff' } }, - axisLabel: { // 坐标轴标签 - show:true, // 显示 - style: { - fill: '#fff', - fontSize: 12, - rotate: 10 // 倾斜度 + toolbox: { + feature: { + // 自定义切换按钮,只能以 my 开头 + mySwitch: { + show: true, + title: '更多', + icon: 'path://M432.45,595.444c0,2.177-4.661,6.82-11.305,6.82c-6.475,0-11.306-4.567-11.306-6.82s4.852-6.812,11.306-6.812C427.841,588.632,432.452,593.191,432.45,595.444L432.45,595.444z M421.155,589.876c-3.009,0-5.448,2.495-5.448,5.572s2.439,5.572,5.448,5.572c3.01,0,5.449-2.495,5.449-5.572C426.604,592.371,424.165,589.876,421.155,589.876L421.155,589.876z M421.146,591.891c-1.916,0-3.47,1.589-3.47,3.549c0,1.959,1.554,3.548,3.47,3.548s3.469-1.589,3.469-3.548C424.614,593.479,423.062,591.891,421.146,591.891L421.146,591.891zM421.146,591.891', + onclick: function () { + alert('暂未实现！') + } + }, + dataView: { show: true, readOnly: false }, + magicType: { show: true, type: ['line', 'bar'] } } - } + }, + grid: { + left: '3%', + right: '4%', + bottom: '2%', + containLabel: true + }, + xAxis: [ + { + type: 'category', + boundaryGap: false, // 坐标轴两边不留白 + data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], + axisPointer: { + type: 'shadow' + }, + axisLine: { // 坐标轴 + lineStyle: { + color: '#fff', + } + }, + axisTick: { // 坐标轴刻度线 + lineStyle: { + color: '#fff', + } + } + } + ], + yAxis: [ + { + type: 'value', + name: '产量', + position: 'left', + alignTicks: true, + axisLine: { + show: true, + lineStyle: { + color: '#fff', + }, + }, + axisLabel: { + formatter: '{value} 次' + } + } + ], + series: [ + { + name: '工单1', + type: 'line', + // stack: 'Total', + areaStyle: {}, + emphasis: { + focus: 'series' + }, + data: [120, 132, 101, 134, 90, 230, 210] + }, + { + name: '工单2', + type: 'line', + // stack: 'Total', + areaStyle: {}, + emphasis: { + focus: 'series' + }, + data: [220, 182, 191, 234, 290, 330, 310] + }, + { + name: '工单3', + type: 'line', + // stack: 'Total', + areaStyle: {}, + emphasis: { + focus: 'series' + }, + data: [150, 232, 201, 154, 190, 330, 410] + }, + ] }, - series: [ - { - name: "图例一", - data: [1200, 2230, 1900, 2100, 3500, 4200, 3985], - type: 'line', - label: { - show: true, - formatter : '{value}件', - style: { - fontSize: 16 + schedule: { + title: { + text: '进度折线图', + textStyle: { + fontSize: 20, + color: "#fff" + }, + left: 20 + }, + tooltip: { + trigger: 'axis', + axisPointer: { + type: 'cross', + label: { + backgroundColor: '#6a7985' + } + } + }, + legend: { + data: ['工单1', '工单2', '工单3'], + itemGap: 20, // 标签间距 + textStyle: { + fontSize: 14, + color: '#fff' + } + }, + xAxis: [ + { + type: 'category', + boundaryGap: false, // 坐标轴两边不留白 + data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], + axisPointer: { + type: 'shadow' + }, + axisLine: { // 坐标轴 + lineStyle: { + color: '#fff', + } + }, + axisTick: { // 坐标轴刻度线 + lineStyle: { + color: '#fff', + } } + } + ], + yAxis: [ + { + type: 'value', + name: '进度', + // position: 'right', + // min: 0, + // max: 100, + // interval: 20, + alignTicks: true, + axisLine: { + show: true, + lineStyle: { + color: '#fff', + }, + }, + axisLabel: { + formatter: '{value} %' + } + } + ], + series: [ + { + name: '工单1', + type: 'line', + // stack: 'Total', + areaStyle: {}, + emphasis: { + focus: 'series' + }, + data: [91, 92, 88, 94, 87, 85, 95] + }, + { + name: '工单2', + type: 'line', + // stack: 'Total', + areaStyle: {}, + emphasis: { + focus: 'series' + }, + data: [81, 92, 98, 93, 97, 95, 85] + }, + { + name: '工单3', + type: 'line', + // stack: 'Total', + areaStyle: {}, + emphasis: { + focus: 'series' + }, + data: [81, 97, 83, 91, 89, 95, 92] }, + ] + }, + yield: { + title: { + text: '良品率折线图', + textStyle: { + fontSize: 20, + color: "#fff" + }, + left: 20 }, - { - name: "图例二", - data: [2200, 1230, 1900, 2200, 2500, 3200, 2985], - type: 'line', - smooth: true, - label: { - show: true + tooltip: { + trigger: 'axis', + axisPointer: { + type: 'cross', + label: { + backgroundColor: '#6a7985' + } } - } - ], - // tooltip:{ // dataV暂不支持此功能 - // trigger:'item', - // show:true - // } -}; + }, + legend: { + data: ['工单1', '工单2', '工单3'], + itemGap: 20, // 标签间距 + textStyle: { + fontSize: 14, + color: '#fff' + } + }, + xAxis: [ + { + type: 'category', + boundaryGap: false, // 坐标轴两边不留白 + data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], + axisPointer: { + type: 'shadow' + }, + axisLine: { // 坐标轴 + lineStyle: { + color: '#fff', + } + }, + axisTick: { // 坐标轴刻度线 + lineStyle: { + color: '#fff', + } + } + } + ], + yAxis: [ + { + type: 'value', + name: '良品率', + // offset: 80, + // position: 'right', + alignTicks: true, + axisLine: { + show: true, + lineStyle: { + color: '#fff', + }, + }, + axisLabel: { + formatter: '{value} %' + } + } + ], + series: [ + { + name: '工单1', + type: 'line', + // stack: 'Total', + areaStyle: {}, + emphasis: { + focus: 'series' + }, + data: [81, 82, 88, 94, 89, 85, 85] + }, + { + name: '工单2', + type: 'line', + // stack: 'Total', + areaStyle: {}, + emphasis: { + focus: 'series' + }, + data: [81, 93, 83, 84, 87, 85, 95] + }, + { + name: '工单3', + type: 'line', + // stack: 'Total', + areaStyle: {}, + emphasis: { + focus: 'series' + }, + data: [91, 82, 88, 84, 87, 85, 94] + }, + ] + } +} -// 柱状图 -let chartLeft2 = { - title: { - text: '周销售额趋势' + +let WeekProcess = { + tooltip: { + trigger: 'axis', + axisPointer: { + type: 'cross', + crossStyle: { + color: '#999' + } + } }, - xAxis: { - name: '第一周', - data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'] + toolbox: { + feature: { + dataView: { show: true, readOnly: false }, + magicType: { show: true, type: ['line', 'bar'] }, + restore: { show: true }, + saveAsImage: { show: true, name: "近一周加工数" } + } + }, + legend: { + top: 0, + data: ['广数980DI-1', '西门子828D-1'], + itemGap: 20, // 标签间距 + textStyle: { + fontSize: 14, + color: '#fff' + } }, - yAxis: { - name: '销售额', - data: 'value' // x或y坐标轴应至少有一个配置为'value' + grid: { + left: '3%', + right: '4%', + bottom: '2%', + containLabel: true }, + xAxis: [ + { + type: 'category', + data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], + axisPointer: { + type: 'shadow' + }, + axisLine: { // 坐标轴 + lineStyle: { + color: '#fff', + } + }, + axisTick: { // 坐标轴刻度线 + lineStyle: { + color: '#fff', + } + } + } + ], + yAxis: [ + { + type: 'value', + name: '广数980DI-1', + alignTicks: true, + min: 0, + axisLabel: { + formatter: '{value} 件' + }, + axisLine: { // 坐标轴 + show: false, // 不显示坐标轴轴线。 + lineStyle: { + color: '#fff', + }, + onZero: true + }, + splitLine: { // 坐标轴分隔线 + show: true, + lineStyle: { + // 使用深浅的间隔色 + color: ['#fff','#ff9f7f'], + width: 1 + } + } + }, + { + type: 'value', + name: '西门子828D-1', + min: 0, + // interval: 50, + alignTicks: true, + axisLabel: { + formatter: '{value} 件' + }, + axisLine: { // 坐标轴 + lineStyle: { + color: '#fff', + } + }, + } + ], series: [ - { - data: [1200, 2230, 1900, 2100, 3500, 4200, 3985], - type: 'bar' - } + { + name: '广数980DI-1', + type: 'bar', + tooltip: { + valueFormatter: function (value) { + return value + ' 件'; + } + }, + data: [ + 100, 99, 91, 107, 121, 137, 101 + ] + }, + { + name: '西门子828D-1', + type: 'bar', + tooltip: { + valueFormatter: function (value) { + return value + ' 件'; + } + }, + data: [ + 120, 117, 99, 100, 111, 127, 101 + ] + } ] -}; +} + -export { chartLeft1, chartLeft2 } +export { MachineInfo, WorkData, WeekProcess } diff --git a/vol-vue3/src/views/data/bigscreen/index.less b/vol-vue3/src/views/data/bigscreen/index.less index cc7798b..f34246a 100644 --- a/vol-vue3/src/views/data/bigscreen/index.less +++ b/vol-vue3/src/views/data/bigscreen/index.less @@ -56,7 +56,7 @@ } .data-container { - height:1000px; + height: 1000px; margin: 0px 15px; position: absolute; left: 0; @@ -70,11 +70,11 @@ display: flex; } - + .data-left, .data-right { - flex:1; + flex: 1; margin-right: 10px; display: flex; flex-direction: column; @@ -90,6 +90,25 @@ margin-bottom: 10px; z-index: 10; + .title { + height: 50px; + text-align: center; + color: #fff; + line-height: 50px; + font-size: 24px; + } + + .content { + height: 400px; + width: 100%; + + .chart { + flex: 1; + height: 100%; + } + } + + &::before { border-left: 2px solid #02a6b5; left: 0; @@ -113,18 +132,15 @@ } } - // .title { - // color: #fff; - // font-size: 16px; - // text-align: center; - // } .data-foot-line { position: absolute; bottom: 0; width: 100%; left: 0; - &::before, &::after { + + &::before, + &::after { position: absolute; width: 10px; height: 10px; @@ -144,183 +160,129 @@ } } } + + .oee { + height: 250px; + display: flex; + flex-direction: row; + justify-content: center; + } + + .machine { + height: 150px; + display: flex; + flex-direction: row; + justify-content: space-around; + + .status-item { + flex: 1; + + .tagbox { + width: 100%; + padding: 0 10px; + display: flex; + justify-content: space-around; + align-items: center; + color: #fff; + + .taglist { + flex: 1; + display: flex; + flex-direction: row; + justify-content: center; + flex-wrap: wrap; + + .tag { + width: 50%; + display: flex; + align-items: center; + margin: 5px 0; + + .text { + font-size: 16px; + } + } + } + + .status { + flex: 1; + + .item { + margin: 5px; + font-size: 18px; + display: flex; + align-items: center; + + .name { + margin-left: 5px; + } + } + } + } + + + } + } + + + .switch { + position: absolute; + top: 20px; + right: 12px; + } + + .output { + margin-top: 10px; + padding: 10px 0; + height: 400px; + } + + + .statbox { + height: 400px; + display: flex; + flex-direction: column; + justify-content: space-between; + color: #fff; + padding: 10px; + + .stat-item { + flex: 1; + width: 100%; + display: flex; + align-items: center; + + .device { + font-size: 20px; + flex: 1; + display: flex; + align-items: center; + .name { + margin-left: 5px; + text-align: center; + } + } + + .stat-info { + flex: 3; + display: flex; + flex-direction: row; + + .digital { + flex: 1; + .head { + margin-top: 30px; + font-size: 20px; + text-align: center; + height: 20px; + line-height: 20px; + } + + } + } + } + + } } -} - -// .head h1 { -// margin: 0; -// color: #fff; -// text-align: center; -// /* font-size: .4rem; */ -// /* line-height: .8rem; */ -// line-height: 71px; -// } - -// .data-container { -// /* margin: 5px 15px; -// height:100%; */ - -// margin: 0px 15px; -// position: absolute; -// left: 0; -// right: 0; -// top: 76px; -// bottom: 0; -// } - -// .data-container > div { -// float: left; -// /* border: 1px solid white; */ -// height: 100%; -// } - -// .data-center { -// padding: 0 0.9rem; -// width: 40%; -// display: flex; -// flex-direction: column; -// // .center-top{ -// // height: 210px; -// // background: red; -// // } -// .chart-center{ -// flex: 1; -// } -// } -// .chart-center{ -// width: 100%; -// display: flex; -// // background: white; -// } -// .data-left, -// .data-right { -// width: 30%; -// display: flex; -// flex-direction: column; -// } - -// .data-left-item, -// .data-right-item,.center-top,.center-top-num,.chart-center { -// border: 1px solid rgba(25, 186, 139, 0.17); -// padding: 0 0.2rem 0.4rem 0.15rem; -// background: rgba(255, 255, 255, 0.04); -// background-size: 100% auto; -// position: relative; -// margin-bottom: 0.15rem; -// z-index: 10; -// } - -// .data-foot-line { -// position: absolute; -// bottom: 0; -// width: 100%; -// left: 0; -// } - -// .data-foot-line:before, -// .data-foot-line:after { -// position: absolute; -// width: 10px; -// height:10px; -// content: ""; -// border-bottom: 2px solid #02a6b5; -// bottom: 0; -// } - -// .boxall:before, -// .data-foot-line:before { -// border-left: 2px solid #02a6b5; -// left: 0; -// } - -// .boxall:after, -// .data-foot-line:after { -// border-right: 2px solid #02a6b5; -// right: 0; -// } - -// .boxall:before, -// .boxall:after { -// position: absolute; -// width: 10px; -// height: 10px; -// content: ""; -// border-top: 2px solid #02a6b5; -// top: 0; -// } - -// .data-left-item:before, -// .data-right-item:before, -// .center-top-num:before, -// .center-top:before{ -// border-left: 2px solid #02a6b5; -// left: 0; -// position: absolute; -// width: 10px; -// height:10px; -// content: ""; -// border-top: 2px solid #02a6b5; -// top: 0; -// } - -// .data-left-item:after, -// .data-right-item:after, -// .center-top-num:after, -// .center-top:after { -// border-right: 2px solid #02a6b5; -// right: 0; -// position: absolute; -// width: 10px; -// height: 10px; -// content: ""; -// border-top: 2px solid #02a6b5; -// top: 0; -// } - -// .data-left, -// .data-right { -// /* display: flex; */ -// } - -// .data-left > .data-left-item, -// .data-right > .data-right-item { -// flex: 1; -// margin-bottom: 0.9rem; -// } - -// .data-center .title, -// .data-left > .data-left-item .title, -// .data-right > .data-right-item .title { -// /* font-size: .2rem; */ -// font-size: 1rem; -// padding: 7px 0; -// color: #fff; -// text-align: center; -// /* line-height: .5rem; */ -// } - -// .data-center .chart-center{ -// width: 100%; -// } - -// .center-top-num{ -// height: 80px; -// padding-top: 7px; -// margin-bottom: 0.8rem; -// display: flex; -// .item{ -// flex: 1; -// text-align: center; -// } -// .text{ -// color: #fcf0d8; -// font-size: 14px; -// } -// .num{ -// font-size: 34px; -// font-family: -apple-system, BlinkMacSystemFont, Segoe UI, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Helvetica Neue, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol; -// font-weight: bold; -// color: #67caca; -// } -// } \ No newline at end of file +} \ No newline at end of file diff --git a/vol-vue3/src/views/data/bigscreen/index.vue b/vol-vue3/src/views/data/bigscreen/index.vue index 952c968..9e6ad29 100644 --- a/vol-vue3/src/views/data/bigscreen/index.vue +++ b/vol-vue3/src/views/data/bigscreen/index.vue @@ -16,29 +16,134 @@

{{ datetime }}

-
- - +
设备综合利用率
+
+
+
+ +
+
+
+
+
运行状态
+
+
+
+ + + + {{ item.name }} +
+
+
+
+ + {{ machine.name }} +
+
+
+
+
+
通讯状态
+
+
+
+ + + + {{ item.name }} +
+
+
+ + +
+ + {{ machine.name }} +
+
+
+
+
+
- +
工单近一周走势图
+
+ + + + + +
+
+ +
- +
统计数据
+
+
+
+ + + +
+
{{ machine.name }}
+
{{ machine.com_ip }}
+
+
+
+
+
当班产量
+ +
+
+
累计加工数
+ +
+
+
累计运行时长
+ +
+
+
+
- +
最近一周加工数
+
+ +
@@ -49,23 +154,63 @@