From 11e83860b7717e9459d68d8b3777ea7254e93eae Mon Sep 17 00:00:00 2001
From: DearTanker <1122669+DearTanker@users.noreply.github.com>
Date: Thu, 3 Jul 2025 19:37:34 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=20=E8=87=AA=E5=AE=9A?=
 =?UTF-8?q?=E4=B9=89=E6=A0=B7=E5=BC=8F=E5=8A=9F=E8=83=BD=E3=80=81=E4=B8=BB?=
 =?UTF-8?q?=E6=9C=BA=E8=AE=B0=E5=BD=95=E5=A2=9E=E5=8A=A0=E5=BF=AB=E9=80=9F?=
 =?UTF-8?q?=E6=89=93=E5=BC=80=E9=93=BE=E6=8E=A5=20(#263)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* 添加支持自定义样式功能。

* 在主机记录列中增加一个新窗口打开链接的小按钮，方便快速访问。

* 记录值增加快速复制按钮，并用 padding 来调整了图标的间距避免空格
---
 app/view/common/layout.html  |  3 ++
 app/view/domain/record.html  | 67 +++++++++++++++++++++++++++---------
 public/static/css/custom.css |  0
 3 files changed, 53 insertions(+), 17 deletions(-)
 create mode 100644 public/static/css/custom.css

diff --git a/app/view/common/layout.html b/app/view/common/layout.html
index 5564388..d428e58 100644
--- a/app/view/common/layout.html
+++ b/app/view/common/layout.html
@@ -12,6 +12,9 @@
   <link href="/static/css/app.min.css" rel="stylesheet">
   <link href="/static/css/skins/{$skin}.css" rel="stylesheet">
   <link href="/static/css/bootstrap-table.css?v=2" rel="stylesheet"/>
+  {if file_exists(public_path() . 'static/css/custom.css')}
+  <link href="/static/css/custom.css" rel="stylesheet">
+  {/if}
   <script src="{$cdnpublic}jquery/3.6.4/jquery.min.js"></script>
   <!--[if lt IE 9]>
     <script src="{$cdnpublic}html5shiv/3.7.3/html5shiv.min.js"></script>
diff --git a/app/view/domain/record.html b/app/view/domain/record.html
index 3bbd116..ee5c5de 100644
--- a/app/view/domain/record.html
+++ b/app/view/domain/record.html
@@ -175,7 +175,7 @@ td{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;max-width:360px;
 <div id="searchbox1">
   <div class="form-group">
 	<label>搜索</label>
-    <input type="text" class="form-control" name="keyword" placeholder="输入关键字">
+	<input type="text" class="form-control" name="keyword" placeholder="输入关键字">
   </div>
   <div class="form-group">
 	<select name="status" class="form-control"><option value="">所有状态</option><option value="1">启用</option><option value="0">暂停</option></select>
@@ -213,13 +213,13 @@ td{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;max-width:360px;
 	</select>
   </div>
   <div class="form-group">
-    <input type="text" class="form-control" name="subdomain" placeholder="输入主机记录">
+	<input type="text" class="form-control" name="subdomain" placeholder="输入主机记录">
   </div>
   <div class="form-group">
 	<select name="line" class="form-control"><option value="">全部线路</option></select>
   </div>
   <div class="form-group">
-    <input type="text" class="form-control" name="value" placeholder="输入记录值">
+	<input type="text" class="form-control" name="value" placeholder="输入记录值">
   </div>
   <button type="submit" class="btn btn-primary"><i class="fa fa-search"></i> 搜索</button>
   <a href="javascript:searchClear()" class="btn btn-default" title="刷新解析记录列表"><i class="fa fa-refresh"></i> 刷新</a>
@@ -227,9 +227,9 @@ td{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;max-width:360px;
 </div>
 </form>
 
-      <table id="listTable">
+	  <table id="listTable">
 	  </table>
-    </div>
+	</div>
   </div>
 </div>
 </div>
@@ -269,10 +269,16 @@ $(document).ready(function(){
 				visible: false,
 				title: '记录ID'
 			},
-			{
-				field: 'Name',
-				title: '主机记录'
-			},
+		   {
+			   field: 'Name',
+			   title: '主机记录',
+			   formatter: function(value, row, index) {
+				   var domain = value;
+				   if(domain === "@") domain = "{$domainName}";
+				   else domain = value + ".{$domainName}";
+				   return value + '<a href="http://' + domain + '" target="_blank" title="访问域名" style="padding-left:6px;"><i class="fa fa-external-link"></i></a>';
+			   }
+		   },
 			{
 				field: 'Type',
 				title: '记录类型',
@@ -282,18 +288,22 @@ $(document).ready(function(){
 					return value;
 				}
 			},
-            {
+			{
 				field: 'LineName',
 				title: '线路类型'
 			},
 			{
-				field: 'Value',
-				title: '记录值',
-				formatter: function(value, row, index) {
-					if(row.Type == 'MX') return value + ' | '+row.MX;
-					return value;
-				}
-			},
+			   field: 'Value',
+			   title: '记录值',
+			   formatter: function(value, row, index) {
+				   var display = value;
+				   if(row.Type == 'MX') display = value + ' | ' + row.MX;
+				   var copyId = 'copy-value-' + row.RecordId;
+				   // 只允许安全字符，避免引号问题
+				   var safeValue = (value+'').replace(/'/g, "&#39;").replace(/\\/g, "\\\\");
+				   return '<span id="'+copyId+'">'+display+'</span><a href="javascript:void(0);" title="复制记录值" onclick="copyToClipboard(\''+safeValue+'\', \'#'+copyId+'\')" style="padding-left:6px;"><i class=\"fa fa-copy\"></i></a>';
+			   }
+		   },
 			{
 				field: 'TTL',
 				title: 'TTL'
@@ -719,5 +729,28 @@ function advanceSearch(){
 		$("#searchbox1").slideDown();
 	}
 }
+function copyToClipboard(text, selector) {
+	var tempInput = document.createElement('input');
+	tempInput.style.position = 'absolute';
+	tempInput.style.left = '-9999px';
+	tempInput.value = text;
+	document.body.appendChild(tempInput);
+	tempInput.select();
+	document.execCommand('copy');
+	document.body.removeChild(tempInput);
+	if(selector){
+		var icon = document.querySelector(selector + ' + a i');
+		if(icon){
+			var oldClass = icon.className;
+			icon.className = 'fa fa-check';
+			setTimeout(function(){ icon.className = oldClass; }, 1000);
+		}
+	}
+	if(typeof layer !== 'undefined' && layer.msg){
+		layer.msg('已复制到剪贴板');
+	}else{
+		alert('已复制到剪贴板');
+	}
+}
 </script>
 {/block}
\ No newline at end of file
diff --git a/public/static/css/custom.css b/public/static/css/custom.css
new file mode 100644
index 0000000..e69de29