zhangyuheng/MCSManager
1
0
Fork 0
forked from mirror/MCSManager
Code Pull Requests Activity

优化 界面元素与颜色

Browse Source
This commit is contained in:
Suwings 2019-09-16 15:39:49 +08:00
parent 288470e5c1
commit 39a9449f64
11 changed files with 53 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
public/common/css/block.css
View File

@ -63,6 +63,10 @@
border-top: 3px solid #f39c12;
}
.PanelBlack{
border-top: 3px solid #141A1D;
}
.PanelTitle {
font-family: 'Source Sans Pro', "微软雅黑", sans-serif;
padding: 10px 12px;
@ -79,6 +83,8 @@
font-size: 12px;
}
.NextCol {
/*padding-left: 5px;*/
}

2
public/index.html
View File

@ -86,7 +86,7 @@
<br>
<div id='websocket2'>
<div v-if="is">
<span class="color-green">Online: </span>{{ MCSERVER.username }}</div>
<span class="color-green">在线: </span>{{ MCSERVER.username }}</div>
<div v-else>offline (离线)</div>
</div>
</div>

2
public/template/center.html
View File

@ -3,7 +3,7 @@
<div class="row">
<div class="col-md-12">
<div class="Panel">
<div class="PanelTitle PanelBlue">
<div class="PanelTitle PanelBlack">
<!--请不要怀疑这是在欺骗您数据统计日期来自前端，事实上，后端是在每月1日统计至今，所以是一致的-->
控制面板 {{ new Date().getMonth()+1 }}月1日 ~ {{ new Date().getMonth()+1 }}月{{ new Date().getDate() }}日
基础监控

12
public/template/component/console.html
View File

@ -1,7 +1,7 @@
<div id='ConsolePanel' class="OneContainer">
<div class="row">
<div class="col-md-3">
<div class="Panel PanelGreen">
<div class="Panel PanelBlack">
<div class="PanelTitle">服务器信息</div>
<div class="PanelBody">
@ -25,7 +25,7 @@
</div>
</div>
<div class="Panel ">
<div class="Panel" :class="run==true?'PanelGreen':'PanelYellow'">
<div class="PanelTitle">服务器操作</div>
<div class="PanelBody">
@ -47,7 +47,7 @@
</div>
</div>
</div>
<div class="Panel ">
<div class="Panel PanelGray">
<div class="PanelTitle">FTP 链接信息</div>
<div class="PanelBody">
<div class="PanelItem">
@ -68,7 +68,7 @@
</div>
</div>
</div>
<div class="Panel ">
<div class="Panel " :class="serverData.autoRestart?'PanelGreen':'PanelGray'">
<div class="PanelTitle">任务与机制</div>
<div class="PanelBody">
<transition name="slide-fade">
@ -85,7 +85,7 @@
</transition>
</div>
</div>
<div class="Panel ">
<div class="Panel PanelGray">
<div class="PanelTitle">外置接口</div>
<div class="PanelBody">
<div class="PanelItem">
@ -100,7 +100,7 @@
</div>
</div>
<div class="col-md-9">
<div class="Panel PanelBlue">
<div class="Panel PanelBlack">
<div class="PanelTitle">服务端控制组</div>
<div class="PanelBody">
<div class="row">

22
public/template/component/new_docker_image.html
View File

@ -1,14 +1,16 @@
<div id='NewDockerImage' class="OneContainer">
<div class="col-md-12 ">
<div class="Panel">
<div class="PanelTitle">基于 DockerFile 创建镜像 Beta (Only Linux) </div>
<div class="PanelTitle">基于 DockerFile 创建镜像 (仅支持 Linux 系统) </div>
<div class="PanelBody">
<div class="row">
<div class="col-md-12">
<p>创建新的 Docker 镜像 |
<a href="https://github.com/Suwings/MCSManager/blob/gh-pages/Question_1.md" style="color: #2f3ad6;">如何让
<a href="https://github.com/Suwings/MCSManager/blob/gh-pages/Question_1.md"
style="color: #2f3ad6;">如何让
Minecraft 服务端运行在 Docker 镜像中？</a>
<a href="https://github.com/Suwings/MCSManager/blob/gh-pages/Question_2.md" style="color: #2f3ad6;">如何在我的电脑上安装
<a href="https://github.com/Suwings/MCSManager/blob/gh-pages/Question_2.md"
style="color: #2f3ad6;">如何在我的电脑上安装
Docker？</a>
</p>
<small>您不需要具备 Docker 专业知识，最简单的方法是，您只需要填写一个名字即可。
@ -24,8 +26,9 @@
</textarea>
<div class="input-group input-group-sm">
<span class="input-group-addon" id="sizing-addon3">Docker 镜像名</span>
<input type="text" autocomplete="off" class="form-control" placeholder="可填，默认 mcsd 镜像名，不建议更改，除非您要创建其他的镜像，请一定要记住名字"
aria-describedby="sizing-addon3" v-model="dockerImageName">
<input type="text" autocomplete="off" class="form-control"
placeholder="可填，默认 mcsd 镜像名，不建议更改，除非您要创建其他的镜像，请一定要记住名字" aria-describedby="sizing-addon3"
v-model="dockerImageName">
</div>
<p>
确认无误之后，单击新建镜像按钮，但是这需要一定时间的等待，创建完成后 MCSM 会通知您。
@ -36,7 +39,8 @@
MB，可能需要一段时间，可以关闭网页控制台，任务完成后，可以在结果列表按钮处查看结果。</span>
<br>
<br>
<span>如果出现构建失败失败，请尝试检查 Docker 服务是否成功启动 (service docker start)，以及 docker 命令是否能执行，网络是否畅通。</span>
<span>如果出现构建失败失败，请尝试检查 Docker 服务是否成功启动 (service docker start)，以及 docker
命令是否能执行，网络是否畅通。</span>
</b>
</p>
<button v-bind:disabled="createDockerDis" class="btn btn-danger" v-on:click="createDocker()">
@ -73,8 +77,8 @@
dockerfile: TOOLS.decode($('#dockerfile').text())
}
if (!confirm("DockerFile 文件：\n" + obj.dockerfile + "\n镜像名:" + obj
.dockerImageName +
"\n确认无误单击【确定】得以继续"))
.dockerImageName +
"\n确认无误单击【确定】得以继续"))
return;
if (!TOOLS.isStdText(obj.dockerImageName)) {
TOOLS.pushMsgWindow("镜像名字不合法！仅限字母数字下划线！");
@ -92,7 +96,7 @@
},
title: "Docker 构建结果",
template: "template/dialog/docker_res.html",
callback: function () {}
callback: function () { }
});
}
}

8
public/template/component/new_schedule.html
View File

@ -1,6 +1,6 @@
<div id='NewSchedule' class="OneContainer">
<div class="col-md-12 ">
<div class="Panel">
<div class="Panel PanelBlack">
<div class="PanelTitle">计划任务项目表达式</div>
<div class="PanelBody">
<div class="row">
@ -20,7 +20,8 @@
<input style="width: 90%;" type="text" v-model="count" placeholder="[必填]">
</th>
<th>
<input style="width: 100%;" type="text" v-model="commande" placeholder="如: stop,say Hello,__start__ 等等">
<input style="width: 100%;" type="text" v-model="commande"
placeholder="如: stop,say Hello,__start__ 等等">
</th>
</tr>
</table>
@ -55,7 +56,8 @@
<p>
<b>任务时间间隔</b>
</p>
<p>如果您使用过 Linux 的 crontab 命令，您会发现它的用法非常相似。总共有 6 个 * 号，其中按照顺序代表不同的时间，分别是 秒，分，时，每月第几天，第几个月，每周第几天</p>
<p>如果您使用过 Linux 的 crontab 命令，您会发现它的用法非常相似。总共有 6 个 * 号，其中按照顺序代表不同的时间，分别是 秒，分，时，每月第几天，第几个月，每周第几天
</p>
<p>如果您不会使用这个，请按照以下修改：</p>
<p>
<code> */20 */2 * * * * </code> &nbsp;代表每隔 2 分钟的一分钟内每隔 20 秒执行一次

4
public/template/component/newserverx.html
View File

@ -8,7 +8,7 @@
<div class="row">
<div class="col-md-12">
<div class="Panel PanelGreen">
<div class="Panel PanelBlack">
<div class="PanelTitle">引导创建服务器</div>
<div class="PanelBody PAGE_newserverx_PanelBody">
@ -143,5 +143,5 @@
});
MI.rListener('onend', function () {});
MI.rListener('onend', function () { });
</script>

5
public/template/component/properties.html
View File

@ -1,7 +1,7 @@
<div id='ServerProperties' class="OneContainer">
<div class="row">
<div class="col-md-12 ">
<div class="Panel PanelBlue">
<div class="Panel PanelBlack">
<div class="PanelTitle">服务器配置</div>
<div class="PanelBody">
<div class="row">
@ -37,7 +37,8 @@
<th>
<center>
<div class="input-group input-group-sm">
<input type="text" class="form-control" aria-describedby="basic-addon1" v-model="properties[key]" />
<input type="text" class="form-control" aria-describedby="basic-addon1"
v-model="properties[key]" />
</div>
</center>
</th>

4
public/template/component/schedule.html
View File

@ -1,7 +1,7 @@
<div id='ServerSchedule' class="OneContainer">
<div class="row">
<div class="col-md-12 ">
<div class="Panel PanelBlue">
<div class="Panel PanelBlack">
<div class="PanelTitle">服务器 {{servername}} 计划任务列表</div>
<div class="PanelBody">
<div class="row">
@ -41,7 +41,7 @@
</th>
</tr>
</table>
<br/>
<br />
</div>
</div>
</div>

10
public/template/server.html
View File

@ -1,7 +1,7 @@
<div id='ServerList' class="OneContainer">
<div class="row">
<div class="col-md-12 ">
<div class="Panel PanelBlue">
<div class="Panel PanelBlack">
<div class="PanelTitle">服务器列表</div>
<div class="PanelBody">
<div class="row">
@ -57,11 +57,13 @@
<button class="btn btn-success" v-on:click="toConsole(item.serverName);">
控制
</button>
<button class="btn btn-info" v-on:click="onRedirect('./template/component/server.html','server/get',item.serverName);">
<button class="btn btn-info"
v-on:click="onRedirect('./template/component/server.html','server/get',item.serverName);">
参数
</button>
<span style="margin-left: 8px;"> | </span>
<button class="btn btn-danger" v-on:click="toDeleteServer(item.serverName)">删除</button>
<button class="btn btn-danger"
v-on:click="toDeleteServer(item.serverName)">删除</button>
</div>
</div>
@ -117,5 +119,5 @@
});
});
MI.rListener('onend', function () {});
MI.rListener('onend', function () { });
</script>

13
public/template/userset.html
View File

@ -1,7 +1,7 @@
<div id='UsersetList' class="OneContainer">
<div class="row">
<div class="col-md-12 ">
<div class="Panel PanelBlue">
<div class="Panel PanelBlack">
<div class="PanelTitle">用户中心</div>
<div class="PanelBody">
<div class="row">
@ -75,21 +75,24 @@
<p>用户名 [字母 数字 下划线] (6~18位)</p>
<div class="input-group input-group-sm">
<span class="input-group-addon"> 用户名 </span>
<input type="text" class="form-control" v-model="username" placeholder="用户名 [字母 数字 下划线] (6~18位)">
<input type="text" class="form-control" v-model="username"
placeholder="用户名 [字母 数字 下划线] (6~18位)">
</div>
</div>
<div class="col-sm-6">
<p>密码 [字母 数字 符号] (6~18位) </p>
<div class="input-group input-group-sm">
<span class="input-group-addon"> 密码 </span>
<input type="text" class="form-control" v-model="password" placeholder="密码 [字母 数字 符号] (6~18位)">
<input type="text" class="form-control" v-model="password"
placeholder="密码 [字母 数字 符号] (6~18位)">
</div>
</div>
</div>
<p>准许的服务器，输入服务器名字，分别以空格分割</p>
<div class="input-group input-group-sm">
<span class="input-group-addon"> 准许的服务器 </span>
<input type="text" class="form-control" v-model="allowedServer" placeholder="列如: 服务器名字A 服务器名字B 服务器名字C">
<input type="text" class="form-control" v-model="allowedServer"
placeholder="列如: 服务器名字A 服务器名字B 服务器名字C">
</div>
<div class="row">
<div class="col-lg-12">
@ -168,5 +171,5 @@
});
});
MI.rListener('onend', function () {});
MI.rListener('onend', function () { });
</script>