Anchor-x/ElmDemo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

改了页面好多bug，整合了一部分代码，提高了代码复用性

Browse Source
This commit is contained in:
myh
2023-06-21 17:16:37 +08:00
parent 2318325519
commit e2b274abbd
13 changed files with 126 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
UI/pages/orderList.html
View File

@@ -7,9 +7,11 @@
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>饿了么 我的订单</title>
<link rel="stylesheet" href="../css/output.css">
<link rel="stylesheet" href="../scss/orderList.scss">
<link rel="stylesheet" href="../scss/index.scss">
<link rel="stylesheet" href="../css/orderList.css">
<script src="../src/js/orderList.js"></script>
<link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2.15/dist/tailwind.min.css" rel="stylesheet">
<link rel="stylesheet" href="../css/orderList.css">
</head>
<body>
<div class="w-full h-full">
@@ -30,19 +32,19 @@
</p>
<div class="flex">
<p class="">&#165;49</p>
<button class="bg-[#FF9900FF] text-white rounded-[3px] ml-4 select-none cursor-pointer" onclick="location.href='order.html'">去支付</button>
<button class="ListBar" onclick="location.href='order.html'">去支付</button>
</div>
</div>
<ul class="w-full order-detailet" style="display: none">
<li class="w-full box-border py-[1vw] px-[4vw] text-[#666666FF] text-xl flex justify-between items-center">
<li class="TextBar">
<p class="">纯肉鲜肉（水饺） x 2</p>
<p class="">&#165;15</p>
</li>
<li class="w-full box-border py-[1vw] px-[4vw] text-[#666666FF] text-xl flex justify-between items-center">
<li class="TextBar">
<p class="">玉米鲜肉（水饺） x 1</p>
<p class="">&#165;16</p>
</li>
<li class="w-full box-border py-[1vw] px-[4vw] text-[#666666FF] text-xl flex justify-between items-center">
<li class="TextBar">
<p class="">配送费</p>
<p class="">&#165;3</p>
</li>
@@ -50,26 +52,26 @@
</li>
<li class="w-full text-3xl">
<div class="box-border py-[2vw] px-[4vw] text-[#666666FF] flex justify-between items-center">
<div class="PageBar">
<p class="flex flex-row justify-between items-center">
小锅饭豆腐馆（全运店）
<svg class="fa-caret-down" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 32 32"><path fill="currentColor" d="m24 12l-8 10l-8-10z"/></svg>
</p>
<div class="flex">
<p class="">&#165;55</p>
<button class="bg-[#FF9900FF] text-white rounded-[3px] ml-4 select-none cursor-pointer" onclick="location.href='order.html'">去支付</button>
<button class="ListBar" onclick="location.href='order.html'">去支付</button>
</div>
</div>
<ul class="w-full order-detailet" style="display: none">
<li class="w-full box-border py-[1vw] px-[4vw] text-[#666666FF] text-xl flex justify-between items-center">
<li class="TextBar">
<p class="">纯肉鲜肉（水饺） x 2</p>
<p class="">&#165;15</p>
</li>
<li class="w-full box-border py-[1vw] px-[4vw] text-[#666666FF] text-xl flex justify-between items-center">
<li class="TextBar">
<p class="">玉米鲜肉（水饺） x 1</p>
<p class="">&#165;16</p>
</li>
<li class="w-full box-border py-[1vw] px-[4vw] text-[#666666FF] text-xl flex justify-between items-center">
<li class="TextBar">
<p class="">配送费</p>
<p class="">&#165;3</p>
</li>
@@ -80,26 +82,26 @@
<h3 class=" mt-24 box-border p-[4vw] text-3xl font-light text-[#999999FF]">已支付订单信息：</h3>
<ul class="w-full">
<li class="w-full text-3xl">
<div class="box-border py-[2vw] px-[4vw] text-[#666666FF] flex justify-between items-center">
<div class="PageBar">
<p class="flex flex-row justify-between items-center">
万家饺子（软件园E18店）
<svg class="fa-caret-down" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 32 32"><path fill="currentColor" d="m24 12l-8 10l-8-10z"/></svg>
</p>
<div class="flex">
<p class="">&#165;49</p>
<button class="bg-[#FF9900FF] text-white rounded-[3px] ml-4 select-none cursor-pointer" onclick="location.href='order.html'">去支付</button>
<button class="ListBar" onclick="location.href='order.html'">去支付</button>
</div>
</div>
<ul class="w-full order-detailet" style="display: none">
<li class="w-full box-border py-[1vw] px-[4vw] text-[#666666FF] text-xl flex justify-between items-center">
<li class="TextBar">
<p class="">纯肉鲜肉（水饺） x 2</p>
<p class="">&#165;15</p>
</li>
<li class="w-full box-border py-[1vw] px-[4vw] text-[#666666FF] text-xl flex justify-between items-center">
<li class="TextBar">
<p class="">玉米鲜肉（水饺） x 1</p>
<p class="">&#165;16</p>
</li>
<li class="w-full box-border py-[1vw] px-[4vw] text-[#666666FF] text-xl flex justify-between items-center">
<li class="TextBar">
<p class="">配送费</p>
<p class="">&#165;3</p>
</li>
@@ -107,26 +109,26 @@
</li>
<li class="w-full text-3xl">
<div class="box-border py-[2vw] px-[4vw] text-[#666666FF] flex justify-between items-center">
<div class="PageBar">
<p class="flex flex-row justify-between items-center">
小锅饭豆腐馆（全运店）
<svg class="fa-caret-down" xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 32 32"><path fill="currentColor" d="m24 12l-8 10l-8-10z"/></svg>
</p>
<div class="flex">
<p class="">&#165;55</p>
<button class="bg-[#FF9900FF] text-white rounded-[3px] ml-4 select-none cursor-pointer" onclick="location.href='order.html'">去支付</button>
<button class="ListBar" onclick="location.href='order.html'">去支付</button>
</div>
</div>
<ul class="w-full order-detailet" style="display: none">
<li class="w-full box-border py-[1vw] px-[4vw] text-[#666666FF] text-xl flex justify-between items-center">
<li class="TextBar">
<p class="">纯肉鲜肉（水饺） x 2</p>
<p class="">&#165;15</p>
</li>
<li class="w-full box-border py-[1vw] px-[4vw] text-[#666666FF] text-xl flex justify-between items-center">
<li class="TextBar">
<p class="">玉米鲜肉（水饺） x 1</p>
<p class="">&#165;16</p>
</li>
<li class="w-full box-border py-[1vw] px-[4vw] text-[#666666FF] text-xl flex justify-between items-center">
<li class="TextBar">
<p class="">配送费</p>
<p class="">&#165;3</p>
</li>
@@ -136,19 +138,19 @@
<!--底部菜单部分-->
<ul class="w-full h-24 border-t-[1px] border-solid border-t-[#DDDDDDFF] bg-white fixed left-0 bottom-0 flex justify-around items-center">
<li class="flex flex-col justify-center items-center text-[#999] select-none cursor-pointer">
<li class="BottomBar">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 10v9a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1v-9M6 10l6-6l6 6M6 10l-2 2m14-2l2 2m-10 1h4v4h-4v-4z"/></svg>
<p class="text-[2.8vw]">首页</p>
</li>
<li class="flex flex-col justify-center items-center text-[#999] select-none cursor-pointer">
<li class="BottomBar">
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 50 50"><path fill="currentColor" d="M25 49C11.766 49 1 38.233 1 25C1 11.766 11.766 1 25 1c13.233 0 24 10.766 24 24c0 13.233-10.767 24-24 24zm0-44C13.972 5 5 13.972 5 25s8.972 20 20 20s20-8.972 20-20S36.028 5 25 5zm.045 3.25S18 20.321 18 24v2c0 3.678 7.066 16 7.066 16S32 29.934 32 26.256v-2.262c0-3.679-6.955-15.744-6.955-15.744zM25 29a4 4 0 1 1 0-8a4 4 0 0 1 0 8z"/></svg>
<p class="text-[2.8vw]">发现</p>
</li>
<li class="flex flex-col justify-center items-center text-[#999] select-none cursor-pointer">
<li class="BottomBar">
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 24 24"><g id="feDocument0" fill="none" fill-rule="evenodd" stroke="none" stroke-width="1"><g id="feDocument1" fill="currentColor" fill-rule="nonzero"><path id="feDocument2" d="M15 4H6v16h12V7h-3V4ZM6 2h10l4 4v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2Zm2 9h8v2H8v-2Zm0 4h8v2H8v-2Z"/></g></g></svg>
<p class="text-[2.8vw]">订单</p>
</li>
<li class="flex flex-col justify-center items-center text-[#999] select-none cursor-pointer">
<li class="BottomBar">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18 19v-1.25c0-2.071-1.919-3.75-4.286-3.75h-3.428C7.919 14 6 15.679 6 17.75V19m9-11a3 3 0 1 1-6 0a3 3 0 0 1 6 0z"/></svg>
<p class="text-[2.8vw]">我的</p>
</li>