ken_nogi/Pleasanter/Extended/wwwroot/myScripts/templateHTML3.html.bak
Kenichiro NOGI ce58cb4be4 初回コミット: dev配下(NodeSrv/Pleasanter等)をGitea管理下に統合
GitHub(nextgroup2706/ken_nogi)は今後使わず自社Gitea運用に切替え。
NodeSrvは旧リポジトリの履歴を破棄しファイルのみ統合(Dokploy用サービスアカウントは
別途mygit-admin/NodeSrv.gitに履歴あり)。notepmエクスポート(12GB)とPleasanter
インストーラzip(208MB)はサイズが大きいため.gitignoreで除外。

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-09-04 15:37:06 +09:00

373 lines
13 KiB
HTML

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>マスターシート -現場案内図-</title>
<script src="https://code.jquery.com/jquery-3.7.0.js"></script>
<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.13.2//themes/smoothness/jquery-ui.css">
<style type="text/css">
#boxController {
font-size: 0.7em;
position: absolute;
top: 250px;
left: 770px;
}
.boxControl {
text-align: right;
white-space: nowrap;
}
.boxControlLabel {
font-size: 1.5em;
font-weight: bold;
text-align: center;
}
.kakushiBOX {
position: absolute;
top: 0px;
left: 0px;
background-color: yellow;
width: 1000px;
height: 1300px;
opacity: 0;
z-index: 500;
display: none;
}
.rectBoxA {
cursor: move;
position: absolute;
width: 50px;
height: 50px;
z-index: 1000;
border: 0 solid black;
}
.rectBoxB {
transform-origin: left top;
position: relative;
width: 50px;
height: 50px;
z-index: 1001;
}
.rectBoxC {
position: relative;
width: 50px;
height: 50px;
z-index: 1002;
}
.rectBoxD {
border: none;
background: rgba(255, 0, 0, 1);
position: relative;
width: 4px;
height: 4px;
z-index: 1003;
}
@media print {
#boxController,
.kakushiBOX,
.hideMessage,
.rectBoxD,
.hideInPrint,
.hideRect,
.control {
display: none !important;
}
}
.hideMessage {
top: 3px;
left: 6px;
vertical-align: middle;
font-size: 50%;
color: black;
text-align: center;
font-weight: bold;
}
.hideRect {
border: solid blue 1px;
background: rgba(0, 255, 255, 0.1);
}
.showRect {
border: solid red 1px;
background: rgba(255, 0, 0, 0.1);
}
.tg {
border-collapse: collapse;
border-spacing: 0;
margin: auto;
z-index: 0;
}
.tg td {
border-color: black;
border-style: solid;
border-width: 1px;
font-family: Arial, sans-serif;
font-size: 12px;
overflow: hidden;
word-break: keep-all;
}
.tg th {
border-color: black;
border-style: solid;
border-width: 1px;
font-family: Arial, sans-serif;
font-size: 12px;
font-weight: bold;
overflow: hidden;
word-break: keep-all;
}
.tg .tg-title {
background-color: #333333;
color: #ffffff;
font-size: x-large;
font-weight: bold;
text-align: center;
vertical-align: middle
}
.tg .tg-center {
text-align: center;
vertical-align: middle
}
.tg .tg-left {
text-align: left;
vertical-align: middle
}
.tg .tg-label {
background-color: #c0c0c0;
text-align: center;
vertical-align: middle
}
@page {
size: A4 portrait;
margin: 0mm;
}
.page {
width: 210mm;
height: 297mm;
box-sizing: border-box;
padding: 5mm;
text-align: center;
}
</style>
</head>
<body>
<section class="page">
<table class="tg" style="table-layout: fixed; width: 700px">
<colgroup>
<col style="width: 100px">
<col style="width: 100px">
<col style="width: 100px">
<col style="width: 100px">
<col style="width: 100px">
<col style="width: 100px">
<col style="width: 100px">
</colgroup>
<thead>
<tr>
<th class="tg-title" colspan="3" rowspan="2">現場案内図</th>
<th class="tg-label">顧客コード</th>
<th class="tg-center" colspan="2">{{kokyaku_code}}</th>
<th class="tg-center" rowspan="2">{{create_date}}</th>
</tr>
<tr>
<th class="tg-label">契約コード</th>
<th class="tg-center" colspan="2" id="keiyaku_code">{{keiyaku_code}}</th>
</tr>
</thead>
<tbody>
<tr>
<td class="tg-label" rowspan="2">工事名</td>
<td class="tg-left" colspan="6">{{koujimei_kana}}</td>
</tr>
<tr>
<td class="tg-left" style="font-size:1.3em;font-weight:bold;" colspan="6">{{kouji_mei}}</td>
</tr>
<tr>
<td class="tg-label">建築場所</td>
<td class="tg-left" colspan="2">{{jusyo_yubin}}</td>
<td class="tg-left" colspan="4">{{jyusho}}</td>
</tr>
<tr>
<td class="tg-label">施工会社</td>
<td class="tg-center" colspan="2">{{sekou_kaisya}}</td>
<td class="tg-label">TEL</td>
<td class="tg-center">{{tel}}</td>
<td class="tg-label">FAX</td>
<td class="tg-center">{{fax}}</td>
</tr>
<tr>
<td class="tg-label">工事担当者</td>
<td class="tg-center" colspan="2">{{kouji_tantou}}</td>
<td class="tg-label">搬入路</td>
<td class="tg-center" colspan="2">{{hannyu_road}}</td>
<td class="tg-center" rowspan="4">
<div>Google MAP</div>
<div id="mapQr"></div>
</td>
</tr>
<tr>
<td class="tg-label">駐車場</td>
<td class="tg-center" colspan="2">{{chusyajou}}</td>
<td class="tg-label">小運搬</td>
<td class="tg-center" colspan="2">{{sho_unpan}}</td>
</tr>
<tr>
<td class="tg-label" colspan="6">その他、搬入時の注意事項 ・ 住所の補足など</td>
</tr>
<tr>
<td class="tg-left" colspan="6" style="height:4em;">{{{sonota}}}</td>
</tr>
<tr>
<td class="tg-center" colspan="7"><iframe id="mapFrame1" width="640px" height="400px"></iframe></td>
</tr>
<tr>
<td class="tg-center" colspan="7"><iframe id="mapFrame2" width="640px" height="400px"></iframe></td>
</tr>
</tbody>
</table>
<table id="boxController">
<tr>
<td>
<div class="boxControl">
<div class="boxControlLabel">BOX1</div>
<label for="spin1X">X</label>
<input id="spin1X" name="spin1X" value="0" size="5" /><br>
<label for="spin1Y">Y</label>
<input id="spin1Y" name="spin1Y" value="0" size="5" /><br>
<label for="spin1H">H</label>
<input id="spin1H" name="spin1H" value="50" size="5" /><br>
<label for="spin1W">W</label>
<input id="spin1W" name="spin1W" value="50" size="5" /><br>
<label for="spin1R">R</label>
<input id="spin1R" name="spin1R" value="0" size="5" /><br>
</div>
</td>
<td>
<div class="boxControl">
<div class="boxControlLabel">BOX2</div>
<label for="spin2X">X</label>
<input id="spin2X" name="spin2X" value="0" size="5" /><br>
<label for="spin2Y">Y</label>
<input id="spin2Y" name="spin2Y" value="0" size="5" /><br>
<label for="spin2H">H</label>
<input id="spin2H" name="spin2H" value="50" size="5" /><br>
<label for="spin2W">W</label>
<input id="spin2W" name="spin2W" value="50" size="5" /><br>
<label for="spin2R">R</label>
<input id="spin2R" name="spin2R" value="0" size="5" /><br>
</div>
</td>
</tr>
<tr>
<td>
<div class="boxControl">
<div class="boxControlLabel">BOX3</div>
<label for="spin3X">X</label>
<input id="spin3X" name="spin3X" value="0" size="5" /><br>
<label for="spin3Y">Y</label>
<input id="spin3Y" name="spin3Y" value="0" size="5" /><br>
<label for="spin3H">H</label>
<input id="spin3H" name="spin3H" value="50" size="5" /><br>
<label for="spin3W">W</label>
<input id="spin3W" name="spin3W" value="50" size="5" /><br>
<label for="spin3R">R</label>
<input id="spin3R" name="spin3R" value="0" size="5" /><br>
</div>
</td>
<td>
<div class="boxControl">
<div class="boxControlLabel">BOX4</div>
<label for="spin4X">X</label>
<input id="spin4X" name="spin4X" value="0" size="5" /><br>
<label for="spin4Y">Y</label>
<input id="spin4Y" name="spin4Y" value="0" size="5" /><br>
<label for="spin4H">H</label>
<input id="spin4H" name="spin4H" value="50" size="5" /><br>
<label for="spin4W">W</label>
<input id="spin4W" name="spin4W" value="50" size="5" /><br>
<label for="spin4R">R</label>
<input id="spin4R" name="spin4R" value="0" size="5" /><br>
</div>
</td>
</tr>
<tr>
<td colspan="2">数値はマウススクロールで操作できます<br>
各BOXの左上の赤いマークを中心に回転します<br>
各BOXをダブルクリックするとリセットされます</td>
</tr>
</table>
<div class="kakushiBOX">
</div>
<div class="hideInPrint" style="margin-left:50px; font-size:0.8em;">
<form>
<div>※BOXをドラッグして大まかな位置に配置し、右側のコントロールで微調整してください</div>
<div>※「CTRL+0」キーを押してブラウザの拡大率を100%にしてから印刷してください</div>
<div class="hideMessage" style="font-size:1.2em;">※この案内図の地図位置、BOXの配置は保存されません<br>
閉じる前に必ずPDF保存をしてください</div>
<input type="button" value="このページを印刷する" onclick="window.print();" />
</form>
<br>
</div>
</section>
<div class="rectBoxA" id="rectBox1A">
<div class="rectBoxB" id="rectBox1B">
<div class="rectBoxC hideRect" id="rectBox1C">
<div class="rectBoxD"></div>
<div class="hideMessage">BOX1</div>
</div>
</div>
</div>
<div class="rectBoxA" id="rectBox2A">
<div class="rectBoxB" id="rectBox2B">
<div class="rectBoxC hideRect" id="rectBox2C">
<div class="rectBoxD"></div>
<div class="hideMessage">BOX2</div>
</div>
</div>
</div>
<div class="rectBoxA" id="rectBox3A">
<div class="rectBoxB" id="rectBox3B">
<div class="rectBoxC hideRect" id="rectBox3C">
<div class="rectBoxD"></div>
<div class="hideMessage">BOX3</div>
</div>
</div>
</div>
<div class="rectBoxA" id="rectBox4A">
<div class="rectBoxB" id="rectBox4B">
<div class="rectBoxC hideRect" id="rectBox4C">
<div class="rectBoxD"></div>
<div class="hideMessage">BOX4</div>
</div>
</div>
</div>
<div id="ResultId" style="display:none">{{ResultId}}</div>
</body>
<script src="/pleasanter/myScripts/rectMove3.js"></script>
<script src="rectMove3.js"></script>
</html>