xieyinlu/zhilu-admin
1
0
Fork 0
mirror of https://github.com/ccmjga/zhilu-admin synced 2026-04-04 11:17:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

init response v1

Browse Source
This commit is contained in:
ccmjga
2025-06-02 15:05:54 +08:00
parent 6113667359
commit 2f73915844
31 changed files with 917 additions and 837 deletions
Download Patch File Download Diff File Expand all files Collapse all files

257
frontend/src/views/OverView.vue
View File

@@ -1,10 +1,10 @@
<template>
<div class="grid grid-cols-5 gap-4 p-4 ">
<div class="col-span-3 bg-white rounded-lg shadow-sm p-4 md:p-6">
<div class="flex justify-between pb-4 mb-4 border-b border-gray-200 ">
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 gap-2 sm:gap-4 p-2 sm:p-4">
<div class="lg:col-span-3 md:col-span-2 col-span-1 bg-white rounded-lg shadow-sm p-3 sm:p-4 md:p-6">
<div class="flex flex-col sm:flex-row sm:justify-between pb-4 mb-4 border-b border-gray-200 gap-y-3 sm:gap-y-0">
<div class="flex items-center">
<div class="w-12 h-12 rounded-lg bg-gray-100 flex items-center justify-center me-3">
<svg class="w-6 h-6 text-gray-500 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
<div class="w-10 h-10 sm:w-12 sm:h-12 rounded-lg bg-gray-100 flex items-center justify-center me-3">
<svg class="w-5 h-5 sm:w-6 sm:h-6 text-gray-500" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
fill="currentColor" viewBox="0 0 20 19">
<path
d="M14.5 0A3.987 3.987 0 0 0 11 2.1a4.977 4.977 0 0 1 3.9 5.858A3.989 3.989 0 0 0 14.5 0ZM9 13h2a4 4 0 0 1 4 4v2H5v-2a4 4 0 0 1 4-4Z" />
@@ -13,15 +13,15 @@
</svg>
</div>
<div>
<h5 class="leading-none text-2xl font-bold text-gray-900 pb-1">3.4k</h5>
<p class="text-sm font-normal text-gray-500 ">Leads generated per week</p>
<h5 class="leading-none text-xl sm:text-2xl font-bold text-gray-900 pb-1">3.4k</h5>
<p class="text-xs sm:text-sm font-normal text-gray-500">Leads generated per week</p>
</div>
</div>
<div>
<span
class="bg-green-100 text-green-800 text-xs font-medium inline-flex items-center px-2.5 py-1 rounded-md ">
<svg class="w-2.5 h-2.5 me-1.5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
viewBox="0 0 10 14">
class="bg-green-100 text-green-800 text-xs font-medium inline-flex items-center px-2 py-0.5 sm:px-2.5 sm:py-1 rounded-md">
<svg class="w-2 h-2 sm:w-2.5 sm:h-2.5 me-1.5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
fill="none" viewBox="0 0 10 14">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="M5 13V1m0 0L1 5m4-4 4 4" />
</svg>
@@ -30,34 +30,35 @@
</div>
</div>
<div class="grid grid-cols-2">
<div class="grid grid-cols-1 sm:grid-cols-2 gap-2 sm:gap-0">
<dl class="flex items-center">
<dt class="text-gray-500 text-sm font-normal me-1">Money spent:</dt>
<dd class="text-gray-900 text-sm font-semibold">$3,232</dd>
<dt class="text-gray-500 text-xs sm:text-sm font-normal me-1">Money spent:</dt>
<dd class="text-gray-900 text-xs sm:text-sm font-semibold">$3,232</dd>
</dl>
<dl class="flex items-center justify-end">
<dt class="text-gray-500 text-sm font-normal me-1">Conversion rate:</dt>
<dd class="text-gray-900 text-sm font-semibold">1.2%</dd>
<dl class="flex items-center sm:justify-end">
<dt class="text-gray-500 text-xs sm:text-sm font-normal me-1">Conversion rate:</dt>
<dd class="text-gray-900 text-xs sm:text-sm font-semibold">1.2%</dd>
</dl>
</div>
<div id="column-chart"></div>
<div class="grid grid-cols-1 items-center border-gray-200 border-t justify-between">
<div class="flex justify-between items-center pt-5">
<div id="column-chart" class="my-3 sm:my-4"></div>
<div class="grid grid-cols-1 items-center border-gray-200 border-t justify-between">
<div class="flex flex-col sm:flex-row justify-between items-center pt-3 sm:pt-5 gap-y-2 sm:gap-y-0">
<!-- Button -->
<button id="dropdownDefaultButton" data-dropdown-toggle="lastDaysdropdown" data-dropdown-placement="bottom"
class="text-sm font-medium text-gray-500 hover:text-gray-900 text-center inline-flex items-center "
class="text-xs sm:text-sm font-medium text-gray-500 hover:text-gray-900 text-center inline-flex items-center"
type="button">
Last 7 days
<svg class="w-2.5 m-2.5 ms-1.5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
<svg class="w-2 h-2 sm:w-2.5 m-2.5 ms-1.5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
viewBox="0 0 10 6">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="m1 1 4 4 4-4" />
</svg>
</button>
<!-- Dropdown menu -->
<div id="lastDaysdropdown" class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-sm w-44 ">
<ul class="py-2 text-sm text-gray-700 " aria-labelledby="dropdownDefaultButton">
<div id="lastDaysdropdown"
class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-sm w-36 sm:w-44">
<ul class="py-2 text-xs sm:text-sm text-gray-700" aria-labelledby="dropdownDefaultButton">
<li>
<a href="#" class="block px-4 py-2 hover:bg-gray-100 ">Yesterday</a>
</li>
@@ -90,111 +91,117 @@
</div>
</div>
</div>
<div class="col-span-1 bg-white border border-gray-200 rounded-lg shadow-sm sm:p-8 ">
<div
class="lg:col-span-2 md:col-span-1 col-span-1 bg-white border border-gray-200 rounded-lg shadow-sm p-3 sm:p-4 md:p-6">
<div class="flex items-center justify-between mb-4">
<h5 class="text-xl font-bold leading-none text-gray-900 ">Latest Customers</h5>
<a href="#" class="text-sm font-medium text-blue-600 hover:underline ">
<h5 class="text-lg sm:text-xl font-bold leading-none text-gray-900">Latest Customers</h5>
<a href="#" class="text-xs sm:text-sm font-medium text-blue-600 hover:underline">
View all
</a>
</div>
<div class="flow-root">
<ul role="list" class="divide-y divide-gray-200 ">
<li class="py-3 sm:py-4">
<ul role="list" class="divide-y divide-gray-200">
<li class="py-2 sm:py-3 md:py-4">
<div class="flex items-center">
<div class="shrink-0">
<img src="/trump.jpg" class="w-8 h-8 rounded-full" </div>
<div class="flex-1 min-w-0 ms-4">
<p class="text-sm font-medium text-gray-900 truncate ">
Neil Sims
</p>
<p class="text-sm text-gray-500 truncate ">
email@windster.com
</p>
</div>
<div class="inline-flex items-center text-base font-semibold text-gray-900 ">
$320
</div>
<img src="/trump.jpg" class="w-6 h-6 sm:w-8 sm:h-8 rounded-full" alt="Neil image" />
</div>
</li>
<li class="py-3 sm:py-4">
<div class="flex items-center ">
<div class="shrink-0">
<img src="/trump.jpg" class="w-8 h-8 rounded-full" </div>
<div class="flex-1 min-w-0 ms-4">
<p class="text-sm font-medium text-gray-900 truncate ">
Bonnie Green
</p>
<p class="text-sm text-gray-500 truncate ">
email@windster.com
</p>
</div>
<div class="inline-flex items-center text-base font-semibold text-gray-900 ">
$3467
</div>
<div class="flex-1 min-w-0 ms-3 sm:ms-4">
<p class="text-xs sm:text-sm font-medium text-gray-900 truncate">
Neil Sims
</p>
<p class="text-xs hidden xs:block sm:text-sm text-gray-500 truncate">
email@windster.com
</p>
</div>
<div class="inline-flex items-center text-sm sm:text-base font-semibold text-gray-900">
$320
</div>
</div>
</li>
<li class="py-3 sm:py-4">
<li class="py-2 sm:py-3 md:py-4">
<div class="flex items-center">
<div class="shrink-0">
<img src="/trump.jpg" class="w-8 h-8 rounded-full" </div>
<div class="flex-1 min-w-0 ms-4">
<p class="text-sm font-medium text-gray-900 truncate ">
Michael Gough
</p>
<p class="text-sm text-gray-500 truncate ">
email@windster.com
</p>
</div>
<div class="inline-flex items-center text-base font-semibold text-gray-900 ">
$67
</div>
<img src="/trump.jpg" class="w-6 h-6 sm:w-8 sm:h-8 rounded-full" alt="Bonnie image" />
</div>
<div class="flex-1 min-w-0 ms-3 sm:ms-4">
<p class="text-xs sm:text-sm font-medium text-gray-900 truncate">
Bonnie Green
</p>
<p class="text-xs hidden xs:block sm:text-sm text-gray-500 truncate">
email@windster.com
</p>
</div>
<div class="inline-flex items-center text-sm sm:text-base font-semibold text-gray-900">
$3467
</div>
</div>
</li>
<li class="py-3 sm:py-4">
<div class="flex items-center ">
<li class="py-2 sm:py-3 md:py-4">
<div class="flex items-center">
<div class="shrink-0">
<img src="/trump.jpg" class="w-8 h-8 rounded-full" </div>
<div class="flex-1 min-w-0 ms-4">
<p class="text-sm font-medium text-gray-900 truncate ">
Lana Byrd
</p>
<p class="text-sm text-gray-500 truncate ">
email@windster.com
</p>
</div>
<div class="inline-flex items-center text-base font-semibold text-gray-900 ">
$367
</div>
<img src="/trump.jpg" class="w-6 h-6 sm:w-8 sm:h-8 rounded-full" alt="Michael image" />
</div>
<div class="flex-1 min-w-0 ms-3 sm:ms-4">
<p class="text-xs sm:text-sm font-medium text-gray-900 truncate">
Michael Gough
</p>
<p class="text-xs hidden xs:block sm:text-sm text-gray-500 truncate">
email@windster.com
</p>
</div>
<div class="inline-flex items-center text-sm sm:text-base font-semibold text-gray-900">
$67
</div>
</div>
</li>
<li class="pt-3 pb-0 sm:pt-4">
<div class="flex items-center ">
<li class="py-2 sm:py-3 md:py-4">
<div class="flex items-center">
<div class="shrink-0">
<img src="/trump.jpg" class="w-8 h-8 rounded-full" </div>
<div class="flex-1 min-w-0 ms-4">
<p class="text-sm font-medium text-gray-900 truncate ">
Thomes Lean
</p>
<p class="text-sm text-gray-500 truncate ">
email@windster.com
</p>
</div>
<div class="inline-flex items-center text-base font-semibold text-gray-900 ">
$2367
</div>
<img src="/trump.jpg" class="w-6 h-6 sm:w-8 sm:h-8 rounded-full" alt="Lana image" />
</div>
<div class="flex-1 min-w-0 ms-3 sm:ms-4">
<p class="text-xs sm:text-sm font-medium text-gray-900 truncate">
Lana Byrd
</p>
<p class="text-xs hidden xs:block sm:text-sm text-gray-500 truncate">
email@windster.com
</p>
</div>
<div class="inline-flex items-center text-sm sm:text-base font-semibold text-gray-900">
$367
</div>
</div>
</li>
<li class="pt-2 sm:pt-3 md:pt-4 pb-0">
<div class="flex items-center">
<div class="shrink-0">
<img src="/trump.jpg" class="w-6 h-6 sm:w-8 sm:h-8 rounded-full" alt="Thomas image" />
</div>
<div class="flex-1 min-w-0 ms-3 sm:ms-4">
<p class="text-xs sm:text-sm font-medium text-gray-900 truncate">
Thomes Lean
</p>
<p class="text-xs hidden xs:block sm:text-sm text-gray-500 truncate">
email@windster.com
</p>
</div>
<div class="inline-flex items-center text-sm sm:text-base font-semibold text-gray-900">
$2367
</div>
</div>
</li>
</ul>
</div>
</div>
<div class="col-span-2 max-w-sm w-full bg-white rounded-lg shadow-sm p-4 md:p-6">
<div class="lg:col-span-2 md:col-span-2 col-span-1 bg-white rounded-lg shadow-sm p-3 sm:p-4 md:p-6">
<div class="flex justify-between items-start w-full">
<div class="flex flex-col sm:flex-row justify-between items-start w-full gap-y-3 sm:gap-y-0">
<div class="flex-col items-center">
<div class="flex items-center mb-1">
<h5 class="text-xl font-bold leading-none text-gray-900 me-1">Website traffic</h5>
<h5 class="text-lg sm:text-xl font-bold leading-none text-gray-900 me-1">Website traffic</h5>
<svg data-popover-target="chart-info" data-popover-placement="bottom"
class="w-3.5 h-3.5 text-gray-500 hover:text-gray-900 cursor-pointer ms-1" aria-hidden="true"
class="w-3 h-3 sm:w-3.5 sm:h-3.5 text-gray-500 hover:text-gray-900 cursor-pointer ms-1" aria-hidden="true"
xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="0 0 20 20">
<path
d="M10 .5a9.5 9.5 0 1 0 9.5 9.5A9.51 9.51 0 0 0 10 .5Zm0 16a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3Zm1-5.034V12a1 1 0 0 1-2 0v-1.418a1 1 0 0 1 1.038-.999 1.436 1.436 0 0 0 1.488-1.441 1.501 1.501 0 1 0-3-.116.986.986 0 0 1-1.037.961 1 1 0 0 1-.96-1.037A3.5 3.5 0 1 1 11 11.466Z" />
@@ -222,15 +229,15 @@
</div>
<button id="dateRangeButton" data-dropdown-toggle="dateRangeDropdown"
data-dropdown-ignore-click-outside-class="datepicker" type="button"
class="inline-flex items-center text-blue-700 font-medium hover:underline">31 Nov - 31
Dev <svg class="w-3 h-3 ms-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
viewBox="0 0 10 6">
class="inline-flex items-center text-blue-700 font-medium hover:underline text-xs sm:text-sm">31 Nov - 31
Dev <svg class="w-2.5 h-2.5 sm:w-3 sm:h-3 ms-2" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
fill="none" viewBox="0 0 10 6">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="m1 1 4 4 4-4" />
</svg>
</button>
<div id="dateRangeDropdown"
class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-sm w-80 lg:w-96 ">
class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-sm w-80 lg:w-96">
<div class="p-3" aria-labelledby="dateRangeButton">
<div date-rangepicker datepicker-autohide class="flex items-center">
<div class="relative">
@@ -265,15 +272,15 @@
<div class="flex justify-end items-center">
<button id="widgetDropdownButton" data-dropdown-toggle="widgetDropdown" data-dropdown-placement="bottom"
type="button"
class="inline-flex items-center justify-center text-gray-500 w-8 h-8 hover:bg-gray-100 focus:outline-none focus:ring-4 focus:ring-gray-200 rounded-lg text-sm"><svg
class="w-3.5 h-3.5 text-gray-800 " aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
class="inline-flex items-center justify-center text-gray-500 w-7 h-7 sm:w-8 sm:h-8 hover:bg-gray-100 focus:outline-none focus:ring-4 focus:ring-gray-200 rounded-lg text-sm">
<svg class="w-3 h-3 sm:w-3.5 sm:h-3.5 text-gray-800" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
fill="currentColor" viewBox="0 0 16 3">
<path
d="M2 0a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3Zm6.041 0a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3ZM14 0a1.5 1.5 0 1 1 0 3 1.5 1.5 0 0 1 0-3Z" />
</svg><span class="sr-only">Open dropdown</span>
</button>
<div id="widgetDropdown" class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-sm w-44 ">
<ul class="py-2 text-sm text-gray-700 " aria-labelledby="widgetDropdownButton">
<div id="widgetDropdown" class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-sm w-44">
<ul class="py-2 text-sm text-gray-700" aria-labelledby="widgetDropdownButton">
<li>
<a href="#" class="flex items-center px-4 py-2 hover:bg-gray-100 "><svg class="w-3 h-3 me-2"
aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 21 21">
@@ -314,48 +321,48 @@
</div>
<!-- Line Chart -->
<div class="py-6" id="pie-chart"></div>
<div class="py-4 sm:py-6" id="pie-chart"></div>
<div class="grid grid-cols-1 items-center border-gray-200 border-t justify-between">
<div class="flex justify-between items-center pt-5">
<div class="grid grid-cols-1 items-center border-gray-200 border-t justify-between">
<div class="flex flex-col sm:flex-row justify-between items-center pt-3 sm:pt-5 gap-y-2 sm:gap-y-0">
<!-- Button -->
<button id="dropdownDefaultButton" data-dropdown-toggle="lastDaysdropdown" data-dropdown-placement="bottom"
class="text-sm font-medium text-gray-500 hover:text-gray-900 text-center inline-flex items-center "
class="text-xs sm:text-sm font-medium text-gray-500 hover:text-gray-900 text-center inline-flex items-center"
type="button">
Last 7 days
<svg class="w-2.5 m-2.5 ms-1.5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none"
viewBox="0 0 10 6">
<svg class="w-2 h-2 sm:w-2.5 sm:h-2.5 m-2.5 ms-1.5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
fill="none" viewBox="0 0 10 6">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="m1 1 4 4 4-4" />
</svg>
</button>
<div id="lastDaysdropdown" class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-sm w-44 ">
<ul class="py-2 text-sm text-gray-700 " aria-labelledby="dropdownDefaultButton">
<div id="lastDaysdropdown" class="z-10 hidden bg-white divide-y divide-gray-100 rounded-lg shadow-sm w-44">
<ul class="py-2 text-xs sm:text-sm text-gray-700" aria-labelledby="dropdownDefaultButton">
<li>
<a href="#" class="block px-4 py-2 hover:bg-gray-100 ">Yesterday</a>
<a href="#" class="block px-4 py-2 hover:bg-gray-100">Yesterday</a>
</li>
<li>
<a href="#" class="block px-4 py-2 hover:bg-gray-100 ">Today</a>
<a href="#" class="block px-4 py-2 hover:bg-gray-100">Today</a>
</li>
<li>
<a href="#" class="block px-4 py-2 hover:bg-gray-100 ">Last
<a href="#" class="block px-4 py-2 hover:bg-gray-100">Last
7 days</a>
</li>
<li>
<a href="#" class="block px-4 py-2 hover:bg-gray-100 ">Last
<a href="#" class="block px-4 py-2 hover:bg-gray-100">Last
30 days</a>
</li>
<li>
<a href="#" class="block px-4 py-2 hover:bg-gray-100 ">Last
<a href="#" class="block px-4 py-2 hover:bg-gray-100">Last
90 days</a>
</li>
</ul>
</div>
<a href="#"
class="uppercase text-sm font-semibold inline-flex items-center rounded-lg text-blue-600 hover:text-blue-700 hover:bg-gray-100 px-3 py-2">
class="uppercase text-xs sm:text-sm font-semibold inline-flex items-center rounded-lg text-blue-600 hover:text-blue-700 hover:bg-gray-100 px-3 py-2">
Traffic analysis
<svg class="w-2.5 h-2.5 ms-1.5 rtl:rotate-180" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
fill="none" viewBox="0 0 6 10">
<svg class="w-2 h-2 sm:w-2.5 sm:h-2.5 ms-1.5 rtl:rotate-180" aria-hidden="true"
xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 6 10">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
d="m1 9 4-4-4-4" />
</svg>