NEW: Add Custom Filament Manager UI

Jira: xxxx

Change-Id: Ib2097ae7b471382c170efc5b73dcd13eb729819a
This commit is contained in:
zorro.zhang
2023-09-27 14:27:32 +08:00
committed by Lane.Wei
parent e697fee9ae
commit f593f64cbb
6 changed files with 1102 additions and 12 deletions

View File

@@ -47,7 +47,6 @@ input
#ItemBlockArea
{
flex: 1 0 236px;
display:flex;
overflow-x:auto;
flex-wrap:wrap;
@@ -56,6 +55,8 @@ input
align-items: flex-start;
align-content:flex-start;
line-height: 32px;
height: 100%;
flex:1 0 236px;
}
.MItem
@@ -112,3 +113,96 @@ input
display: flex;
justify-content:space-around;
}
#SystemFilamentsArea
{
display: none;
flex-direction: column;
}
#CFilament_Btn_Area
{
display: flex;
align-items: center;
height: 30px;
}
#Title
{
margin: 0px 40px;
border-bottom: 1px solid #000;
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
}
#Title div
{
cursor: pointer;
font-size: 24px;
}
#Title div.TitleSelected
{
height: calc(100% - 6px);
display: flex;
align-items: center;
border-bottom: 6px solid #00AE42;
}
#Title div.TitleUnselected
{
height: 100%;
display: flex;
align-items: center;
color: #000;
}
#CustomFilamentsArea
{
display: flex;
flex-direction: column;
height: 100%;
}
#CFilament_List
{
display:flex;
overflow-x:auto;
flex-wrap:wrap;
flex-direction: column;
justify-content:flex-start;
align-items: flex-start;
align-content:flex-start;
line-height: 32px;
height: 100%;
}
.CFilament_Item
{
display: flex;
align-items: center;
margin-right: 30px;
}
.CFilament_Name
{
width: 220px;
overflow: hidden;
white-space: nowrap; /* 防止文字换行 */
text-overflow: ellipsis; /* 超出部分显示省略号 */
}
.CFilament_EditBtn
{
cursor: pointer;
width: 20px;
height: 20px;
}
.CFilament_EditBtn:hover
{
}

View File

@@ -7,8 +7,13 @@ var VendorPriority=new Array("bambu lab","bambulab","bbl","kexcelled","polymaker
function OnInit()
{
TranslatePage();
OnSelectMenu(1);
RequestProfile();
RequestCustomFilaments();
//TestCustomFilaments();
//OnSelectMenu(2);
}
function RequestProfile()
@@ -39,6 +44,10 @@ function HandleStudio(pVal)
m_ProfileItem=pVal['response'];
SortUI();
}
else if(strCmd=='update_custom_filaments')
{
UpdateCustomFilaments( pVal['data'] );
}
}
function GetFilamentShortname( sName )
@@ -554,5 +563,95 @@ function ConfirmSelect()
}
function OnSelectMenu( nIndex )
{
switch(nIndex)
{
case 1:
$('#SystemFilamentBtn').addClass('TitleSelected');
$('#SystemFilamentBtn').removeClass('TitleUnselected');
$('#CustomFilamentBtn').addClass('TitleUnselected');
$('#CustomFilamentBtn').removeClass('TitleSelected');
$('#SystemFilamentsArea').css('display','flex');
$('#CustomFilamentsArea').css('display','none');
break;
case 2:
$('#CustomFilamentBtn').addClass('TitleSelected');
$('#CustomFilamentBtn').removeClass('TitleUnselected');
$('#SystemFilamentBtn').addClass('TitleUnselected');
$('#SystemFilamentBtn').removeClass('TitleSelected');
$('#CustomFilamentsArea').css('display','flex');
$('#SystemFilamentsArea').css('display','none');
break;
}
}
function RequestCustomFilaments()
{
var tSend={};
tSend['sequence_id']=Math.round(new Date() / 1000);
tSend['command']="request_custom_filaments";
SendWXMessage( JSON.stringify(tSend) );
}
function TestCustomFilaments()
{
let strTest='{"command":"update_custom_filaments","data":[{"id":"P0c71f94","name":"AMOLEN ABS 222"},{"id":"P19cc6c5","name":"PrimaSelect PLA 231654"},{"id":"P93a5c3b","name":"3DJAKE PLA 111"}],"sequence_id":"2000"}';
let tItem=JSON.parse(strTest);
HandleStudio(tItem);
}
function UpdateCustomFilaments( CFList )
{
let strHtml='';
let nTotal=CFList.length;
for(let n=0;n<nTotal;n++)
{
let pItem=CFList[n];
let F_id=pItem['id'];
let F_name=pItem['name'];
let strAdd='<div class="CFilament_Item">'+
'<a class="CFilament_Name" title="'+F_name+'">'+F_name+'</a><img onClick="CFEdit(\''+F_id+'\')" class="CFilament_EditBtn" src="../../image/edit.svg" />'+
'</div>';
strHtml+=strAdd;
}
$('#CFilament_List').html(strHtml);
}
function OnClickCustomFilamentAdd()
{
//alert('Create New Custom Filament');
var tSend={};
tSend['sequence_id']=Math.round(new Date() / 1000);
tSend['command']="create_custom_filament";
SendWXMessage( JSON.stringify(tSend) );
}
//编辑某一个自定义材料
function CFEdit( fid )
{
//alert(fid);
var tSend={};
tSend['sequence_id']=Math.round(new Date() / 1000);
tSend['command']="modify_custom_filament";
tSend['id']=fid;
SendWXMessage( JSON.stringify(tSend) );
}

View File

@@ -7,7 +7,6 @@
<link rel="stylesheet" type="text/css" href="../css/common.css" />
<link rel="stylesheet" type="text/css" href="23.css" />
<link rel="stylesheet" type="text/css" href="../css/dark.css" />
<script type="text/javascript" src="test.js"></script>
<script type="text/javascript" src="../js/jquery-3.6.0.min.js"></script>
<script type="text/javascript" src="../js/json2.js"></script>
<script type="text/javascript" src="../../data/text.js"></script>
@@ -17,10 +16,12 @@
</head>
<body onLoad="OnInit()">
<div id="Title">
<div class="trans" tid="t14">Filament Selection</div>
<div id="SystemFilamentBtn" class="TitleSelected trans" tid="t109" onClick="OnSelectMenu(1)">System Filaments</div>
<div id="CustomFilamentBtn" class="TitleUnselected trans" tid="t110" onClick="OnSelectMenu(2)">Custom Filaments</div>
</div>
<div id="Content" class="ZScrol">
<div id="SystemFilamentsArea">
<div id="MachineList" class="ChooseBlock">
<div class="CName"><span class="trans" tid="t15">printer</span></div>
<div class="CValues">
@@ -32,8 +33,7 @@
<div><input type="checkbox" />Bambulab BBL-3DP-001-V5-normal</div>
<div><input type="checkbox" />Bambulab BBL-3DP-001-V4-normal</div>
<div><input type="checkbox" />Bambulab BBL-3DP-001-V4-normal</div>
<div><input type="checkbox" />Bambulab BBL-3DP-001-V5-normal</div>
<div><input type="checkbox" />Bambulab BBL-3DP-001-V4-normal</div>-->
<div><input type="checkbox" />Bambulab BBL-3DP-001-V5-normal</div> -->
</div>
</div>
@@ -46,7 +46,7 @@
<div><input type="checkbox" />ABS</div>
<div><input type="checkbox" />TPU</div>
<div><input type="checkbox" />PA6+CF</div>
<div><input type="checkbox" />N/A</div>-->
<div><input type="checkbox" />N/A</div> -->
</div>
</div>
@@ -58,7 +58,8 @@
<div><input type="checkbox" />BBL</div>
<div><input type="checkbox" />eSUN</div>
<div><input type="checkbox" />Kexcelled</div>
<div><input type="checkbox" />Polymaker</div>-->
<div><input type="checkbox" />Polymaker</div>
<div><input type="checkbox" vendor="Unknow" />Unknown</div> -->
</div>
</div>
@@ -126,6 +127,148 @@
<div class="MItem"><input type="checkbox" />Geneic TPU83</div>
<div class="MItem"><input type="checkbox" />Geneic TPU87</div> -->
</div>
</div>
<div id="CustomFilamentsArea">
<div id="CFilament_Btn_Area">
<div class="SmallBtn_Green trans" tid="t111" onClick="OnClickCustomFilamentAdd()">Create New</div>
</div>
<div id="CFilament_List" class="ZScrol">
<!-- <div class="CFilament_Item">
<a class="CFilament_Name" title="New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img onClick="CFEdit()" class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div>
<div class="CFilament_Item">
<a class="CFilament_Name">New Custom XXXXXXXXXXXXXXXXXXXXXXXXXX</a><img class="CFilament_EditBtn" src="../../image/edit.svg" />
</div> -->
</div>
</div>
</div>
<div id="AcceptArea">