From 2f441ec06d67353f67d2ead047a165ae943c9e6a Mon Sep 17 00:00:00 2001
From: maochaoying <925670706@qq.com>
Date: Thu, 3 Aug 2023 18:27:59 +0800
Subject: [PATCH] =?UTF-8?q?=E7=94=A8=E6=88=B7=E7=AE=A1=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/Setting.vue                   |  33 ------
 src/components/Setting/components/Admin.vue  |  75 ++++++++++++++
 src/components/Setting/components/Date.vue   |   7 ++
 src/components/Setting/components/Device.vue |  69 +++++++++++++
 src/components/Setting/components/User.vue   | 144 +++++++++++++++++++++++++++
 src/components/Setting/index.vue             | 124 +++++++++++++++++++++++
 6 files changed, 419 insertions(+), 33 deletions(-)
 delete mode 100644 src/components/Setting.vue
 create mode 100644 src/components/Setting/components/Admin.vue
 create mode 100644 src/components/Setting/components/Date.vue
 create mode 100644 src/components/Setting/components/Device.vue
 create mode 100644 src/components/Setting/components/User.vue
 create mode 100644 src/components/Setting/index.vue

diff --git a/src/components/Setting.vue b/src/components/Setting.vue
deleted file mode 100644
index c892ab2..0000000
--- a/src/components/Setting.vue
+++ /dev/null
@@ -1,33 +0,0 @@
-<template>
-  <div class="setting_contaienr">
-    <div class="left_container"></div>
-    <div class="right_container"></div>
-  </div>
-</template>
-
-<script setup></script>
-
-<style lang="scss" scoped>
-.setting_contaienr {
-  display: flex;
-  align-items: center;
-  margin-bottom: 30px;
-  height: 580px;
-  box-sizing: border-box;
-  .left_container {
-    height: 580px;
-    width: 424px;
-    margin-right: 30px;
-    box-sizing: border-box;
-    border-radius: 16px;
-    background: #ffffff;
-  }
-  .right_container {
-    height: 580px;
-    flex: 1;
-    box-sizing: border-box;
-    border-radius: 16px;
-    background: #ffffff;
-  }
-}
-</style>
diff --git a/src/components/Setting/components/Admin.vue b/src/components/Setting/components/Admin.vue
new file mode 100644
index 0000000..b100257
--- /dev/null
+++ b/src/components/Setting/components/Admin.vue
@@ -0,0 +1,75 @@
+<template>
+  <div class="admin_password_container">
+    <div class="title_wrap">
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        xmlns:xlink="http://www.w3.org/1999/xlink"
+        fill="none"
+        version="1.1"
+        width="189.5126953125"
+        height="29"
+        viewBox="0 0 189.5126953125 29"
+      >
+        <g>
+          <g>
+            <g>
+              <path
+                d="M55.41275634765625,15.4837C54.37275634765625,16.4844,52.39275634765625,17.365,50.65275634765625,17.8453C51.01275634765625,18.1453,51.43275634765625,18.6056,51.67275634765625,18.9659C53.57275634765625,18.3456,55.59275634765625,17.345,56.83275634765625,16.0641L55.41275634765625,15.4837ZM57.35275634765625,17.445C56.01275634765625,18.8459,53.37275634765625,19.9066,50.85275634765625,20.4669C51.21275634765625,20.7872,51.57275634765625,21.3075,51.79275634765625,21.6875C54.51275634765625,20.9672,57.19275634765625,19.7262,58.73275634765625,18.0253L57.35275634765625,17.445ZM59.032756347656246,19.6462C57.27275634765625,21.6275,53.69275634765625,22.8284,49.79275634765625,23.3687C50.17275634765625,23.7691,50.57275634765625,24.4294,50.77275634765625,24.8697C54.95275634765625,24.1291,58.632756347656255,22.7484,60.65275634765625,20.3269L59.032756347656246,19.6462ZM47.57275634765625,11.9612L47.57275634765625,21.6475L49.15275634765625,21.6475L49.15275634765625,15.1034C49.43275634765625,15.4437,49.75275634765625,15.9841,49.89275634765625,16.3441C51.81275634765625,15.9041,53.67275634765625,15.2434,55.29275634765625,14.3028C56.59275634765625,15.1234,58.17275634765625,15.8037,59.992756347656254,16.2241C60.21275634765625,15.7837,60.69275634765625,15.0634,61.032756347656246,14.7231C59.41275634765625,14.4231,57.992756347656254,13.9228,56.77275634765625,13.3022C58.23275634765625,12.1616,59.41275634765625,10.7206,60.15275634765625,8.9L59.05275634765625,8.38L58.772756347656255,8.44L53.67275634765625,8.44C53.97275634765625,7.87813,54.23275634765625,7.31625,54.45275634765625,6.73406L52.73275634765625,6.3125C51.93275634765625,8.42,50.55275634765625,10.4403,48.95275634765625,11.7413C49.37275634765625,11.9816,50.07275634765625,12.5419,50.39275634765625,12.8419C50.91275634765625,12.3616,51.43275634765625,11.8012,51.93275634765625,11.1609C52.43275634765625,11.9012,53.09275634765625,12.6219,53.89275634765625,13.2822C52.45275634765625,14.0228,50.81275634765625,14.5631,49.15275634765625,14.9034L49.15275634765625,11.9612L47.57275634765625,11.9612ZM52.87275634765625,9.98L57.752756347656245,9.98C57.13275634765625,10.9206,56.29275634765625,11.7413,55.31275634765625,12.4216C54.27275634765625,11.6812,53.43275634765625,10.8406,52.87275634765625,9.98ZM46.032756347656246,6.43312C45.09275634765625,9.46,43.55275634765625,12.4619,41.87275634765625,14.4231C42.17275634765625,14.9034,42.65275634765625,15.9641,42.81275634765625,16.4244C43.35275634765625,15.8037,43.87275634765625,15.0834,44.37275634765625,14.2828L44.37275634765625,24.9097L46.17275634765625,24.9097L46.17275634765625,10.9806C46.79275634765625,9.66,47.33275634765625,8.29969,47.77275634765625,6.935L46.032756347656246,6.43312ZM74.99275634765624,11.74L78.69275634765626,11.74C78.33275634765624,14.12,77.77275634765624,16.1609,76.91275634765626,17.8628C76.01275634765625,16.1209,75.37275634765625,14.08,74.93275634765625,11.9L74.99275634765624,11.74ZM64.15275634765625,7.66L64.15275634765625,9.54L69.51275634765625,9.54L69.51275634765625,13.4L64.37275634765625,13.4L64.37275634765625,20.9656C64.37275634765625,21.7062,64.05275634765624,21.9866,63.71275634765625,22.1469C64.01275634765625,22.6272,64.33275634765624,23.5881,64.43275634765625,24.1087C64.95275634765625,23.6884,65.77275634765626,23.2878,71.59275634765625,21.0656C71.49275634765625,20.6453,71.39275634765625,19.8447,71.37275634765625,19.2841L66.29275634765625,21.0859L66.29275634765625,15.26L71.39275634765625,15.26C71.79275634765625,15.6206,72.33275634765624,16.1609,72.55275634765624,16.4613C72.99275634765625,15.8606,73.41275634765626,15.2,73.79275634765625,14.46C74.31275634765625,16.3812,74.95275634765625,18.1428,75.79275634765625,19.6644C74.65275634765625,21.1859,73.13275634765625,22.3669,71.13275634765625,23.2478C71.49275634765625,23.6681,72.05275634765624,24.5291,72.23275634765625,24.9897C74.15275634765625,24.0487,75.69275634765626,22.8475,76.91275634765626,21.3859C77.97275634765626,22.8275,79.29275634765625,23.9884,80.89275634765625,24.8094C81.17275634765625,24.3088,81.75275634765626,23.5681,82.19275634765626,23.2078C80.51275634765625,22.4472,79.15275634765625,21.2459,78.05275634765624,19.7444C79.35275634765625,17.6025,80.17275634765625,14.96,80.69275634765626,11.74L81.81275634765625,11.74L81.81275634765625,9.98L75.59275634765625,9.98C75.91275634765626,8.9,76.19275634765626,7.8,76.41275634765626,6.65531L74.55275634765624,6.31344C73.95275634765625,9.54,72.91275634765626,12.64,71.39275634765625,14.7L71.39275634765625,7.66L64.15275634765625,7.66ZM87.99275634765624,14.46L87.99275634765624,24.925L89.91275634765626,24.925L89.91275634765626,24.3L99.07275634765625,24.3L99.07275634765625,24.9047L100.95275634765625,24.9047L100.95275634765625,19.86L89.91275634765626,19.86L89.91275634765626,18.68L99.89275634765625,18.68L99.89275634765625,14.46L87.99275634765624,14.46ZM99.07275634765625,22.88L89.91275634765626,22.88L89.91275634765626,21.28L99.07275634765625,21.28L99.07275634765625,22.88ZM92.55275634765624,10.7181C92.75275634765626,11.0988,92.97275634765626,11.5394,93.13275634765625,11.94L85.69275634765626,11.94L85.69275634765626,15.34L87.51275634765625,15.34L87.51275634765625,13.38L100.43275634765625,13.38L100.43275634765625,15.34L102.37275634765625,15.34L102.37275634765625,11.94L95.05275634765624,11.94C94.85275634765625,11.4394,94.55275634765624,10.8384,94.23275634765625,10.3778L92.55275634765624,10.7181ZM89.91275634765626,15.86L98.03275634765626,15.86L98.03275634765626,17.28L89.91275634765626,17.28L89.91275634765626,15.86ZM87.19275634765626,6.21281C86.67275634765625,7.94,85.77275634765624,9.66,84.65275634765625,10.76C85.11275634765624,10.96,85.91275634765626,11.38,86.27275634765624,11.62C86.85275634765625,10.98,87.41275634765626,10.14,87.91275634765626,9.22L89.01275634765625,9.22C89.49275634765624,9.96,89.93275634765625,10.84,90.13275634765625,11.42L91.73275634765625,10.86C91.57275634765625,10.42,91.23275634765625,9.8,90.87275634765625,9.22L93.69275634765626,9.22L93.69275634765626,7.88L88.55275634765624,7.88C88.73275634765625,7.45844,88.89275634765625,7.01625,89.03275634765626,6.57438L87.19275634765626,6.21281ZM95.71275634765625,6.23281C95.35275634765625,7.67937,94.65275634765625,9.12,93.73275634765625,10.0406C94.17275634765625,10.2606,94.95275634765625,10.6609,95.29275634765625,10.9212C95.71275634765625,10.4409,96.09275634765625,9.88062,96.45275634765625,9.24L97.59275634765625,9.24C98.19275634765626,9.98062,98.81275634765625,10.9012,99.05275634765624,11.4816L100.59275634765625,10.7812C100.39275634765625,10.3609,100.01275634765625,9.78062,99.57275634765625,9.24L102.81275634765625,9.24L102.81275634765625,7.88L97.09275634765625,7.88C97.27275634765624,7.45844,97.43275634765625,7.01625,97.55275634765624,6.57438L95.71275634765625,6.23281ZM114.95275634765625,12.54L117.59275634765625,12.54L117.59275634765625,14.74L114.95275634765625,14.74L114.95275634765625,12.54ZM119.21275634765625,12.54L121.79275634765625,12.54L121.79275634765625,14.74L119.21275634765625,14.74L119.21275634765625,12.54ZM114.95275634765625,8.84L117.59275634765625,8.84L117.59275634765625,11.02L114.95275634765625,11.02L114.95275634765625,8.84ZM119.21275634765625,8.84L121.79275634765625,8.84L121.79275634765625,11.02L119.21275634765625,11.02L119.21275634765625,8.84ZM111.57275634765625,22.54L111.57275634765625,24.26L124.51275634765625,24.26L124.51275634765625,22.54L119.35275634765625,22.54L119.35275634765625,20.14L123.85275634765625,20.14L123.85275634765625,18.42L119.35275634765625,18.42L119.35275634765625,16.36L123.59275634765625,16.36L123.59275634765625,7.22L113.23275634765625,7.22L113.23275634765625,16.36L117.43275634765625,16.36L117.43275634765625,18.42L113.05275634765626,18.42L113.05275634765626,20.14L117.43275634765625,20.14L117.43275634765625,22.54L111.57275634765625,22.54ZM105.71275634765625,21L106.17275634765625,22.94C107.99275634765625,22.34,110.35275634765625,21.54,112.53275634765625,20.8L112.21275634765625,19L110.11275634765624,19.68L110.11275634765624,15.12L112.05275634765626,15.12L112.05275634765626,13.38L110.11275634765624,13.38L110.11275634765624,9.36L112.35275634765625,9.36L112.35275634765625,7.6L105.93275634765625,7.6L105.93275634765625,9.36L108.31275634765625,9.36L108.31275634765625,13.38L106.13275634765625,13.38L106.13275634765625,15.12L108.31275634765625,15.12L108.31275634765625,20.245C107.35275634765625,20.54,106.45275634765625,20.8,105.71275634765625,21ZM131.99275634765627,8.82L140.69275634765626,8.82L140.69275634765626,10.76L131.99275634765627,10.76L131.99275634765627,8.82ZM130.01275634765625,7.2L130.01275634765625,12.4L142.77275634765624,12.4L142.77275634765624,7.2L130.01275634765625,7.2ZM135.17275634765625,16.8412L135.17275634765625,18.6431C135.17275634765625,20.1247,134.59275634765623,22.1466,127.53275634765625,23.4881C127.99275634765625,23.8884,128.55275634765627,24.6091,128.79275634765625,25.0297C136.17275634765625,23.3878,137.23275634765625,20.8053,137.23275634765625,18.6831L137.23275634765625,16.8412L135.17275634765625,16.8412ZM136.95275634765625,22.1266C139.33275634765624,22.9275,142.57275634765625,24.1887,144.21275634765624,25.0097L145.17275634765625,23.4078C143.45275634765625,22.6072,140.17275634765625,21.4259,137.87275634765626,20.7253L136.95275634765625,22.1266ZM129.25275634765626,13.96L129.25275634765626,21.3459L131.19275634765626,21.3459L131.19275634765626,15.72L141.57275634765625,15.72L141.57275634765625,21.1456L143.61275634765624,21.1456L143.61275634765624,13.96L129.25275634765626,13.96ZM151.01275634765625,12.1C150.47275634765623,13.3,149.51275634765625,14.7,148.39275634765625,15.56L149.91275634765626,16.48C151.05275634765627,15.54,151.91275634765626,14.04,152.55275634765627,12.78L151.01275634765625,12.1ZM154.39275634765625,10.82C155.63275634765625,11.34,157.11275634765624,12.22,157.85275634765625,12.88L158.81275634765626,11.68C158.05275634765627,11.02,156.53275634765623,10.2,155.31275634765626,9.7L154.39275634765625,10.82ZM162.01275634765625,13.12C163.25275634765626,14.24,164.67275634765625,15.82,165.29275634765625,16.86L166.73275634765625,15.82C166.07275634765625,14.78,164.59275634765623,13.26,163.37275634765626,12.22L162.01275634765625,13.12ZM161.11275634765624,10.38C159.67275634765625,12.16,157.57275634765625,13.66,155.15275634765624,14.86L155.15275634765624,11.84L153.45275634765625,11.84L153.45275634765625,15.5L153.45275634765625,15.64C151.77275634765624,16.34,149.99275634765627,16.9,148.19275634765626,17.34C148.53275634765623,17.72,149.05275634765627,18.5,149.27275634765624,18.9C150.87275634765626,18.44,152.47275634765623,17.88,154.03275634765623,17.22C154.47275634765623,17.54,155.19275634765626,17.66,156.37275634765626,17.66C156.83275634765624,17.66,159.89275634765625,17.66,160.39275634765625,17.66C162.25275634765626,17.66,162.77275634765624,17.08,162.99275634765627,14.6987C162.51275634765625,14.5987,161.81275634765626,14.3584,161.43275634765627,14.0781C161.35275634765625,15.88,161.17275634765625,16.16,160.25275634765626,16.16C159.55275634765627,16.16,157.01275634765625,16.16,156.49275634765627,16.16L156.25275634765626,16.16C158.79275634765625,14.8391,161.05275634765627,13.1772,162.71275634765624,11.1753L161.11275634765624,10.38ZM150.63275634765625,19.26L150.63275634765625,24.06L162.63275634765625,24.06L162.63275634765625,24.825L164.53275634765623,24.825L164.53275634765623,19.02L162.63275634765625,19.02L162.63275634765625,22.28L158.43275634765627,22.28L158.43275634765627,18.24L156.51275634765625,18.24L156.51275634765625,22.28L152.49275634765627,22.28L152.49275634765627,19.26L150.63275634765625,19.26ZM156.15275634765624,6.39344C156.31275634765626,6.87562,156.49275634765627,7.43781,156.61275634765624,7.96L148.99275634765627,7.96L148.99275634765627,12L150.85275634765625,12L150.85275634765625,9.64L164.15275634765624,9.64L164.15275634765624,12L166.07275634765625,12L166.07275634765625,7.96L158.57275634765625,7.96C158.43275634765627,7.37781,158.21275634765624,6.65469,157.95275634765625,6.09219L156.15275634765624,6.39344ZM176.99275634765624,19.02L176.99275634765624,20.7L184.41275634765626,20.7L184.41275634765626,19.02L176.99275634765624,19.02ZM178.49275634765624,10.2C178.35275634765625,12.26,178.07275634765625,15,177.81275634765626,16.68L185.67275634765625,16.68C185.33275634765624,20.76,184.91275634765626,22.44,184.41275634765626,22.92C184.23275634765625,23.14,184.01275634765625,23.18,183.69275634765626,23.16C183.31275634765626,23.16,182.47275634765626,23.16,181.57275634765625,23.06C181.85275634765625,23.54,182.05275634765624,24.28,182.07275634765625,24.78C183.05275634765624,24.8409,183.95275634765625,24.8206,184.47275634765626,24.78C185.11275634765624,24.72,185.53275634765626,24.56,185.95275634765625,24.08C186.65275634765624,23.34,187.11275634765624,21.2,187.53275634765626,15.86C187.57275634765625,15.6,187.59275634765626,15.06,187.59275634765626,15.06L185.23275634765625,15.06C185.55275634765624,12.56,185.85275634765625,9.66,186.01275634765625,7.5L184.67275634765625,7.35969L184.37275634765626,7.44L177.53275634765626,7.44L177.53275634765626,9.16L184.07275634765625,9.16C183.91275634765626,10.88,183.67275634765625,13.12,183.43275634765624,15.06L179.79275634765625,15.06C179.99275634765624,13.58,180.15275634765624,11.8,180.27275634765624,10.32L178.49275634765624,10.2ZM169.65275634765624,7.32L169.65275634765624,9.04L171.97275634765626,9.04C171.45275634765625,11.92,170.55275634765624,14.6,169.21275634765624,16.4C169.49275634765627,16.92,169.89275634765625,18.06,169.97275634765626,18.54C170.31275634765626,18.12,170.63275634765625,17.66,170.93275634765624,17.16L170.93275634765624,23.98L172.55275634765624,23.98L172.55275634765624,22.42L176.17275634765625,22.42L176.17275634765625,13.52L172.57275634765625,13.52C173.07275634765625,12.1,173.45275634765625,10.58,173.75275634765626,9.04L176.67275634765625,9.04L176.67275634765625,7.32L169.65275634765624,7.32ZM172.55275634765624,15.18L174.51275634765625,15.18L174.51275634765625,20.74L172.55275634765624,20.74L172.55275634765624,15.18Z"
+                fill="#06518B"
+                fill-opacity="1"
+              />
+            </g>
+          </g>
+          <g>
+            <path
+              d="M22.9482,28.2911C20.1581,28.2911,17.8963,26.0293,17.8963,23.2393C17.8963,20.4492,20.1581,18.1874,22.9482,18.1874C25.7382,18.1874,28,20.4492,28,23.2393C28,26.0293,25.7382,28.2911,22.9482,28.2911ZM25.4381,22.3273L24.0681,22.1173C23.9668,22.0999,23.8802,22.0342,23.8361,21.9413L23.2242,20.6353C23.1765,20.526,23.0685,20.4553,22.9492,20.4553C22.8298,20.4553,22.7219,20.526,22.6742,20.6353L22.0622,21.9413C22.0198,22.0356,21.9324,22.1019,21.8302,22.1173L20.4602,22.3273C20.2082,22.3653,20.1082,22.6913,20.2902,22.8773L21.2822,23.8932C21.3553,23.9692,21.3879,24.0753,21.3702,24.1792L21.1362,25.6132C21.0922,25.8772,21.3562,26.0792,21.5822,25.9532L22.8082,25.2752C22.897,25.2253,23.0053,25.2253,23.0942,25.2752L24.3201,25.9532C24.5461,26.0772,24.8081,25.8772,24.7661,25.6132L24.5321,24.1792C24.5144,24.0753,24.547,23.9692,24.6201,23.8932L25.6121,22.8773C25.7901,22.6913,25.6901,22.3673,25.4381,22.3273ZM17.0883,23.2393C17.0883,24.5232,17.5063,25.7092,18.2083,26.6752L1.25084,26.6752C0.134878,26.6752,-0.291108,25.5532,0.204876,24.4152Q1.02685,22.5873,3.91076,18.6074C4.78673,17.4195,5.6927,16.2535,6.62667,15.1115C8.30263,16.6934,10.5179,17.5779,12.8225,17.5854C15.1175,17.5779,17.3241,16.6994,18.9963,15.1275C19.6883,15.9735,20.3602,16.8375,21.0202,17.7094C18.6672,18.5293,17.0899,20.7475,17.0883,23.2393ZM12.8225,15.6935C8.67061,15.6935,5.30471,12.1796,5.30471,7.84575C5.30471,3.51389,8.67061,0,12.8225,0C16.9743,0,20.3402,3.51389,20.3402,7.84775C20.3402,12.1816,16.9743,15.6935,12.8225,15.6935Z"
+              fill="#06518B"
+              fill-opacity="1"
+            />
+          </g>
+        </g>
+      </svg>
+    </div>
+    <div class="form_wrap"></div>
+    <div class="btn_wrap">
+      <div class="btn">修改</div>
+    </div>
+  </div>
+</template>
+
+<script setup></script>
+
+<style lang="scss" scoped>
+.admin_password_container {
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  padding: 106px 218px 141px 218px;
+  .title_wrap {
+    display: flex;
+    justify-content: center;
+    margin-bottom: 73px;
+  }
+  .form_wrap {
+    margin-bottom: 35px;
+  }
+  .btn_wrap {
+    display: flex;
+    justify-content: flex-end;
+    .btn {
+      width: 87px;
+      height: 45px;
+      border-radius: 23px;
+      background: #06518b;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-family: Source Han Sans CN;
+      font-size: 14px;
+      font-weight: normal;
+      letter-spacing: 0.1em;
+      color: #ffffff;
+    }
+  }
+}
+</style>
diff --git a/src/components/Setting/components/Date.vue b/src/components/Setting/components/Date.vue
new file mode 100644
index 0000000..c207dfb
--- /dev/null
+++ b/src/components/Setting/components/Date.vue
@@ -0,0 +1,7 @@
+<template>
+  <div>da</div>
+</template>
+
+<script setup></script>
+
+<style lang="scss" scoped></style>
diff --git a/src/components/Setting/components/Device.vue b/src/components/Setting/components/Device.vue
new file mode 100644
index 0000000..ebb9824
--- /dev/null
+++ b/src/components/Setting/components/Device.vue
@@ -0,0 +1,69 @@
+<template>
+  <div class="device_container">
+    <div class="row_wrap">
+      <p class="title">加液蠕动泵</p>
+      <p class="num">000/000</p>
+      <div class="btn">设置</div>
+    </div>
+    <div class="row_wrap">
+      <p class="title">喷液蠕动泵</p>
+      <p class="num">000/000</p>
+      <div class="btn">设置</div>
+    </div>
+  </div>
+</template>
+
+<script setup></script>
+
+<style lang="scss" scoped>
+.device_container {
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  padding: 20px;
+  padding-bottom: 380px;
+  display: grid;
+  grid-template-rows: repeat(2, 1fr);
+  grid-template-columns: repeat(1, 1fr);
+  row-gap: 20px;
+  .row_wrap {
+    width: 726px;
+    height: 80px;
+    border-radius: 14px;
+    background: #f6f6f6;
+    box-sizing: border-box;
+    padding: 0 18px 0 40px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    .title {
+      font-family: Zona Pro;
+      font-size: 20px;
+      font-weight: normal;
+      letter-spacing: 0.06em;
+      color: #000000;
+    }
+    .num {
+      font-family: Source Han Sans CN;
+      font-size: 14px;
+      font-weight: 500;
+      letter-spacing: 0.1em;
+      color: #000000;
+    }
+    .btn {
+      width: 87px;
+      height: 45px;
+      border-radius: 23px;
+      background: #06518b;
+      font-family: Source Han Sans CN;
+      font-size: 14px;
+      font-weight: normal;
+      letter-spacing: 0.1em;
+      color: #ffffff;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+  }
+}
+</style>
diff --git a/src/components/Setting/components/User.vue b/src/components/Setting/components/User.vue
new file mode 100644
index 0000000..c889e98
--- /dev/null
+++ b/src/components/Setting/components/User.vue
@@ -0,0 +1,144 @@
+<template>
+  <div class="user_manage_container">
+    <div class="title_wrap">
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        xmlns:xlink="http://www.w3.org/1999/xlink"
+        fill="none"
+        version="1.1"
+        width="122.5126953125"
+        height="29"
+        viewBox="0 0 122.5126953125 29"
+      >
+        <g>
+          <g>
+            <g>
+              <path
+                d="M41.47275634765625,7.72L41.47275634765625,14.92C41.47275634765625,17.74,41.27275634765625,21.32,39.07275634765625,23.78C39.49275634765625,24.02,40.27275634765625,24.64,40.55275634765625,25.0231C42.03275634765625,23.38,42.75275634765625,21.12,43.09275634765625,18.9L47.71275634765625,18.9L47.71275634765625,24.7L49.61275634765625,24.7L49.61275634765625,18.9L54.492756347656254,18.9L54.492756347656254,22.5C54.492756347656254,22.88,54.35275634765625,23,53.97275634765625,23C53.61275634765625,23.02,52.25275634765625,23.04,50.97275634765625,22.96C51.23275634765625,23.46,51.532756347656246,24.3,51.59275634765625,24.78C53.45275634765625,24.8003,54.65275634765625,24.78,55.392756347656245,24.48C56.11275634765625,24.18,56.37275634765625,23.62,56.37275634765625,22.52L56.37275634765625,7.72L41.47275634765625,7.72ZM43.35275634765625,9.52L47.71275634765625,9.52L47.71275634765625,12.36L43.35275634765625,12.36L43.35275634765625,9.52ZM54.492756347656254,9.52L54.492756347656254,12.36L49.61275634765625,12.36L49.61275634765625,9.52L54.492756347656254,9.52ZM43.35275634765625,14.12L47.71275634765625,14.12L47.71275634765625,17.1L43.27275634765625,17.1C43.33275634765625,16.34,43.35275634765625,15.62,43.35275634765625,14.94L43.35275634765625,14.12ZM54.492756347656254,14.12L54.492756347656254,17.1L49.61275634765625,17.1L49.61275634765625,14.12L54.492756347656254,14.12ZM64.85275634765625,11.16L74.87275634765625,11.16L74.87275634765625,14.8L64.83275634765624,14.8L64.85275634765625,13.84L64.85275634765625,11.16ZM68.33275634765624,6.69312C68.71275634765625,7.51531,69.15275634765625,8.61812,69.37275634765625,9.4L62.87275634765625,9.4L62.87275634765625,13.84C62.87275634765625,16.8206,62.65275634765625,20.985,60.31275634765625,23.8881C60.772756347656255,24.1084,61.632756347656255,24.6891,61.97275634765625,25.0494C63.83275634765625,22.7269,64.51275634765625,19.4434,64.75275634765624,16.56L74.87275634765625,16.56L74.87275634765625,17.7616L76.81275634765625,17.7616L76.81275634765625,9.4L70.31275634765625,9.4L71.39275634765625,9.07937C71.15275634765625,8.29719,70.65275634765625,7.13406,70.19275634765626,6.21187L68.33275634765624,6.69312ZM84.99275634765624,14.46L84.99275634765624,24.925L86.91275634765626,24.925L86.91275634765626,24.3L96.07275634765625,24.3L96.07275634765625,24.9047L97.95275634765625,24.9047L97.95275634765625,19.86L86.91275634765626,19.86L86.91275634765626,18.68L96.89275634765625,18.68L96.89275634765625,14.46L84.99275634765624,14.46ZM96.07275634765625,22.88L86.91275634765626,22.88L86.91275634765626,21.28L96.07275634765625,21.28L96.07275634765625,22.88ZM89.55275634765624,10.7181C89.75275634765626,11.0988,89.97275634765626,11.5394,90.13275634765625,11.94L82.69275634765626,11.94L82.69275634765626,15.34L84.51275634765625,15.34L84.51275634765625,13.38L97.43275634765625,13.38L97.43275634765625,15.34L99.37275634765625,15.34L99.37275634765625,11.94L92.05275634765624,11.94C91.85275634765625,11.4394,91.55275634765624,10.8384,91.23275634765625,10.3778L89.55275634765624,10.7181ZM86.91275634765626,15.86L95.03275634765626,15.86L95.03275634765626,17.28L86.91275634765626,17.28L86.91275634765626,15.86ZM84.19275634765626,6.21281C83.67275634765625,7.94,82.77275634765624,9.66,81.65275634765625,10.76C82.11275634765624,10.96,82.91275634765626,11.38,83.27275634765624,11.62C83.85275634765625,10.98,84.41275634765626,10.14,84.91275634765626,9.22L86.01275634765625,9.22C86.49275634765624,9.96,86.93275634765625,10.84,87.13275634765625,11.42L88.73275634765625,10.86C88.57275634765625,10.42,88.23275634765625,9.8,87.87275634765625,9.22L90.69275634765626,9.22L90.69275634765626,7.88L85.55275634765624,7.88C85.73275634765625,7.45844,85.89275634765625,7.01625,86.03275634765626,6.57438L84.19275634765626,6.21281ZM92.71275634765625,6.23281C92.35275634765625,7.67937,91.65275634765625,9.12,90.73275634765625,10.0406C91.17275634765625,10.2606,91.95275634765625,10.6609,92.29275634765625,10.9212C92.71275634765625,10.4409,93.09275634765625,9.88062,93.45275634765625,9.24L94.59275634765625,9.24C95.19275634765626,9.98062,95.81275634765625,10.9012,96.05275634765624,11.4816L97.59275634765625,10.7812C97.39275634765625,10.3609,97.01275634765625,9.78062,96.57275634765625,9.24L99.81275634765625,9.24L99.81275634765625,7.88L94.09275634765625,7.88C94.27275634765624,7.45844,94.43275634765625,7.01625,94.55275634765624,6.57438L92.71275634765625,6.23281ZM111.95275634765625,12.54L114.59275634765625,12.54L114.59275634765625,14.74L111.95275634765625,14.74L111.95275634765625,12.54ZM116.21275634765625,12.54L118.79275634765625,12.54L118.79275634765625,14.74L116.21275634765625,14.74L116.21275634765625,12.54ZM111.95275634765625,8.84L114.59275634765625,8.84L114.59275634765625,11.02L111.95275634765625,11.02L111.95275634765625,8.84ZM116.21275634765625,8.84L118.79275634765625,8.84L118.79275634765625,11.02L116.21275634765625,11.02L116.21275634765625,8.84ZM108.57275634765625,22.54L108.57275634765625,24.26L121.51275634765625,24.26L121.51275634765625,22.54L116.35275634765625,22.54L116.35275634765625,20.14L120.85275634765625,20.14L120.85275634765625,18.42L116.35275634765625,18.42L116.35275634765625,16.36L120.59275634765625,16.36L120.59275634765625,7.22L110.23275634765625,7.22L110.23275634765625,16.36L114.43275634765625,16.36L114.43275634765625,18.42L110.05275634765626,18.42L110.05275634765626,20.14L114.43275634765625,20.14L114.43275634765625,22.54L108.57275634765625,22.54ZM102.71275634765625,21L103.17275634765625,22.94C104.99275634765625,22.34,107.35275634765625,21.54,109.53275634765625,20.8L109.21275634765625,19L107.11275634765624,19.68L107.11275634765624,15.12L109.05275634765626,15.12L109.05275634765626,13.38L107.11275634765624,13.38L107.11275634765624,9.36L109.35275634765625,9.36L109.35275634765625,7.6L102.93275634765625,7.6L102.93275634765625,9.36L105.31275634765625,9.36L105.31275634765625,13.38L103.13275634765625,13.38L103.13275634765625,15.12L105.31275634765625,15.12L105.31275634765625,20.245C104.35275634765625,20.54,103.45275634765625,20.8,102.71275634765625,21Z"
+                fill="#06518B"
+                fill-opacity="1"
+              />
+            </g>
+          </g>
+          <g>
+            <path
+              d="M11.4925,15.501C15.1312,15.501,18.0848,12.478,18.0848,8.74952C18.0848,5.020989999999999,15.1312,2,11.4925,2C7.8519,2,4.90025,5.020989999999999,4.90025,8.74952C4.90025,12.478,7.84998,15.501,11.4925,15.501ZM20.574,19.7134C19.0674,17.9513,18.5589,17.344,15.801,17.1821L7.19363,17.1821C4.43389,17.3479,3.92723,17.9513,2.42454,19.7134C0.823965,21.5314,-0.450353,23.841,0.152261,26.6981C0.823965,28.5701,2.63181,29,4.34753,29L18.6529,29C20.3667,29,22.1784,28.5662,22.8501,26.6981C23.4469,23.841,22.1745,21.5333,20.574,19.7134Z"
+              fill="#06518B"
+              fill-opacity="1"
+            />
+          </g>
+        </g>
+      </svg>
+    </div>
+    <div class="user_content">
+      <div class="user_line">
+        <p class="username">username</p>
+        <div class="operator_wrap">
+          <div class="btn">删除用户</div>
+          <div class="btn mb">设为管理员</div>
+          <div class="btn">修改密码</div>
+        </div>
+      </div>
+      <div class="user_line">
+        <p class="username">username</p>
+        <div class="operator_wrap">
+          <div class="btn">删除用户</div>
+          <div class="btn mb">设为管理员</div>
+          <div class="btn">修改密码</div>
+        </div>
+      </div>
+      <div class="user_line">
+        <p class="username">username</p>
+        <div class="operator_wrap">
+          <div class="btn">删除用户</div>
+          <div class="btn mb">设为管理员</div>
+          <div class="btn">修改密码</div>
+        </div>
+      </div>
+    </div>
+    <div class="btn_wrap">
+      <div class="add_user">新增用户</div>
+    </div>
+  </div>
+</template>
+
+<script setup></script>
+
+<style lang="scss" scoped>
+.user_manage_container {
+  box-sizing: border-box;
+  width: 100%;
+  height: 100%;
+  padding: 32px 43px;
+  background: #ffffff;
+  .title_wrap {
+    margin-bottom: 19px;
+    padding-left: 5px;
+  }
+  .user_content {
+    height: 406px;
+    margin-bottom: 26px;
+    .user_line {
+      width: 680px;
+      height: 58px;
+      border-radius: 14px;
+      opacity: 1;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      box-sizing: border-box;
+      padding-left: 24px;
+      padding-right: 11px;
+      &:nth-child(odd) {
+        background: #f6f6f6;
+      }
+      .username {
+        font-family: Source Han Sans CN;
+        font-size: 16px;
+        font-weight: normal;
+        letter-spacing: 0.06em;
+        color: #000000;
+      }
+      .operator_wrap {
+        display: flex;
+        align-items: center;
+        .btn {
+          width: 111px;
+          height: 38px;
+          border-radius: 19px;
+          background: #06518b;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          font-family: Source Han Sans CN;
+          font-size: 14px;
+          font-weight: normal;
+          letter-spacing: 0.1em;
+          color: #ffffff;
+        }
+        .mb {
+          margin: 0 16px;
+        }
+      }
+    }
+  }
+  .btn_wrap {
+    display: flex;
+    justify-content: flex-end;
+    .add_user {
+      width: 111px;
+      height: 38px;
+      border-radius: 19px;
+      background: #06518b;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-family: Source Han Sans CN;
+      font-size: 14px;
+      font-weight: normal;
+      letter-spacing: 0.1em;
+      color: #ffffff;
+    }
+  }
+}
+</style>
diff --git a/src/components/Setting/index.vue b/src/components/Setting/index.vue
new file mode 100644
index 0000000..078f598
--- /dev/null
+++ b/src/components/Setting/index.vue
@@ -0,0 +1,124 @@
+<template>
+  <div class="setting_contaienr">
+    <div class="left_container">
+      <div class="tab_wrap">
+        <p class="active_line" v-show="activeTab == 1"></p>
+        <p :class="activeTab == 1 ? 'title active' : 'title'">设备参数配置</p>
+        <div class="btn" @click="changeActiveTab(1)">配置</div>
+      </div>
+      <div class="tab_wrap">
+        <p class="active_line" v-show="activeTab == 2"></p>
+        <p :class="activeTab == 2 ? 'title active' : 'title'">修改管理员密码</p>
+        <div class="btn" @click="changeActiveTab(2)">修改</div>
+      </div>
+      <div class="tab_wrap">
+        <p class="active_line" v-show="activeTab == 3"></p>
+        <p :class="activeTab == 3 ? 'title active' : 'title'">用户管理</p>
+        <div class="btn" @click="changeActiveTab(3)">管理</div>
+      </div>
+      <div class="tab_wrap">
+        <p class="active_line" v-show="activeTab == 4"></p>
+        <p :class="activeTab == 4 ? 'title active' : 'title'">日期/时间设置</p>
+        <div class="btn" @click="changeActiveTab(4)">配置</div>
+      </div>
+    </div>
+    <div class="right_container">
+      <Admin v-if="activeTab == 2" />
+      <Date v-if="activeTab == 4" />
+      <Device v-if="activeTab == 1" />
+      <User v-if="activeTab == 3" />
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import Admin from './components/Admin.vue'
+import Date from './components/Date.vue'
+import Device from './components/Device.vue'
+import User from './components/User.vue'
+
+const activeTab = ref(1)
+
+const changeActiveTab = index => {
+  activeTab.value = index
+}
+</script>
+
+<style lang="scss" scoped>
+.setting_contaienr {
+  display: flex;
+  align-items: center;
+  margin-bottom: 30px;
+  height: 580px;
+  box-sizing: border-box;
+  .left_container {
+    height: 580px;
+    width: 424px;
+    margin-right: 30px;
+    box-sizing: border-box;
+    border-radius: 16px;
+    background: #ffffff;
+    padding: 20px;
+    padding-bottom: 180px;
+    display: grid;
+    grid-template-columns: repeat(1, 1fr);
+    grid-template-rows: repeat(4, 1fr);
+    row-gap: 20px;
+    .tab_wrap {
+      width: 384px;
+      height: 80px;
+      border-radius: 14px;
+      background: #f6f6f6;
+      box-sizing: border-box;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      padding: 0 18px;
+      padding-left: 37px;
+      position: relative;
+      .title {
+        font-family: Zona Pro;
+        font-size: 18px;
+        font-weight: normal;
+        letter-spacing: 0.06em;
+        color: #000000;
+      }
+      .active {
+        color: #06518b;
+      }
+      .btn {
+        width: 87px;
+        height: 45px;
+        border-radius: 23px;
+        background: #06518b;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        font-family: Source Han Sans CN;
+        font-size: 14px;
+        font-weight: normal;
+        letter-spacing: 0.1em;
+        color: #ffffff;
+      }
+      .active_line {
+        position: absolute;
+        left: 20px;
+        top: 24px;
+        width: 4px;
+        height: 32px;
+        border-radius: 2px;
+        background: #06518b;
+      }
+    }
+  }
+  .right_container {
+    height: 580px;
+    flex: 1;
+    box-sizing: border-box;
+    border-radius: 16px;
+    background: #ffffff;
+    overflow: hidden;
+  }
+}
+</style>