提供管理界面的HTTP/HTTPS修改功能

build/configs/.gitignore

@@ -1,3 +1,4 @@
 server.yaml
 api_db.yaml
 api.yaml
+*.pem

internal/utils/strings.go

@@ -0,0 +1,15 @@
+package utils
+
+import "strings"
+
+// format address
+func FormatAddress(addr string) string {
+	if strings.HasSuffix(addr, "unix:") {
+		return addr
+	}
+	addr = strings.Replace(addr, " ", "", -1)
+	addr = strings.Replace(addr, "\t", "", -1)
+	addr = strings.Replace(addr, "：", ":", -1)
+	addr = strings.TrimSpace(addr)
+	return addr
+}

internal/web/actions/default/about/init.go

@@ -0,0 +1,12 @@
+package about
+
+import "github.com/iwind/TeaGo"
+
+func init() {
+	TeaGo.BeforeStart(func(server *TeaGo.Server) {
+		server.
+			Prefix("/about").
+			Get("/qq", new(QqAction)).
+			EndAll()
+	})
+}

internal/web/actions/default/about/qq.go

@@ -0,0 +1,15 @@
+package about
+
+import "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/actionutils"
+
+type QqAction struct {
+	actionutils.ParentAction
+}
+
+func (this *QqAction) Init() {
+	this.Nav("", "", "")
+}
+
+func (this *QqAction) RunGet(params struct{}) {
+	this.Show()
+}

internal/web/actions/default/clusters/checkChange.go

@@ -4,7 +4,6 @@ import (
 	"github.com/TeaOSLab/EdgeAdmin/internal/web/actions/actionutils"
 	"github.com/TeaOSLab/EdgeCommon/pkg/rpc/pb"
 	"github.com/iwind/TeaGo/maps"
-	"time"
 )
 
 // 检查变更的集群列表
@@ -19,21 +18,6 @@ func (this *CheckChangeAction) Init() {
 func (this *CheckChangeAction) RunPost(params struct {
 	IsNotifying bool
 }) {
-	timeout := time.NewTimer(55 * time.Second) // 比客户端提前结束，避免在客户端产生一个请求错误
-
-	this.Data["clusters"] = []interface{}{}
-
-Loop:
-	for {
-		select {
-		case <-this.Request.Context().Done():
-			break Loop
-		case <-timeout.C:
-			break Loop
-		default:
-			// 继续
-		}
-
 	resp, err := this.RPC().NodeClusterRPC().FindAllChangedNodeClusters(this.AdminContext(), &pb.FindAllChangedNodeClustersRequest{})
 	if err != nil {
 		this.ErrorPage(err)
@@ -48,18 +32,6 @@ Loop:
 		})
 	}
 
-		// 从提醒到提醒消失
-		if len(result) == 0 && params.IsNotifying {
-			break
-		}
-
 	this.Data["clusters"] = result
-		if len(result) > 0 {
-			break
-		}
-
-		time.Sleep(1 * time.Second)
-	}
-
 	this.Success()
 }

internal/web/actions/default/servers/components/ssl/selectPopup.go

@@ -19,10 +19,17 @@ func (this *SelectPopupAction) Init() {
 	this.Nav("", "", "")
 }
 
-func (this *SelectPopupAction) RunGet(params struct{}) {
+func (this *SelectPopupAction) RunGet(params struct {
+	ViewSize string
+}) {
 	// TODO 支持关键词搜索
 	// TODO 列出常用的证书供用户选择
 
+	if len(params.ViewSize) == 0 {
+		params.ViewSize = "normal"
+	}
+	this.Data["viewSize"] = params.ViewSize
+
 	countResp, err := this.RPC().SSLCertRPC().CountSSLCerts(this.AdminContext(), &pb.CountSSLCertRequest{})
 	if err != nil {
 		this.ErrorPage(err)

internal/web/actions/default/settings/index.go

@@ -1,6 +1,8 @@
 package settings
 
-import "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/actionutils"
+import (
+	"github.com/TeaOSLab/EdgeAdmin/internal/web/actions/actionutils"
+)
 
 type IndexAction struct {
 	actionutils.ParentAction
@@ -11,5 +13,5 @@ func (this *IndexAction) Init() {
 }
 
 func (this *IndexAction) RunGet(params struct{}) {
-	this.Show()
+	this.RedirectURL("/settings/ui")
 }

internal/web/actions/default/settings/init.go

@@ -1,7 +1,6 @@
 package settings
 
 import (
-	"github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/settings/settingutils"
 	"github.com/TeaOSLab/EdgeAdmin/internal/web/helpers"
 	"github.com/iwind/TeaGo"
 )
@@ -11,7 +10,6 @@ func init() {
 		server.
 			Helper(helpers.NewUserMustAuth()).
 			Helper(NewHelper()).
-			Helper(settingutils.NewHelper("console")).
 			Prefix("/settings").
 			Get("", new(IndexAction)).
 			EndAll()

internal/web/actions/default/settings/settingutils/utils.go

@@ -25,7 +25,7 @@ func (this *Helper) BeforeAction(actionPtr actions.ActionWrapper) (goNext bool)
 
 	// 标签栏
 	tabbar := actionutils.NewTabbar()
-	tabbar.Add("管理界面", "", "/settings", "", this.tab == "console")
+	tabbar.Add("管理界面", "", "/settings", "", this.tab == "ui")
 	tabbar.Add("安全设置", "", "/settings/security", "", this.tab == "security")
 	tabbar.Add("数据库", "", "/settings/database", "", this.tab == "database")
 	tabbar.Add("API节点", "", "/api", "", this.tab == "apiNodes")

internal/web/actions/default/settings/ui/index.go

@@ -0,0 +1,27 @@
+package ui
+
+import (
+	"github.com/TeaOSLab/EdgeAdmin/internal/web/actions/actionutils"
+)
+
+type IndexAction struct {
+	actionutils.ParentAction
+}
+
+func (this *IndexAction) Init() {
+	this.Nav("", "", "")
+}
+
+func (this *IndexAction) RunGet(params struct{}) {
+	this.Data["serverIsChanged"] = serverConfigIsChanged
+
+	serverConfig, err := loadServerConfig()
+	if err != nil {
+		this.ErrorPage(err)
+		return
+	}
+
+	this.Data["serverConfig"] = serverConfig
+
+	this.Show()
+}

internal/web/actions/default/settings/ui/init.go

@@ -0,0 +1,20 @@
+package ui
+
+import (
+	"github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/settings/settingutils"
+	"github.com/TeaOSLab/EdgeAdmin/internal/web/helpers"
+	"github.com/iwind/TeaGo"
+)
+
+func init() {
+	TeaGo.BeforeStart(func(server *TeaGo.Server) {
+		server.
+			Helper(helpers.NewUserMustAuth()).
+			Helper(settingutils.NewHelper("ui")).
+			Prefix("/settings/ui").
+			Get("", new(IndexAction)).
+			GetPost("/updateHTTPPopup", new(UpdateHTTPPopupAction)).
+			GetPost("/updateHTTPSPopup", new(UpdateHTTPSPopupAction)).
+			EndAll()
+	})
+}

internal/web/actions/default/settings/ui/updateHTTPPopup.go

@@ -0,0 +1,65 @@
+package ui
+
+import (
+	"github.com/TeaOSLab/EdgeAdmin/internal/utils"
+	"github.com/TeaOSLab/EdgeAdmin/internal/web/actions/actionutils"
+	"github.com/iwind/TeaGo/actions"
+	"net"
+)
+
+type UpdateHTTPPopupAction struct {
+	actionutils.ParentAction
+}
+
+func (this *UpdateHTTPPopupAction) Init() {
+	this.Nav("", "", "")
+}
+
+func (this *UpdateHTTPPopupAction) RunGet(params struct{}) {
+	serverConfig, err := loadServerConfig()
+	if err != nil {
+		this.ErrorPage(err)
+		return
+	}
+	this.Data["serverConfig"] = serverConfig
+
+	this.Show()
+}
+
+func (this *UpdateHTTPPopupAction) RunPost(params struct {
+	IsOn    bool
+	Listens []string
+
+	Must *actions.Must
+}) {
+	if len(params.Listens) == 0 {
+		this.Fail("请输入绑定地址")
+	}
+
+	serverConfig, err := loadServerConfig()
+	if err != nil {
+		this.Fail("保存失败：" + err.Error())
+	}
+
+	serverConfig.Http.On = params.IsOn
+
+	listen := []string{}
+	for _, addr := range params.Listens {
+		addr = utils.FormatAddress(addr)
+		if len(addr) == 0 {
+			continue
+		}
+		if _, _, err := net.SplitHostPort(addr); err != nil {
+			addr += ":80"
+		}
+		listen = append(listen, addr)
+	}
+	serverConfig.Http.Listen = listen
+
+	err = writeServerConfig(serverConfig)
+	if err != nil {
+		this.Fail("保存失败：" + err.Error())
+	}
+
+	this.Success()
+}

internal/web/actions/default/settings/ui/updateHTTPSPopup.go

@@ -0,0 +1,140 @@
+package ui
+
+import (
+	"encoding/json"
+	"github.com/TeaOSLab/EdgeAdmin/internal/utils"
+	"github.com/TeaOSLab/EdgeAdmin/internal/web/actions/actionutils"
+	"github.com/TeaOSLab/EdgeCommon/pkg/rpc/pb"
+	"github.com/TeaOSLab/EdgeCommon/pkg/serverconfigs/sslconfigs"
+	"github.com/iwind/TeaGo/Tea"
+	"github.com/iwind/TeaGo/actions"
+	"io/ioutil"
+	"net"
+)
+
+type UpdateHTTPSPopupAction struct {
+	actionutils.ParentAction
+}
+
+func (this *UpdateHTTPSPopupAction) Init() {
+	this.Nav("", "", "")
+}
+
+func (this *UpdateHTTPSPopupAction) RunGet(params struct{}) {
+	serverConfig, err := loadServerConfig()
+	if err != nil {
+		this.ErrorPage(err)
+		return
+	}
+	this.Data["serverConfig"] = serverConfig
+
+	// 证书
+	certConfigs := []*sslconfigs.SSLCertConfig{}
+	if len(serverConfig.Https.Cert) > 0 && len(serverConfig.Https.Key) > 0 {
+		certData, err := ioutil.ReadFile(Tea.Root + "/" + serverConfig.Https.Cert)
+		if err != nil {
+			this.ErrorPage(err)
+			return
+		}
+		keyData, err := ioutil.ReadFile(Tea.Root + "/" + serverConfig.Https.Key)
+		if err != nil {
+			this.ErrorPage(err)
+			return
+		}
+		certConfig := &sslconfigs.SSLCertConfig{
+			Id:       0,
+			Name:     "-",
+			CertData: certData,
+			KeyData:  keyData,
+		}
+		_ = certConfig.Init()
+		certConfig.CertData = nil
+		certConfig.KeyData = nil
+		certConfigs = append(certConfigs, certConfig)
+	}
+	this.Data["certConfigs"] = certConfigs
+
+	this.Show()
+}
+
+func (this *UpdateHTTPSPopupAction) RunPost(params struct {
+	IsOn        bool
+	Listens     []string
+	CertIdsJSON []byte
+
+	Must *actions.Must
+}) {
+	if len(params.Listens) == 0 {
+		this.Fail("请输入绑定地址")
+	}
+
+	serverConfig, err := loadServerConfig()
+	if err != nil {
+		this.Fail("保存失败：" + err.Error())
+	}
+
+	serverConfig.Https.On = params.IsOn
+
+	listen := []string{}
+	for _, addr := range params.Listens {
+		addr = utils.FormatAddress(addr)
+		if len(addr) == 0 {
+			continue
+		}
+		if _, _, err := net.SplitHostPort(addr); err != nil {
+			addr += ":80"
+		}
+		listen = append(listen, addr)
+	}
+	serverConfig.Https.Listen = listen
+
+	// 证书
+	certIds := []int64{}
+	err = json.Unmarshal(params.CertIdsJSON, &certIds)
+	if err != nil {
+		this.ErrorPage(err)
+		return
+	}
+	if params.IsOn && len(certIds) == 0 {
+		this.Fail("要启用HTTPS，需要先选择或上传一个可用的证书")
+	}
+
+	// 保存证书到本地
+	if len(certIds) > 0 && certIds[0] != 0 {
+		certResp, err := this.RPC().SSLCertRPC().FindEnabledSSLCertConfig(this.AdminContext(), &pb.FindEnabledSSLCertConfigRequest{
+			CertId: certIds[0],
+		})
+		if err != nil {
+			this.ErrorPage(err)
+			return
+		}
+		if len(certResp.CertJSON) == 0 {
+			this.Fail("选择的证书已失效，请换一个")
+		}
+
+		certConfig := &sslconfigs.SSLCertConfig{}
+		err = json.Unmarshal(certResp.CertJSON, certConfig)
+		if err != nil {
+			this.ErrorPage(err)
+			return
+		}
+		err = ioutil.WriteFile(Tea.ConfigFile("https.key.pem"), certConfig.KeyData, 0666)
+		if err != nil {
+			this.Fail("保存密钥失败：" + err.Error())
+		}
+		err = ioutil.WriteFile(Tea.ConfigFile("https.cert.pem"), certConfig.CertData, 0666)
+		if err != nil {
+			this.Fail("保存证书失败：" + err.Error())
+		}
+
+		serverConfig.Https.Key = "configs/https.key.pem"
+		serverConfig.Https.Cert = "configs/https.cert.pem"
+	}
+
+	err = writeServerConfig(serverConfig)
+	if err != nil {
+		this.Fail("保存配置失败：" + err.Error())
+	}
+
+	this.Success()
+}

internal/web/actions/default/settings/ui/utils.go

@@ -0,0 +1,41 @@
+package ui
+
+import (
+	"github.com/iwind/TeaGo"
+	"github.com/iwind/TeaGo/Tea"
+	"gopkg.in/yaml.v3"
+	"io/ioutil"
+)
+
+var serverConfigIsChanged = false
+
+// 读取当前服务配置
+func loadServerConfig() (*TeaGo.ServerConfig, error) {
+	configFile := Tea.ConfigFile("server.yaml")
+	data, err := ioutil.ReadFile(configFile)
+	if err != nil {
+		return nil, err
+	}
+	serverConfig := &TeaGo.ServerConfig{}
+	err = yaml.Unmarshal(data, serverConfig)
+	if err != nil {
+		return nil, err
+	}
+	return serverConfig, nil
+}
+
+// 保存当前服务配置
+func writeServerConfig(serverConfig *TeaGo.ServerConfig) error {
+	data, err := yaml.Marshal(serverConfig)
+	if err != nil {
+		return err
+	}
+	err = ioutil.WriteFile(Tea.ConfigFile("server.yaml"), data, 0666)
+	if err != nil {
+		return err
+	}
+
+	serverConfigIsChanged = true
+
+	return nil
+}

internal/web/import.go

@@ -1,6 +1,7 @@
 package web
 
 import (
+	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/about"
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/api"
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/api/node"
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/clusters"
@@ -70,6 +71,7 @@ import (
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/settings/login"
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/settings/profile"
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/settings/security"
+	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/settings/ui"
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/settings/upgrade"
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/setup"
 	_ "github.com/TeaOSLab/EdgeAdmin/internal/web/actions/default/ui"

web/public/js/components/server/ssl-certs-box.js

@@ -1,5 +1,5 @@
 Vue.component("ssl-certs-box", {
-	props: ["v-certs", "v-protocol"],
+	props: ["v-certs", "v-protocol", "v-view-size", "v-single-mode"],
 	data: function () {
 		let certs = this.vCerts
 		if (certs == null) {
@@ -26,9 +26,19 @@ Vue.component("ssl-certs-box", {
 		// 选择证书
 		selectCert: function () {
 			let that = this
-			teaweb.popup("/servers/components/ssl/selectPopup", {
+			let width = "50em"
-				width: "50em",
+			let height = "30em"
-				height: "30em",
+			let viewSize = this.vViewSize
+			if (viewSize == null) {
+				viewSize = "normal"
+			}
+			if (viewSize == "mini") {
+				width = "35em"
+				height = "20em"
+			}
+			teaweb.popup("/servers/components/ssl/selectPopup?viewSize=" + viewSize, {
+				width: width,
+				height: height,
 				callback: function (resp) {
 					that.certs.push(resp.data.cert)
 				}
@@ -51,6 +61,11 @@ Vue.component("ssl-certs-box", {
 		// 格式化时间
 		formatTime: function (timestamp) {
 			return new Date(timestamp * 1000).format("Y-m-d")
+		},
+
+		// 判断是否显示选择｜上传按钮
+		buttonsVisible: function () {
+			return this.vSingleMode == null || !this.vSingleMode || this.certs == null || this.certs.length == 0
 		}
 	},
 	template: `<div>
@@ -59,13 +74,15 @@ Vue.component("ssl-certs-box", {
 		<div class="ui label small" v-for="(cert, index) in certs">
 			{{cert.name}} / {{cert.dnsNames}} / 有效至{{formatTime(cert.timeEndAt)}} &nbsp; <a href="" title="删除" @click.prevent="removeCert()"><i class="icon remove"></i></a>
 		</div>
-		<div class="ui divider"></div>
+		<div class="ui divider" v-if="buttonsVisible()"></div>
 	</div>
 	<div v-else>
 		<span class="red">选择或上传证书后<span v-if="vProtocol == 'https'">HTTPS</span><span v-if="vProtocol == 'tls'">TLS</span>服务才能生效。</span>
-		<div class="ui divider"></div>
+		<div class="ui divider" v-if="buttonsVisible()"></div>
 	</div>
+	<div v-if="buttonsVisible()">
 		<button class="ui button tiny" type="button" @click.prevent="selectCert()">选择已有证书</button> &nbsp;
 		<button class="ui button tiny" type="button" @click.prevent="uploadCert()">上传新证书</button>
+	</div>
 </div>`
 })

web/views/@default/@layout.css

@@ -57,7 +57,7 @@
 .right-box {
   position: fixed;
   top: 7.5em;
-  bottom: 0;
+  bottom: 1.3em;
   right: 0;
   left: 18em;
   padding-right: 2em;

web/views/@default/@layout.html

@@ -83,6 +83,17 @@
         <!-- 功能区 -->
         {$TEA.VIEW}
     </div>
+
+	<!-- 底部 -->
+	<div id="footer" class="ui menu inverted light-blue borderless small">
+		<a  href="/settings/upgrade" class="item" title="点击进入检查版本更新页面">{{teaName}} v{{teaVersion}}</a>
+		<a href="https://github.com/TeaOSLab/EdgeAdmin" target="_blank" class="item">GitHub</a>
+		<!--<a href="http://teaos.cn" target="_blank" class="item">官网</a>
+		<a href="http://teaos.cn/doc" target="_blank" class="item">文档</a>-->
+		<a href="https://github.com/TeaOSLab/EdgeAdmin/issues" target="_blank" class="item">提Bug</a>
+		<a class="item" @click.prevent="showQQGroupQrcode()">QQ讨论群：659832182 &nbsp;<i class="icon qrcode"></i> </a>
+		<a class="item right" href="http://teaos.cn/doc/donate/Index.md" target="_blank">捐赠作者</a>
+	</div>
 </div>
 
 {$echo "footer"}

web/views/@default/@layout.js

@@ -1,6 +1,7 @@
 Tea.context(function () {
-	this.moreOptionsVisible = false;
+	this.moreOptionsVisible = false
-	this.globalChangedClusters = [];
+	this.globalChangedClusters = []
+	this.teaDemoEnabled = false
 
 	if (typeof this.leftMenuItemIsDisabled == "undefined") {
 		this.leftMenuItemIsDisabled = false
@@ -8,29 +9,29 @@ Tea.context(function () {
 
 	this.$delay(function () {
 		if (this.$refs.focus != null) {
-			this.$refs.focus.focus();
+			this.$refs.focus.focus()
 		}
 
 		// 检查变更
 		this.checkClusterChanges()
-	});
+	})
 
 	/**
 	 * 左侧子菜单
 	 */
 	this.showSubMenu = function (menu) {
 		if (menu.alwaysActive) {
-			return;
+			return
 		}
 		if (this.teaSubMenus.menus != null && this.teaSubMenus.menus.length > 0) {
 			this.teaSubMenus.menus.$each(function (k, v) {
 				if (menu.id == v.id) {
-					return;
+					return
 				}
-				v.isActive = false;
+				v.isActive = false
-			});
+			})
 		}
-		menu.isActive = !menu.isActive;
+		menu.isActive = !menu.isActive
 	};
 
 	/**
@@ -70,6 +71,16 @@ Tea.context(function () {
 				})
 		})
 	};
+
+	/**
+	 * 底部伸展框
+	 */
+	this.showQQGroupQrcode = function () {
+		teaweb.popup("/about/qq", {
+			width: "21em",
+			height: "24em"
+		})
+	}
 });
 
 window.NotifySuccess = function (message, url, params) {

web/views/@default/@layout_popup.html

@@ -15,6 +15,7 @@
 	<script type="text/javascript" src="/ui/components.js"></script>
 	<script type="text/javascript" src="/js/utils.js"></script>
 	<script type="text/javascript" src="/js/sweetalert2/dist/sweetalert2.all.min.js"></script>
+	<script type="text/javascript" src="/js/date.tea.js"></script>
 	<style type="text/css">
 		.main {
 			left: 0;
@@ -22,7 +23,7 @@
 			bottom: 0;
 			right: 0;
 			overflow-y: auto;
-			padding-bottom: 0em;
+			padding-bottom: 0;
 		}
 
 		.main::-webkit-scrollbar {

web/views/@default/@left_menu.less

@@ -36,6 +36,7 @@
 				border-bottom: 1px #666 dashed;
 			}
 		}
+
 		.item.off {
 			span {
 				var {
@@ -78,7 +79,7 @@
 .right-box {
 	position: fixed;
 	top: 7.5em;
-	bottom: 0;
+	bottom: 1.3em;
 	right: 0;
 	left: 18em;
 	padding-right: 2em;

web/views/@default/about/qq.css

@@ -0,0 +1,4 @@
+table img {
+  width: 20em;
+}
+/*# sourceMappingURL=qq.css.map */

web/views/@default/about/qq.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["qq.less"],"names":[],"mappings":"AAAA,KAAM;EACL,WAAA","file":"qq.css"}

web/views/@default/about/qq.html

@@ -0,0 +1,8 @@
+{$layout "layout_popup"}
+
+<h3>QQ群 <span>659832182</span></h3>
+<table class="ui table">
+	<tr>
+		<td><img src="/images/qq-group-qrcode.png"/></td>
+	</tr>
+</table>

web/views/@default/about/qq.less

@@ -0,0 +1,3 @@
+table img {
+	width: 20em;
+}

web/views/@default/servers/components/ssl/selectPopup.html

@@ -6,10 +6,10 @@
 	<thead>
 	<tr>
 		<th>证书说明</th>
-		<th>顶级发行组织</th>
+		<th v-if="viewSize == 'normal'">顶级发行组织</th>
 		<th>域名</th>
 		<th>过期日期</th>
-		<th>引用服务</th>
+		<th v-if="viewSize == 'normal'">引用服务</th>
 		<th>状态</th>
 		<th class="one op">操作</th>
 	</tr>
@@ -20,7 +20,7 @@
 				<span class="ui label olive tiny">CA</span>
 			</div>
 		</td>
-		<td>
+		<td v-if="viewSize == 'normal'">
 			<span v-if="cert.commonNames != null && cert.commonNames.length > 0">{{cert.commonNames[cert.commonNames.length-1]}}</span>
 		</td>
 		<td>
@@ -29,7 +29,7 @@
 			</div>
 		</td>
 		<td>{{certInfos[index].endDay}}</td>
-		<td>{{certInfos[index].countServers}}</td>
+		<td v-if="viewSize == 'normal'">{{certInfos[index].countServers}}</td>
 		<td nowrap="">
 			<span class="ui label red tiny basic" v-if="certInfos[index].isExpired">已过期</span>
 			<span class="ui label green tiny basic" v-else>有效中</span>

web/views/@default/settings/ui/index.html

@@ -0,0 +1,54 @@
+{$layout}
+
+<div class="ui message warning" v-if="serverIsChanged">服务配置已修改，请在命令行下重启后生效。</div>
+
+<h3>HTTP <a href="/settings/server/http" v-if="!teaDemoEnabled" @click.prevent="updateHTTP()">修改</a><a v-if="teaDemoEnabled">[演示版无法修改]</a></h3>
+
+<table class="ui table definition selectable">
+	<tr>
+		<td>状态</td>
+		<td>
+			<label-on :v-is-on="serverConfig.http.on"></label-on>
+		</td>
+	</tr>
+	<tr>
+		<td class="title">绑定地址</td>
+		<td>
+			<span v-for="listen in serverConfig.http.listen" class="ui label tiny">{{listen}}</span>
+			<p class="ui comment">如果地址中的IP是0.0.0.0，表示服务器的所有IP都可以用来使用访问此服务。</p>
+		</td>
+	</tr>
+</table>
+
+<div class="ui divider"></div>
+
+<h3>HTTPS <a href="" v-if="!teaDemoEnabled" @click.prevent="updateHTTPS()">修改</a><a v-if="teaDemoEnabled">[演示版无法修改]</a></h3>
+<table class="ui table definition selectable">
+	<tr>
+		<td>状态</td>
+		<td>
+			<label-on :v-is-on="serverConfig.https.on"></label-on>
+		</td>
+	</tr>
+	<tr>
+		<td class="title">绑定地址</td>
+		<td>
+			<span v-for="listen in serverConfig.https.listen" class="ui label tiny">{{listen}}</span>
+			<p class="ui comment">如果地址中的IP是0.0.0.0，表示服务器的所有IP都可以用来使用访问此服务。</p>
+		</td>
+	</tr>
+	<tr>
+		<td>证书文件<span class="small">（Cert）</span></td>
+		<td>
+			<span v-if="serverConfig.https.cert.length > 0">{{serverConfig.https.cert}}</span>
+			<span class="disabled" v-else>还没有设置证书</span>
+		</td>
+	</tr>
+	<tr>
+		<td>私钥文件<span class="small">（Key）</span></td>
+		<td>
+			<span v-if="serverConfig.https.key.length > 0">{{serverConfig.https.key}}</span>
+			<span class="disabled" v-else>还没有设置私钥</span>
+		</td>
+	</tr>
+</table>

web/views/@default/settings/ui/index.js

@@ -0,0 +1,19 @@
+Tea.context(function () {
+	this.updateHTTP = function () {
+		teaweb.popup("/settings/ui/updateHTTPPopup", {
+			callback: function () {
+				teaweb.success("保存成功", teaweb.reload)
+			}
+		})
+	}
+
+	this.updateHTTPS = function () {
+		teaweb.popup("/settings/ui/updateHTTPSPopup", {
+			height: "26em",
+			width:"50em",
+			callback: function () {
+				teaweb.success("保存成功", teaweb.reload)
+			}
+		})
+	}
+})

web/views/@default/settings/ui/updateHTTPPopup.html

@@ -0,0 +1,27 @@
+{$layout "layout_popup"}
+
+<h3>修改HTTP设置</h3>
+
+<form class="ui form" data-tea-action="$" data-tea-success="success">
+	<table class="ui table definition selectable">
+		<tr>
+			<td>是否启用</td>
+			<td>
+				<div class="ui checkbox">
+					<input type="checkbox" name="isOn" value="1" v-model="serverConfig.http.on"/>
+					<label></label>
+				</div>
+			</td>
+		</tr>
+		<tr>
+			<td class="title">绑定地址</td>
+			<td>
+				<values-box name="listens" :values="addresses"></values-box>
+				<p class="comment" style="margin-bottom:0">地址格式为："IP:端口"，比如："127.0.0.1:7777"。</p>
+				<p class="comment">如果地址中的IP是0.0.0.0，表示服务器的所有IP都可以用来使用访问此服务。</p>
+			</td>
+		</tr>
+	</table>
+
+	<submit-btn></submit-btn>
+</form>

web/views/@default/settings/ui/updateHTTPPopup.js

@@ -0,0 +1,8 @@
+Tea.context(function () {
+	this.success = NotifyPopup
+
+	this.addresses = [];
+	if (this.serverConfig != null && this.serverConfig.http != null && this.serverConfig.http.listen != null) {
+		this.addresses = this.serverConfig.http.listen
+	}
+})

web/views/@default/settings/ui/updateHTTPSPopup.html

@@ -0,0 +1,33 @@
+{$layout "layout_popup"}
+
+<h3>修改HTTPS配置</h3>
+
+<form data-tea-action="$" data-tea-success="success" class="ui form">
+	<table class="ui table definition selectable">
+		<tr>
+			<td>是否启用</td>
+			<td>
+				<div class="ui checkbox">
+					<input type="checkbox" name="isOn" value="1" v-model="serverConfig.https.on"/>
+					<label></label>
+				</div>
+			</td>
+		</tr>
+		<tr>
+			<td class="title">绑定地址</td>
+			<td>
+				<values-box name="listens" :values="addresses"></values-box>
+				<p class="comment" style="margin-bottom:0">每行一个地址，地址格式为："IP:端口"，比如："127.0.0.1:7778"。</p>
+				<p class="comment">如果地址中的IP是0.0.0.0，表示服务器的所有IP都可以用来使用访问此服务。</p>
+			</td>
+		</tr>
+		<tr v-show="serverConfig.https.on">
+			<td>选择证书文件</td>
+			<td>
+				<ssl-certs-box :v-certs="certConfigs" :v-protocol="'http'" :v-view-size="'mini'" :v-single-mode="true"></ssl-certs-box>
+			</td>
+		</tr>
+	</table>
+
+	<button class="ui button primary">保存</button>
+</form>

web/views/@default/settings/ui/updateHTTPSPopup.js

@@ -0,0 +1,8 @@
+Tea.context(function () {
+	this.success = NotifyPopup
+
+	this.addresses = [];
+	if (this.serverConfig != null && this.serverConfig.https != null && this.serverConfig.https.listen != null) {
+		this.addresses = this.serverConfig.https.listen
+	}
+})