m94fc2tgb
/
HTML
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

ADD file via upload

Browse Source
master
m94fc2tgb 8 months ago
parent 068fefa1b5
commit 2800374480
1 changed files with 428 additions and 0 deletions
Show Stats Download Patch File Download Diff File

428
src/frame.html
Unescape View File

@ -0,0 +1,428 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>药品管理系统</title>
<style>
html, body
{
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}
.container {
display: flex;
background-color: #131212; /* 设置背景颜色为红色 */
width: 100%; /* 设置div的宽度 */
height: 100%; /* 设置div的高度 */
}
.box1
{
width: 10%; /* 设置div的宽度 */
height: 100%; /* 设置div的高度 */
--color: #E1E1E1;
background-color: #F3F3F3;
background-image: linear-gradient(0deg, transparent 24%, var(--color) 25%, var(--color) 26%, transparent 27%,transparent 74%, var(--color) 75%, var(--color) 76%, transparent 77%,transparent),
linear-gradient(90deg, transparent 24%, var(--color) 25%, var(--color) 26%, transparent 27%,transparent 74%, var(--color) 75%, var(--color) 76%, transparent 77%,transparent);
background-size: 55px 55px;
}
.box2
{
width: 90%; /* 设置div的宽度 */
height: 100%; /* 设置div的高度 */
background-color: #ffffff;
background-image: radial-gradient(rgba(12, 12, 12, 0.171) 2px, transparent 0);
background-size: 30px 30px;
background-position: -5px -5px;
}
.box3
{
width: 100%; /* 设置div的宽度 */
height: 7%; /* 设置div的高度 */
padding: 1px;
/* text-align: left;
align-items: center; */
--s: 100px; /* control the size */
--c1: #dadee1;
--c2: #b3c2c7;
--c3: #f6fdf9;
--_c: 75%, var(--c3) 52.72deg, #0000 0;
--_g1: conic-gradient(from -116.36deg at 25% var(--_c));
--_g2: conic-gradient(from 63.43deg at 75% var(--_c));
background: var(--_g1), var(--_g1) calc(3 * var(--s)) calc(var(--s) / 2),
var(--_g2), var(--_g2) calc(3 * var(--s)) calc(var(--s) / 2),
conic-gradient(
var(--c2) 63.43deg,
var(--c1) 0 116.36deg,
var(--c2) 0 180deg,
var(--c1) 0 243.43deg,
var(--c2) 0 296.15deg,
var(--c1) 0
);
background-size: calc(2 * var(--s)) var(--s);
}
.box4
{
width: 100%; /* 设置div的宽度 */
height: 93%; /* 设置div的高度 */
background-color: #ffffff;
background-image: radial-gradient(rgba(12, 12, 12, 0.171) 2px, transparent 0);
background-size: 30px 30px;
background-position: -5px -5px;
}
.cta {
position: relative;
margin: auto;
padding: 12px 18px;
transition: all 0.2s ease;
border: none;
background: none;
cursor: pointer;
width: 100%;
}
.cta:before {
content: "";
position: absolute;
top: 0;
left: 0;
display: block;
border-radius: 50px;
background: #b1dae7;
width: 45px;
height: 45px;
transition: all 0.3s ease;
}
.cta span {
position: relative;
font-family: "Ubuntu", sans-serif;
font-size: 18px;
font-weight: 700;
letter-spacing: 0.05em;
color: #234567;
}
.cta svg {
position: relative;
top: 0;
margin-left: 10px;
fill: none;
stroke-linecap: round;
stroke-linejoin: round;
stroke: #234567;
stroke-width: 2;
transform: translateX(-5px);
transition: all 0.3s ease;
}
.cta:hover:before {
width: 100%;
background: #b1dae7;
}
.cta:hover svg {
transform: translateX(0);
}
.cta:active {
transform: scale(0.95);
}
.btn {
width: 100%;
background-color: #00BFA6;
padding: 14px 40px;
color: #fff;
text-transform: uppercase;
letter-spacing: 2px;
cursor: pointer;
border-radius: 10px;
border: 2px dashed #00BFA6;
box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
transition: .4s;
}
.btn span:last-child {
display: none;
}
.btn:hover {
transition: .4s;
border: 2px dashed #00BFA6;
background-color: #fff;
color: #00BFA6;
}
.btn:active {
background-color: #87dbd0;
}
</style>
</head>
<body>
<!-- <div class="box3">
<h2>药品管理系统</h2>
</div> -->
<div class="container">
<div id="caidan" class="box1" >
<h1></h1>
<button class="cta" onclick="jumphome()" >
<span>首页</span>
<svg width="15px" height="10px" viewBox="0 0 13 10">
<path d="M1,5 L11,5"></path>
<polyline points="8 1 12 5 8 9"></polyline>
</svg>
</button>
<h1></h1>
<button class="cta" onclick="jumpmain()">
<span>药品基本操作</span>
<svg width="15px" height="10px" viewBox="0 0 13 10">
<path d="M1,5 L11,5"></path>
<polyline points="8 1 12 5 8 9"></polyline>
</svg>
</button>
<h1></h1>
<button class="cta" onclick="jumptype()">
<span>药品分类信息</span>
<svg width="15px" height="10px" viewBox="0 0 13 10">
<path d="M1,5 L11,5"></path>
<polyline points="8 1 12 5 8 9"></polyline>
</svg>
</button>
<button id="type1" style="display: none;" class="btn" onclick="jumptype1()">骨科用药</button>
<button id="type2" style="display: none;" class="btn" onclick="jumptype2()">眼科用药</button>
<button id="type3" style="display: none;" class="btn" onclick="jumptype3()">皮肤科用药</button>
<button id="type4" style="display: none;" class="btn" onclick="jumptype4()">呼吸系统药</button>
<button id="type5" style="display: none;" class="btn" onclick="jumptype5()">消化系统药</button>
<button id="type6" style="display: none;" class="btn" onclick="jumptype6()">心血管系统药</button>
<h1> </h1>
<button class="cta" onclick="jumpjin()">
<span>进库药品统计</span>
<svg width="15px" height="10px" viewBox="0 0 13 10">
<path d="M1,5 L11,5"></path>
<polyline points="8 1 12 5 8 9"></polyline>
</svg>
</button>
<h1></h1>
<button class="cta" onclick="jumpchu()">
<span>出库药品统计</span>
<svg width="15px" height="10px" viewBox="0 0 13 10">
<path d="M1,5 L11,5"></path>
<polyline points="8 1 12 5 8 9"></polyline>
</svg>
</button>
<h1></h1>
<button class="cta" onclick="jumpanlyse()" >
<span>药品统计</span>
<svg width="15px" height="10px" viewBox="0 0 13 10">
<path d="M1,5 L11,5"></path>
<polyline points="8 1 12 5 8 9"></polyline>
</svg>
</button>
<h1></h1>
<button class="cta" onclick="jumpin()" >
<span>导入药品信息</span>
<svg width="15px" height="10px" viewBox="0 0 13 10">
<path d="M1,5 L11,5"></path>
<polyline points="8 1 12 5 8 9"></polyline>
</svg>
</button>
<h1></h1>
<button class="cta" onclick="jumpout()" >
<span>导出药品信息</span>
<svg width="15px" height="10px" viewBox="0 0 13 10">
<path d="M1,5 L11,5"></path>
<polyline points="8 1 12 5 8 9"></polyline>
</svg>
</button>
</div>
<div class="box2">
<div class="box3">
<h2 id="heaer">药品管理系统〉首页</h2>
</div>
<div id="neirong" class="box4">
<iframe id="sonpage" src="../src/Home-page/Home-page.html" width="100%" height="100%"></iframe>
</div>
</div>
</div>
</body>
<script>
function jumphome(){
var iframe = document.getElementById('sonpage');
iframe.src = "../src/Home-page/Home-page.html";
document.getElementById('heaer').textContent = '药品管理系统〉首页';
}
function jumpmain(){
var iframe = document.getElementById('sonpage');
iframe.src = "../src/Basic-information/Basic-information-1.html";
document.getElementById('heaer').textContent = '药品管理系统〉药品基本操作';
}
function jumpjin(){
var iframe = document.getElementById('sonpage');
iframe.src = "../src/Income-statistics/Income-statistics.html";
document.getElementById('heaer').textContent = '药品管理系统〉进库药品统计';
}
function jumpchu(){
var iframe = document.getElementById('sonpage');
iframe.src = "../src/Outbound-statistics/Outbound-statistics.html";
document.getElementById('heaer').textContent = '药品管理系统〉出库药品统计';
}
function jumpout(){
var iframe = document.getElementById('sonpage');
iframe.src = "../src/Export-information/Export-information.html";
document.getElementById('heaer').textContent = '药品管理系统〉导出药品信息';
}
function jumpin(){
var iframe = document.getElementById('sonpage');
iframe.src = "../src/Import-information/Import-information.html";
document.getElementById('heaer').textContent = '药品管理系统〉导入药品信息';
}
function jumpanlyse(){
var iframe = document.getElementById('sonpage');
iframe.src = "../src/Information-statistics/Information-statistics.html";
document.getElementById('heaer').textContent = '药品管理系统〉药品统计';
}
function jumptype1(){
var iframe = document.getElementById('sonpage');
iframe.src = "../src/Orthopedic-medication/Orthopedic-medication.html";
document.getElementById('heaer').textContent = '药品管理系统〉药品分类信息〉骨科用药';
}
function jumptype2(){
var iframe = document.getElementById('sonpage');
iframe.src = "../src/Ophthalmic-medication/Ophthalmic-medication.html";
document.getElementById('heaer').textContent = '药品管理系统〉药品分类信息〉眼科用药';
}
function jumptype3(){
var iframe = document.getElementById('sonpage');
iframe.src = "../src/Dermatological-medication/Dermatological-medication.html";
document.getElementById('heaer').textContent = '药品管理系统〉药品分类信息〉皮肤科用药';
}
function jumptype4(){
var iframe = document.getElementById('sonpage');
iframe.src = "../src/Respiratory-system-medication/Respiratory-system-medication.html";
document.getElementById('heaer').textContent = '药品管理系统〉药品分类信息〉呼吸系统药';
}
function jumptype5(){
var iframe = document.getElementById('sonpage');
iframe.src = "../src/Digestive-system-drugs/Digestive-system-drugs.html";
document.getElementById('heaer').textContent = '药品管理系统〉药品分类信息〉消化系统药';
}
function jumptype6(){
var iframe = document.getElementById('sonpage');
iframe.src = "../src/Cardiovascular-system-drugs/Cardiovascular-system-drugs.html";
document.getElementById('heaer').textContent = '药品管理系统〉药品分类信息〉心血管系统药';
}
function jumptype(){
if (document.getElementById('type1').style.display == 'none'){
document.getElementById('type1').style.display = 'block';
}
else if (document.getElementById('type1').style.display == 'block'){
document.getElementById('type1').style.display = 'none';
}
if (document.getElementById('type2').style.display == 'none'){
document.getElementById('type2').style.display = 'block';
}
else if (document.getElementById('type2').style.display == 'block'){
document.getElementById('type2').style.display = 'none';
}
if (document.getElementById('type3').style.display == 'none'){
document.getElementById('type3').style.display = 'block';
}
else if (document.getElementById('type3').style.display == 'block'){
document.getElementById('type3').style.display = 'none';
}
if (document.getElementById('type4').style.display == 'none'){
document.getElementById('type4').style.display = 'block';
}
else if (document.getElementById('type4').style.display == 'block'){
document.getElementById('type4').style.display = 'none';
}
if (document.getElementById('type5').style.display == 'none'){
document.getElementById('type5').style.display = 'block';
}
else if (document.getElementById('type5').style.display == 'block'){
document.getElementById('type5').style.display = 'none';
}
if (document.getElementById('type6').style.display == 'none'){
document.getElementById('type6').style.display = 'block';
}
else if (document.getElementById('type6').style.display == 'block'){
document.getElementById('type6').style.display = 'none';
}
document.getElementById('heaer').textContent = '药品管理系统〉药品分类信息';
}
</script>
</html>
Write Preview
Loading…
Cancel
Save