新增顺风车模块，顺风车模块已完成

src/layout/index.vue

@@ -66,6 +66,32 @@ watch(
       store.commit("indexUp", 11);
       sessionStorage.setItem("sidevarItem", 11);
     }
+
+    if (newValue == "/schoolBus/driverAudit") {
+      store.commit("indexUp", 17);
+      sessionStorage.setItem("sidevarItem", 17);
+    }
+    if (newValue == "/schoolBus/driverManagement") {
+      store.commit("indexUp", 18);
+      sessionStorage.setItem("sidevarItem", 18);
+    }
+    if (newValue == "/schoolBus/driverDeposit") {
+      store.commit("indexUp", 19);
+      sessionStorage.setItem("sidevarItem", 19);
+    }
+    if (newValue == "/schoolBus/driverPath") {
+      store.commit("indexUp", 20);
+      sessionStorage.setItem("sidevarItem", 20);
+    }
+    if (newValue == "/schoolBus/driverOrder") {
+      store.commit("indexUp", 21);
+      sessionStorage.setItem("sidevarItem", 21);
+    }
+    if (newValue == "/schoolBus/driverRule") {
+      store.commit("indexUp", 22);
+      sessionStorage.setItem("sidevarItem", 22);
+    }
+
     if (newValue == "/schoolBus/news") {
       store.commit("indexUp", 0);
       sessionStorage.setItem("sidevarItem", 0);
@@ -97,7 +123,7 @@ onBeforeMount(async () => {
   display: flex;
   .content {
     // min-width: 1740px;
-    max-width: calc(100vw - 81px);
+    max-width: calc(100vw - 72px);
     min-width: calc(100vw - 200px);
     width: 100%;
     height: calc(100vh);

src/layout/sidebar/SidevarItem copy.vue

@@ -0,0 +1,324 @@
+<template>
+  <div class="box-item">
+    <el-menu
+      class="el-menu-vertical-demo"
+      text-color="#fff"
+      active-color="#000"
+      :default-active="activeIndex"
+      :collapse="menuClose"
+      @select="handleSelect"
+    >
+      <!-- <div class="logo">logo</div> -->
+      <div class="logo el-menu-item">
+        <el-icon :size="20"
+          ><img src="@/assets/logo.png" style="width: 30px; height: 24px"
+        /></el-icon>
+      </div>
+      <el-menu-item :index="9">
+        <img
+          v-if="activeIndex == 9"
+          src="@/assets/busqueryA.png"
+          alt=""
+          style="width: 22px; height: 22px; margin: 0 18px"
+        />
+        <img
+          v-else
+          src="@/assets/busquery.png "
+          alt=""
+          style="width: 22px; height: 22px; margin: 0 18px"
+        />
+        <span>车辆调度</span>
+      </el-menu-item>
+      <el-menu-item :index="1">
+        <img v-if="activeIndex == 1" src="@/assets/statementA.png" alt="" />
+        <img v-else src="@/assets/statement.png " alt="" />
+        <span>报表统计</span>
+      </el-menu-item>
+      <el-menu-item :index="2">
+        <img v-if="activeIndex == 2" src="@/assets/staffA.png" alt="" />
+        <img v-else src="@/assets/staff.png" alt="" />
+        <span>驾驶员管理</span>
+      </el-menu-item>
+      <el-menu-item :index="11">
+        <img
+          v-if="activeIndex == 11"
+          style="width: 22px; height: 22px; margin: 0 20px 0 18px"
+          src="@/assets/reportA.png"
+          alt=""
+        />
+        <img
+          v-else
+          style="width: 22px; height: 22px; margin: 0 20px 0 18px"
+          src="@/assets/report.png"
+          alt=""
+        />
+        <span>报备管理</span>
+      </el-menu-item>
+      <el-menu-item :index="3">
+        <img v-if="activeIndex == 3" src="@/assets/accountA.png" alt="" />
+        <img v-else src="@/assets/account.png" alt="" />
+        <span>账号管理</span>
+      </el-menu-item>
+      <el-menu-item :index="4">
+        <img v-if="activeIndex == 4" src="@/assets/carA.png" alt="" />
+        <img v-else src="@/assets/car.png" alt="" />
+        <span>车辆管理</span>
+      </el-menu-item>
+      <el-menu-item :index="5">
+        <img v-if="activeIndex == 5" src="@/assets/pathA.png" alt="" />
+        <img v-else src="@/assets/path.png" alt="" />
+        <span>路线管理</span>
+      </el-menu-item>
+      <el-menu-item :index="6">
+        <img v-if="activeIndex == 6" src="@/assets/classesA.png" alt="" />
+        <img v-else src="@/assets/classes.png" alt="" />
+        <span>班次管理</span>
+      </el-menu-item>
+      <el-menu-item :index="7">
+        <img v-if="activeIndex == 7" src="@/assets/blacklistA.png" alt="" />
+        <img v-else src="@/assets/blacklist.png" alt="" />
+        <span>黑名单管理</span>
+      </el-menu-item>
+      <el-menu-item :index="10">
+        <img
+          v-if="activeIndex == 10"
+          src="@/assets/logA.png"
+          alt=""
+          style="width: 21px; height: 21px; margin: 0 20px"
+        />
+        <img
+          v-else
+          src="@/assets/log.png"
+          alt=""
+          style="width: 21px; height: 21px; margin: 0 20px"
+        />
+        <span>操作日志</span>
+      </el-menu-item>
+      <el-sub-menu index="1">
+        <template #title>
+          <el-icon style="font-size: 28px;"><location /></el-icon>
+          <span>顺风车模块</span>
+        </template>
+        <el-sub-menu index="1-4">
+          <template #title>顺风车司机</template>
+          <el-menu-item index="1-4-1">司机思考</el-menu-item>
+          <el-menu-item index="1-3">司机管理</el-menu-item>
+        </el-sub-menu>
+        <el-menu-item index="1-3">路线管理</el-menu-item>
+      </el-sub-menu>
+      <el-menu-item :index="8">
+        <img
+          v-if="activeIndex == 8"
+          src="@/assets/systemA.png"
+          alt=""
+          style="width: 20px; height: 20px"
+        />
+        <img
+          v-else
+          src="@/assets/system.png"
+          alt=""
+          style="width: 20px; height: 20px"
+        />
+        <span>系统设置</span>
+      </el-menu-item>
+    </el-menu>
+  </div>
+</template>
+
+<script setup>
+import { ref, onBeforeMount, onMounted, watch, reactive } from "vue";
+import { useStore } from "vuex";
+
+import { useRouter } from "vue-router";
+
+const store = useStore();
+const router = useRouter();
+
+const menuClose = ref(false);
+const activeIndex = ref(9);
+const acitveItems = reactive({ list: [] });
+
+watch(
+  () => store.state.user.collapse,
+  (newValue, oldValue) => {
+    menuClose.value = newValue;
+  }
+);
+watch(
+  () => store.state.user.activeIndex,
+  (newValue, oldValue) => {
+    console.log(newValue);
+
+    activeIndex.value = newValue;
+  }
+);
+
+const handleSelect = (key) => {
+  store.commit("indexUp", key);
+  activeIndex.value = key;
+  sessionStorage.setItem("sidevarItem", key);
+
+  if (activeIndex.value == 1) {
+    router.push({
+      path: `/schoolBus/statement`,
+    });
+  }
+  if (activeIndex.value == 2) {
+    router.push({
+      path: `/schoolBus/staff`,
+    });
+  }
+  if (activeIndex.value == 3) {
+    router.push({
+      path: `/schoolBus/account`,
+    });
+  }
+  if (activeIndex.value == 4) {
+    router.push({
+      path: `/schoolBus/bus`,
+    });
+  }
+  if (activeIndex.value == 6) {
+    router.push({
+      path: `/schoolBus/classes`,
+    });
+  }
+  if (activeIndex.value == 5) {
+    router.push({
+      path: `/schoolBus/buspath`,
+    });
+  }
+  if (activeIndex.value == 8) {
+    router.push({
+      path: `/schoolBus/system`,
+    });
+  }
+  if (activeIndex.value == 7) {
+    router.push({
+      path: `/schoolBus/blacklist`,
+    });
+  }
+  if (activeIndex.value == 9) {
+    router.push({
+      path: `/schoolBus/busquery`,
+    });
+  }
+  if (activeIndex.value == 10) {
+    router.push({
+      path: `/schoolBus/log`,
+    });
+  }
+  if (activeIndex.value == 11) {
+    router.push({
+      path: `/schoolBus/report`,
+    });
+  }
+  if (activeIndex.value == 0) {
+    router.push({
+      path: `/schoolBus/news`,
+    });
+  }
+};
+onBeforeMount(() => {
+  activeIndex.value = Number(sessionStorage.getItem("sidevarItem"));
+  store.commit("indexUp", Number(sessionStorage.getItem("sidevarItem")));
+});
+</script>
+
+<style lang="scss" scoped>
+.el-menu-vertical-demo:not(.el-menu--collapse) {
+  width: 220px;
+  // min-height: 400px;
+}
+.box-item {
+  // width: 220px !important;
+  height: calc(100vh);
+}
+.el-menu {
+  width: 100%;
+  height: 100%;
+  overflow: auto;
+  background: linear-gradient(
+    0deg,
+    rgba(134, 132, 255, 1) 0%,
+    rgba(60, 80, 232, 1) 100%
+  );
+  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.16);
+
+  .logo {
+    height: 65px;
+    color: rgb(255, 255, 255);
+    cursor: default;
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+  }
+  .logo:hover {
+    background-color: transparent !important;
+  }
+  .el-menu-item {
+    // border-left: 3px solid rgba(248, 220, 38);
+    padding: 0 10px;
+  }
+  .el-menu-item:hover {
+    background-color: rgba(255, 255, 255, 0.4);
+  }
+  .el-menu-item.is-active:hover {
+    background-color: #fff;
+  }
+  .el-menu-item img {
+    width: 18px;
+    height: 18px;
+    margin: 0 20px;
+  }
+
+  :deep(.el-sub-menu) {
+    .el-sub-menu__title:hover{
+      background-color: rgba(255, 255, 255, 0.4);
+    }
+    .el-sub-menu__title{
+      display: flex;
+      align-items: center;
+      .el-icon{
+        margin: 0 18px;
+      }
+      .el-sub-menu__icon-arrow{
+        margin: 0 0 0 0px;
+        top: 40%;
+      }
+    }
+    .el-menu {
+      background-color: transparent;
+    }
+    .el-menu--inline{
+      .el-sub-menu{
+        .el-sub-menu__title{
+          padding-left: 40px;
+        }
+      }
+      .el-menu-item{
+        padding-left: 40px;
+      }
+    }
+  }
+  .el-sub-menu.is-active:hover {
+    background-color: #fff;
+  }
+}
+.el-menu--collapse{
+  :deep(.el-sub-menu){
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    .el-sub-menu__title{
+      padding: 0;
+    }
+  }
+}
+
+.el-menu-item.is-active {
+  box-sizing: border-box;
+  background-color: #fff;
+  color: #000;
+}
+</style>

src/layout/sidebar/SidevarItem.vue

@@ -19,13 +19,13 @@
           v-if="activeIndex == 9"
           src="@/assets/busqueryA.png"
           alt=""
-          style="width: 22px; height: 22px; margin: 0 18px"
+          style="width: 22px; height: 22px"
         />
         <img
           v-else
           src="@/assets/busquery.png "
           alt=""
-          style="width: 22px; height: 22px; margin: 0 18px"
+          style="width: 22px; height: 22px"
         />
         <span>车辆调度</span>
       </el-menu-item>
@@ -42,13 +42,13 @@
       <el-menu-item :index="11">
         <img
           v-if="activeIndex == 11"
-          style="width: 22px; height: 22px; margin: 0 20px 0 18px"
+          style="width: 22px; height: 22px"
           src="@/assets/reportA.png"
           alt=""
         />
         <img
           v-else
-          style="width: 22px; height: 22px; margin: 0 20px 0 18px"
+          style="width: 22px; height: 22px"
           src="@/assets/report.png"
           alt=""
         />
@@ -84,16 +84,49 @@
           v-if="activeIndex == 10"
           src="@/assets/logA.png"
           alt=""
-          style="width: 21px; height: 21px; margin: 0 20px"
+          style="width: 21px; height: 21px"
         />
         <img
           v-else
           src="@/assets/log.png"
           alt=""
-          style="width: 21px; height: 21px; margin: 0 20px"
+          style="width: 21px; height: 21px"
         />
         <span>操作日志</span>
       </el-menu-item>
+      <el-sub-menu index="15" popper-class="ceshi">
+        <template #title>
+          <img
+            v-if="
+              activeIndex == 17 ||
+              activeIndex == 18 ||
+              activeIndex == 19 ||
+              activeIndex == 20 ||
+              activeIndex == 21 ||
+              activeIndex == 22
+            "
+            src="@/assets/driverPath.png"
+            alt=""
+            style="width: 21px; height: 21px; margin-right: 13px"
+          />
+          <img
+            v-else
+            src="@/assets/driverPath.png"
+            alt=""
+            style="width: 21px; height: 21px; margin-right: 13px"
+          />
+          <span>顺风车模块</span>
+        </template>
+        <el-sub-menu index="16">
+          <template #title>顺风车司机</template>
+          <el-menu-item :index="17">司机审核</el-menu-item>
+          <el-menu-item :index="18">司机管理</el-menu-item>
+          <el-menu-item :index="19">司机提现管理</el-menu-item>
+        </el-sub-menu>
+        <el-menu-item :index="20">路线管理</el-menu-item>
+        <el-menu-item :index="21">订单管理</el-menu-item>
+        <el-menu-item :index="22">规则设置</el-menu-item>
+      </el-sub-menu>
       <el-menu-item :index="8">
         <img
           v-if="activeIndex == 8"
@@ -201,6 +234,38 @@ const handleSelect = (key) => {
       path: `/schoolBus/report`,
     });
   }
+
+  if (activeIndex.value == 17) {
+    router.push({
+      path: `/schoolBus/driverAudit`,
+    });
+  }
+  if (activeIndex.value == 18) {
+    router.push({
+      path: `/schoolBus/driverManagement`,
+    });
+  }
+  if (activeIndex.value == 19) {
+    router.push({
+      path: `/schoolBus/driverDeposit`,
+    });
+  }
+  if (activeIndex.value == 20) {
+    router.push({
+      path: `/schoolBus/driverPath`,
+    });
+  }
+  if (activeIndex.value == 21) {
+    router.push({
+      path: `/schoolBus/driverOrder`,
+    });
+  }
+  if (activeIndex.value == 22) {
+    router.push({
+      path: `/schoolBus/driverRule`,
+    });
+  }
+
   if (activeIndex.value == 0) {
     router.push({
       path: `/schoolBus/news`,
@@ -257,7 +322,40 @@ onBeforeMount(() => {
   .el-menu-item img {
     width: 18px;
     height: 18px;
-    margin: 0 20px;
+    margin: 0 15px 0 0;
+  }
+
+  :deep(.el-sub-menu) {
+    .el-sub-menu__title:hover {
+      background-color: rgba(255, 255, 255, 0.4);
+    }
+    // .el-sub-menu__title{
+    //   display: flex;
+    //   align-items: center;
+
+    // }
+    .el-menu {
+      background-color: transparent;
+    }
+    // .el-menu--inline{
+
+    // }
+  }
+}
+.el-menu--collapse {
+  img {
+    width: 18px;
+    height: 18px;
+    margin: 0 !important;
+    padding: 0 15px;
+  }
+  :deep(.el-sub-menu) {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    .el-sub-menu__title {
+      padding: 0;
+    }
   }
 }
 
@@ -267,3 +365,26 @@ onBeforeMount(() => {
   color: #000;
 }
 </style>
+
+<style lang="scss">
+.ceshi {
+  &.is-light {
+    border: none !important;
+    background: linear-gradient(
+      90deg,
+      rgba(38, 151, 255, 1) 0%,
+      rgba(102, 182, 255, 1) 100%
+    );
+    .el-menu {
+      background: rgb(38, 38, 38);
+      // rgba(60, 80, 232, 1)
+      .el-sub-menu__title:hover {
+        background: rgba(255, 255, 255, 0.4);
+      }
+    }
+  }
+  .el-menu-item.is-active {
+    background: rgba(134, 132, 255, 1);
+  }
+}
+</style>

src/router/index.js

@@ -75,6 +75,42 @@ const router = createRouter({
           component: () => import("@/views/log/log.vue"),
           meta: { title: "Dashboard", icon: "dashboard" },
         },
+        // 司机审核
+        {
+          path: "driverAudit",
+          component: () => import("@/views/driver/audit.vue"),
+          meta: { title: "Dashboard", icon: "dashboard" },
+        },
+        // 司机管理
+        {
+          path: "driverManagement",
+          component: () => import("@/views/driver/management.vue"),
+          meta: { title: "Dashboard", icon: "dashboard" },
+        },
+        // 司机提现管理
+        {
+          path: "driverDeposit",
+          component: () => import("@/views/driver/deposit.vue"),
+          meta: { title: "Dashboard", icon: "dashboard" },
+        },
+        // 路线管理
+        {
+          path: "driverPath",
+          component: () => import("@/views/driver/path.vue"),
+          meta: { title: "Dashboard", icon: "dashboard" },
+        },
+        // 订单管理
+        {
+          path: "driverOrder",
+          component: () => import("@/views/driver/order.vue"),
+          meta: { title: "Dashboard", icon: "dashboard" },
+        },
+        // 规则设置
+        {
+          path: "driverRule",
+          component: () => import("@/views/driver/rule.vue"),
+          meta: { title: "Dashboard", icon: "dashboard" },
+        },
         {
           path: "report",
           component: () => import("@/views/report/report.vue"),

src/views/driver/audit.vue

@@ -0,0 +1,716 @@
+<template>
+  <div class="content-box">
+    <div class="left">
+      <!-- <el-icon :size="23" class="camera"><VideoCameraFilled /></el-icon> -->
+      <span class="cameratxt">司机审核</span>
+    </div>
+    <div class="middle">
+      <div class="filter">
+        <div class="condition">
+          <span>状态 : </span>
+          <el-select
+            style="width: 180px"
+            v-model="searchInput.car_number"
+            class="m-2"
+            placeholder="请选择状态"
+            :clearable="true"
+          >
+            <el-option label="全部" value="全部" />
+            <el-option label="待审核" value="待审核" />
+            <el-option label="审核成功" value="审核成功" />
+            <el-option label="拒绝" value="拒绝" />
+          </el-select>
+        </div>
+        <div class="condition">
+          <span>司机姓名 : </span>
+          <el-input
+            clearable
+            v-model="searchInput.name"
+            class="w-50 m-2"
+            placeholder="请输入司机姓名"
+            style="width: 150px"
+          />
+        </div>
+        <div class="condition">
+          <span>手机号码 : </span>
+          <el-input
+            clearable
+            v-model="searchInput.phone"
+            class="w-50 m-2"
+            placeholder="请输入手机号码"
+            style="width: 150px"
+          />
+        </div>
+        <div class="condition">
+          <span>车牌号 : </span>
+          <el-input
+            clearable
+            v-model="searchInput.phone"
+            class="w-50 m-2"
+            placeholder="请输入车牌号"
+            style="width: 150px"
+          />
+        </div>
+        <div class="condition">
+          <span>提交时间 : </span>
+          <el-date-picker
+            v-model="searchInput.createTime"
+            type="date"
+            format="YYYY-MM-DD"
+            value-format="YYYY-MM-DD"
+            :prefix-icon="Calendar"
+            placeholder="请选择日期"
+          />
+        </div>
+      </div>
+      <!-- 按钮列表 -->
+      <div class="gongneng">
+        <el-button
+          color="rgba(61, 81, 232, 1)"
+          type="primary"
+          class="search"
+          @click="searchBtn"
+          ><el-icon><Search /></el-icon> <span>查询</span></el-button
+        >
+        <el-button
+          color="rgba(61, 81, 232, 1)"
+          type="primary"
+          class="search"
+          @click="searchRefresh"
+          ><el-icon><Refresh /></el-icon><span>重置</span></el-button
+        >
+
+        <el-button
+          color="rgba(61, 81, 232, 1)"
+          class="import"
+          type="primary"
+          @click="importExcel"
+          ><img
+            src="@/assets/import.png"
+            style="width: 14px; height: 14px; margin-right: 4px"
+            alt=""
+          />
+          <span>导出表单</span></el-button
+        >
+      </div>
+    </div>
+    <div class="footer">
+      <el-table
+        :row-class-name="tableRowClassName"
+        :data="tableData.list"
+        @selection-change="handleSelectionChange"
+        style="width: 100%"
+        :header-cell-style="{
+          background: 'rgba(240, 243, 247, 1)',
+          height: '50px',
+          border: 0,
+        }"
+      >
+        <!-- <el-table-column align="center" type="selection" width="80" /> -->
+        <el-table-column
+          type="index"
+          width="100"
+          align="center"
+          label="序号"
+          index="1"
+        />
+        <el-table-column align="center" prop="user_name" label="司机姓名" />
+        <el-table-column align="center" prop="user_phone" label="手机号码" />
+        <el-table-column align="center" prop="user_phone" label="证件号码" />
+        <el-table-column
+          align="center"
+          prop="user_phone"
+          label="身份证正面图"
+          width="200"
+        />
+        <el-table-column
+          align="center"
+          prop="user_phone"
+          label="身份证反面图"
+          width="200"
+        />
+        <el-table-column align="center" prop="user_phone" label="车辆型号" />
+        <el-table-column align="center" prop="user_phone" label="颜色" />
+        <el-table-column align="center" prop="user_phone" label="车牌号" />
+        <el-table-column align="center" prop="user_phone" label="驾驶证" />
+        <el-table-column align="center" prop="user_phone" label="行驶证" />
+        <el-table-column
+          align="center"
+          prop="user_phone"
+          label="车辆年检照片"
+          width="200"
+        />
+        <el-table-column
+          align="center"
+          prop="user_phone"
+          width="200"
+          label="车辆保险照片"
+        />
+        <el-table-column align="center" prop="user_phone" label="保证金" />
+        <el-table-column align="center" prop="user_zz" label="审核内容" />
+        <el-table-column align="center" prop="create_time" label="提交时间" />
+        <el-table-column align="center" prop="create_time" label="审核时间" />
+        <el-table-column align="center" prop="create_time" label="状态" />
+        <el-table-column align="center" label="操作" width="220">
+          <template #default="scope">
+            <el-button link type="primary" @click="pass(scope.row)"
+              ><div class="look">通过</div></el-button
+            >
+            <el-button link type="danger" @click="refuse(scope.row)"
+              ><div class="looks">拒绝</div></el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <!-- 添加员工弹窗 -->
+      <el-dialog
+        class="addStaff"
+        v-model="addDialogVisible"
+        :close-on-click-modal="false"
+        :close-on-press-escape="false"
+        :title="dialongTitle"
+        align-center
+        width="550"
+        :before-close="cancelAdd"
+      >
+        <el-form
+          ref="ruleFormRef"
+          :model="ruleForm"
+          :rules="rules"
+          label-width="100px"
+          class="demo-ruleForm"
+          :size="formSize"
+          label-position="left"
+          status-icon
+        >
+          <el-form-item label="审核内容 :" prop="textarea">
+            <el-input
+              v-model="ruleForm.textarea"
+              style="width: 360px"
+              :rows="5"
+              type="textarea"
+              placeholder="请输入审核内容"
+            />
+          </el-form-item>
+
+          <el-form-item class="options">
+            <el-button class="congzhi" @click="cancelAdd(ruleFormRef)"
+              >取消</el-button
+            >
+            <el-button
+              color="rgba(61, 81, 232, 1)"
+              class="queding"
+              type="primary"
+              @click="submitAdd(ruleFormRef)"
+            >
+              确定
+            </el-button>
+          </el-form-item>
+        </el-form>
+      </el-dialog>
+    </div>
+
+    <!-- 分页组件 -->
+    <el-pagination
+      background
+      :current-page="currentPage"
+      :page-size="pageSize"
+      layout="total, prev, pager, next, jumper, slot"
+      :total="total"
+      @update:current-page="handleCurrentChange"
+    />
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, nextTick, onBeforeMount, onUnmounted } from "vue";
+import { useRouter } from "vue-router";
+import { ElMessage, ElMessageBox } from "element-plus";
+import { Calendar } from "@element-plus/icons-vue";
+import vidiconsApi from "@/api/vidicons.js";
+import { dayjs } from "element-plus";
+import lodash from "lodash";
+import axios from "axios";
+import { useStore } from "vuex";
+const store = useStore();
+const router = useRouter();
+// 表格数据
+const tableData = reactive({ list: [] });
+const activeIndex = ref(); // 默认跳转路由
+const dialongTitle = ref("新增驾驶员"); // 弹窗标题
+const api = ref("");
+const searchInput = reactive({
+  name: "",
+  phone: "",
+  createTime: "",
+}); // 搜索按钮数据
+
+const currentPage = ref(1); // 当前页
+const pageSize = ref(10);
+const total = ref(); // 当前总数
+const selectData = reactive({ list: [] }); // 多选框选择的数据
+
+const addDialogVisible = ref(false); // 控制添加员工弹窗
+
+// 表单数据
+const formSize = ref("default");
+const ruleFormRef = ref();
+const ruleForm = reactive({
+  textarea: "",
+  id: "",
+});
+// 表单验证
+const rules = reactive({
+  textarea: [{ required: true, message: "审核内容不能为空", trigger: "blur" }],
+  // phone: [
+  //   { required: true, message: "请输入手机号", trigger: "blur" },
+  //   {
+  //     // pattern: /^((0\d{2,3}-\d{7,8})|(1[3584]\d{9}))$/,
+  //     pattern: /^((\(\+86\))|(\(86\)))?[1][3456789][0-9]{9}$/,
+  //     message: "请输入合法手机号/电话号",
+  //     trigger: "blur",
+  //   },
+  // ],
+});
+// 获取摄像头列表
+const getList = async (message) => {
+  let data = new FormData();
+  if (searchInput.createTime == null) {
+    searchInput.createTime = "";
+  }
+  data.set("user_name", searchInput.name);
+  data.set("user_phone", searchInput.phone);
+  data.set("create_time", searchInput.createTime); //前面的key记得对应！
+  data.set("page", currentPage.value);
+  data.set("rows", pageSize.value); //前面的key记得对应！
+  let res = await axios({
+    method: "post",
+    url: api.value + "/carBook/userlist.action",
+    headers: {
+      token: sessionStorage.getItem("token"),
+    },
+    data: data,
+  });
+  console.log(res);
+  if (res.status == 200) {
+    if (message) {
+      ElMessage({
+        type: "success",
+        showClose: true,
+        message: message,
+        center: true,
+      });
+    }
+    tableData.list = res.data.rows;
+    total.value = res.data.total;
+  } else {
+    tableData.list = res.data.rows;
+    currentPage.value = 1;
+    total.value = res.data.total;
+    ElMessage({
+      type: "error",
+      showClose: true,
+      message: res.data.message,
+      center: true,
+    });
+    if (res.data.message == "token错误") {
+      router.push({
+        path: `/login`,
+      });
+    }
+  }
+};
+
+// 搜索功能
+const searchBtn = lodash.debounce(async () => {
+  getList("查询成功");
+}, 300);
+// 重置搜索
+const searchRefresh = lodash.debounce(async () => {
+  searchInput.name = "";
+  searchInput.phone = "";
+  searchInput.createTime = "";
+  currentPage.value = 1;
+  getList();
+}, 300);
+// 拒绝
+const refuse = () => {
+  dialongTitle.value = "拒绝审核";
+  addDialogVisible.value = true;
+  ruleForm.textarea = "";
+};
+
+// 取消拒绝
+const cancelAdd = () => {
+  addDialogVisible.value = false;
+  ruleFormRef.value.resetFields();
+};
+// 确认添加员工
+const submitAdd = async (formEl) => {
+  if (!formEl) return;
+  await formEl.validate(async (valid, fields) => {
+    if (valid) {
+      let data = {
+        user_name: ruleForm.name,
+        user_phone: ruleForm.phone,
+        user_zz: ruleForm.post,
+        id: ruleForm.id,
+      };
+      let res = await axios({
+        method: "post",
+        url: api.value + "/carBook/userupdate.action",
+        headers: {
+          "Content-Type": "application/json;charset=utf-8",
+          token: sessionStorage.getItem("token"),
+        },
+        data: data,
+      });
+      // console.log(res, "修改账号");
+      if (res.data.code == 200) {
+        getList();
+
+        ElMessage({
+          type: "success",
+          showClose: true,
+          message: res.data.message,
+          center: true,
+        });
+        addDialogVisible.value = false;
+        ruleFormRef.value.resetFields();
+      } else {
+        ElMessage({
+          type: "error",
+          showClose: true,
+          message: res.data.message,
+          center: true,
+        });
+      }
+    } else {
+      console.log("error submit!", fields);
+    }
+  });
+};
+
+// 通过
+const pass = (row) => {
+  ElMessageBox.confirm(`是否通过审核`, "提示", {
+    confirmButtonText: "确认",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(async () => {
+      // let data = new FormData();
+      // data.set("id", row.id);
+      // let res = await axios({
+      //   method: "post",
+      //   url: api.value + "/carBook/userdel.action",
+      //   headers: {
+      //     token: sessionStorage.getItem("token"),
+      //   },
+      //   data: data,
+      // });
+      // if (res.data.code == 200) {
+      //   if (tableData.list.length == 1 && currentPage.value != 1) {
+      //     currentPage.value = currentPage.value - 1;
+      //   }
+      //   getList();
+      //   ElMessage({
+      //     type: "success",
+      //     showClose: true,
+      //     message: res.data.message,
+      //     center: true,
+      //   });
+      // } else {
+      //   ElMessage({
+      //     type: "error",
+      //     showClose: true,
+      //     message: res.data.message,
+      //     center: true,
+      //   });
+      // }
+    })
+    .catch(() => {});
+};
+//导出功能
+const importExcel = async () => {
+  if (searchInput.createTime == null) {
+    searchInput.createTime = "";
+  }
+  let data = new FormData();
+  data.set("user_name", searchInput.name);
+  data.set("user_phone", searchInput.phone);
+  data.set("create_time", searchInput.createTime);
+  let res = await axios({
+    method: "post",
+    url: api.value + "/carBook/usertoExcel.action",
+    headers: {
+      token: sessionStorage.getItem("token"),
+    },
+    data: data,
+  });
+  // console.log(res, "导出账号");
+  if (res.data.code == 200) {
+    // const elt = document.createElement("a");
+    // elt.setAttribute(
+    //   "href",
+    //   "https://chtech.ncjti.edu.cn/carstop" + res.data.downurl
+    // );
+    // // elt.setAttribute("download", "file.xlsx");
+    // // elt.style.display = "none";
+    // document.body.appendChild(elt);
+    // elt.click();
+    var downloadPath = "https://chtech.ncjti.edu.cn/carstop" + res.data.downurl;
+    console.log("获得地址数据:", downloadPath);
+    var downloadLink = document.createElement("a");
+    downloadLink.style.display = "none"; // 使其隐藏
+    downloadLink.href = downloadPath;
+    downloadLink.download = "";
+    downloadLink.click();
+    document.body.appendChild(downloadLink);
+    document.body.removeChild(downloadLink);
+    ElMessage({
+      type: "success",
+      showClose: true,
+      message: res.data.message,
+      center: true,
+    });
+  } else {
+    ElMessage({
+      type: "error",
+      showClose: true,
+      message: res.data.message,
+      center: true,
+    });
+  }
+};
+// 多选框功能
+const handleSelectionChange = (val) => {
+  console.log(val);
+  selectData.list = val;
+};
+
+// 表格斑马纹颜色修改
+const tableRowClassName = ({ row, rowIndex }) => {
+  if (rowIndex % 2 === 0) {
+    return "even";
+  } else if (rowIndex % 2 !== 0) {
+    return "odd";
+  }
+  return "";
+};
+// 分页
+const handleCurrentChange = (value) => {
+  // console.log(value);
+  currentPage.value = value;
+  getList();
+};
+
+onBeforeMount(() => {
+  api.value = store.state.user.api;
+  getList();
+});
+onUnmounted(() => {
+  // document.removeEventListener("keyup", Enters);
+});
+</script>
+
+<style scoped lang="scss">
+.content-box {
+  width: calc(100% - 40px);
+  height: calc(100% - 105px);
+  margin: 20px auto;
+  background-color: #fff;
+  color: #fff;
+  display: flex;
+  flex-direction: column;
+
+  .left {
+    width: calc(100% - 60px);
+    display: flex;
+    align-items: center;
+    height: 60px;
+    margin: 0 30px;
+    border-bottom: 1px solid #ccc;
+    color: #000;
+    font-size: 18px;
+    font-weight: 600;
+    .camera {
+      margin-right: 15px;
+      color: #4392f7;
+    }
+  }
+  .middle {
+    width: calc(100% - 60px);
+    margin: 0 auto;
+
+    color: #000;
+    // border-bottom: 1px solid rgb(231, 231, 231);
+    .filter {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      margin: 10px 0 0 0;
+      .search {
+        margin-left: 0 !important;
+      }
+      .condition {
+        display: flex;
+        align-items: center;
+        margin: 10px 30px 10px 0;
+        :deep(.el-input .el-input__inner) {
+          font-size: 16px;
+        }
+        span {
+          margin: 0 10px 0 0;
+        }
+      }
+    }
+    .gongneng {
+      margin: 10px 0;
+    }
+    :deep(.cont) {
+      width: 60%;
+      margin: 20px auto;
+    }
+    :deep(.download) {
+      display: flex;
+      align-items: center;
+      margin: 10px;
+    }
+    :deep(.download span) {
+      font-size: 16px;
+      margin-left: 20px;
+    }
+    :deep(.cont .el-button) {
+      margin-left: 60px;
+      margin-bottom: 30px;
+    }
+
+    :deep(.cont .accomplish) {
+      width: 100%;
+      display: flex;
+      justify-content: center;
+    }
+    :deep(.cont .accomplish .el-button) {
+      width: 50%;
+      margin: 0;
+    }
+  }
+  .footer {
+    width: calc(100% - 60px);
+    flex: 1;
+    margin: 10px auto;
+    overflow: auto;
+
+    .el-table--fit {
+      height: 100%;
+      :deep(.el-table__header-wrapper) {
+        background-color: #000;
+        font-size: 16px;
+        color: #000;
+      }
+      :deep(.el-table__row) {
+        height: 50px;
+        font-size: 16px;
+        color: #000;
+      }
+      :deep(.el-table__row td) {
+        padding: 0;
+        border: 0;
+      }
+
+      .el-button--primary {
+        margin-left: 5px;
+      }
+      :deep(.el-table__body .even) {
+        background-color: #fff;
+      }
+      :deep(.el-table__body .odd) {
+        background-color: rgba(240, 243, 247, 1);
+      }
+      :deep(.look) {
+        padding: 5px 10px;
+        border-radius: 45px;
+        border: 0.74px solid rgba(30, 125, 251, 1);
+      }
+      :deep(.looks) {
+        padding: 5px 10px;
+        border-radius: 45px;
+        border: 0.74px solid #f56c6c;
+      }
+    }
+
+    // 添加员工弹窗样式
+    :deep(.addStaff) {
+      //   height: 420px;
+      border-radius: 11px;
+      .el-dialog__header {
+        border-radius: 11px 11px 0 0;
+        background: rgba(237, 241, 245, 1);
+        font-weight: 600;
+        margin: 0;
+        .el-dialog__headerbtn {
+          outline: none;
+        }
+      }
+      .el-dialog__body {
+        padding: 25px 20px 10px 20px;
+        .el-input {
+          width: 200px;
+        }
+        .options {
+          margin: 30px 0 10px 350px;
+          .el-form-item__content {
+            margin: 0 !important;
+          }
+        }
+      }
+    }
+  }
+  .el-pagination {
+    width: calc(100% - 60px);
+    height: 60px;
+    margin: 0 auto;
+    justify-content: flex-end;
+    :deep(.el-pagination__total) {
+      color: #000;
+    }
+    :deep(.el-pagination__goto) {
+      color: #000;
+    }
+    :deep(.el-pagination__classifier) {
+      color: #000;
+    }
+    :deep(.el-input__wrapper) {
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      box-shadow: none;
+    }
+    :deep(.el-pager li) {
+      margin: 0 5px;
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      background-color: transparent;
+    }
+    :deep(.el-pager li.is-active) {
+      background-color: rgba(30, 125, 251, 1);
+    }
+    :deep(.btn-prev) {
+      margin-right: 5px;
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      background-color: transparent;
+    }
+    :deep(.btn-next) {
+      margin-left: 5px;
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      background-color: transparent;
+    }
+  }
+}
+.el-input {
+  width: 192px;
+}
+</style>

src/views/driver/deposit.vue

@@ -0,0 +1,701 @@
+<template>
+  <div class="content-box">
+    <div class="left">
+      <!-- <el-icon :size="23" class="camera"><VideoCameraFilled /></el-icon> -->
+      <span class="cameratxt">司机提现管理</span>
+    </div>
+    <div class="middle">
+      <div class="filter">
+        <div class="condition">
+          <span>状态 : </span>
+          <el-select
+            style="width: 180px"
+            v-model="searchInput.car_number"
+            class="m-2"
+            placeholder="请选择状态"
+            :clearable="true"
+          >
+            <el-option label="已拒绝" value="已拒绝" />
+            <el-option label="已转账" value="已转账" />
+            <el-option label="待转账" value="待转账" />
+          </el-select>
+        </div>
+        <div class="condition">
+          <span>司机姓名 : </span>
+          <el-input
+            clearable
+            v-model="searchInput.name"
+            class="w-50 m-2"
+            placeholder="请输入司机姓名"
+            style="width: 150px"
+          />
+        </div>
+        <div class="condition">
+          <span>手机号码 : </span>
+          <el-input
+            clearable
+            v-model="searchInput.phone"
+            class="w-50 m-2"
+            placeholder="请输入手机号码"
+            style="width: 150px"
+          />
+        </div>
+        <div class="condition">
+          <span>申请时间 : </span>
+          <el-date-picker
+            v-model="searchInput.createTime"
+            type="datetimerange"
+            format="YYYY-MM-DD HH:mm:ss"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            range-separator="-"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+            :prefix-icon="Calendar"
+          />
+        </div>
+        <div class="condition">
+          <span>操作时间 : </span>
+          <el-date-picker
+            v-model="searchInput.createTime"
+            type="datetimerange"
+            format="YYYY-MM-DD HH:mm:ss"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            range-separator="-"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+            :prefix-icon="Calendar"
+          />
+        </div>
+        <el-button
+          style="margin-left: 20px"
+          color="rgba(61, 81, 232, 1)"
+          type="primary"
+          class="search"
+          @click="searchBtn"
+          ><el-icon><Search /></el-icon> <span>查询</span></el-button
+        >
+        <el-button
+          style="margin-left: 20px !important"
+          color="rgba(61, 81, 232, 1)"
+          type="primary"
+          class="search"
+          @click="searchRefresh"
+          ><el-icon><Refresh /></el-icon><span>重置</span></el-button
+        >
+
+        <el-button
+          color="rgba(61, 81, 232, 1)"
+          class="import"
+          type="primary"
+          @click="importExcel"
+          ><img
+            src="@/assets/import.png"
+            style="width: 14px; height: 14px; margin-right: 4px"
+            alt=""
+          />
+          <span>导出表单</span></el-button
+        >
+      </div>
+    </div>
+    <div class="footer">
+      <el-table
+        :row-class-name="tableRowClassName"
+        :data="tableData.list"
+        @selection-change="handleSelectionChange"
+        style="width: 100%"
+        :header-cell-style="{
+          background: 'rgba(240, 243, 247, 1)',
+          height: '50px',
+          border: 0,
+        }"
+      >
+        <!-- <el-table-column align="center" type="selection" width="80" /> -->
+        <el-table-column
+          type="index"
+          width="80"
+          align="center"
+          label="序号"
+          index="1"
+        />
+        <el-table-column align="center" prop="user_name" label="司机姓名" />
+        <el-table-column align="center" prop="user_phone" label="手机号码" />
+        <el-table-column align="center" prop="user_phone" label="身份证号" />
+        <el-table-column align="center" prop="user_phone" label="银行卡号" />
+        <el-table-column align="center" prop="user_phone" label="开户行" />
+        <el-table-column align="center" prop="user_phone" label="开户人姓名" />
+        <el-table-column align="center" prop="user_phone" label="提现金额" />
+        <el-table-column align="center" prop="user_phone" label="状态" />
+        <el-table-column align="center" prop="user_phone" label="手续费" />
+        <el-table-column align="center" prop="user_phone" label="当前余额" />
+        <el-table-column align="center" prop="user_phone" label="拒绝原因" />
+        <el-table-column align="center" prop="user_zz" label="申请时间" width="200"/>
+        <el-table-column
+          align="center"
+          prop="create_time"
+          label="转账拒绝时间"
+          width="200"
+        />
+        <el-table-column align="center" prop="create_time" label="转账订单号" />
+        <el-table-column align="center" label="操作" width="220">
+          <template #default="scope">
+            <el-button link type="primary" @click="pass(scope.row)"
+              ><div class="look">转账</div></el-button
+            >
+            <el-button link type="danger" @click="refuse(scope.row)"
+              ><div class="looks">拒绝</div></el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <!-- 添加员工弹窗 -->
+      <el-dialog
+        class="addStaff"
+        v-model="addDialogVisible"
+        :close-on-click-modal="false"
+        :close-on-press-escape="false"
+        :title="dialongTitle"
+        align-center
+        width="550"
+        :before-close="cancelAdd"
+      >
+        <el-form
+          ref="ruleFormRef"
+          :model="ruleForm"
+          :rules="rules"
+          label-width="100px"
+          class="demo-ruleForm"
+          :size="formSize"
+          label-position="left"
+          status-icon
+        >
+          <el-form-item label="审核内容 :" prop="textarea">
+            <el-input
+              v-model="ruleForm.textarea"
+              style="width: 360px"
+              :rows="5"
+              type="textarea"
+              placeholder="请输入审核内容"
+            />
+          </el-form-item>
+
+          <el-form-item class="options">
+            <el-button class="congzhi" @click="cancelAdd(ruleFormRef)"
+              >取消</el-button
+            >
+            <el-button
+              color="rgba(61, 81, 232, 1)"
+              class="queding"
+              type="primary"
+              @click="submitAdd(ruleFormRef)"
+            >
+              确定
+            </el-button>
+          </el-form-item>
+        </el-form>
+      </el-dialog>
+    </div>
+
+    <!-- 分页组件 -->
+    <el-pagination
+      background
+      :current-page="currentPage"
+      :page-size="pageSize"
+      layout="total, prev, pager, next, jumper, slot"
+      :total="total"
+      @update:current-page="handleCurrentChange"
+    />
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, nextTick, onBeforeMount, onUnmounted } from "vue";
+import { useRouter } from "vue-router";
+import { ElMessage, ElMessageBox } from "element-plus";
+import { Calendar } from "@element-plus/icons-vue";
+import vidiconsApi from "@/api/vidicons.js";
+import { dayjs } from "element-plus";
+import lodash from "lodash";
+import axios from "axios";
+import { useStore } from "vuex";
+const store = useStore();
+const router = useRouter();
+// 表格数据
+const tableData = reactive({ list: [] });
+const activeIndex = ref(); // 默认跳转路由
+const dialongTitle = ref("新增驾驶员"); // 弹窗标题
+const api = ref("");
+const searchInput = reactive({
+  name: "",
+  phone: "",
+  createTime: "",
+}); // 搜索按钮数据
+
+const currentPage = ref(1); // 当前页
+const pageSize = ref(10);
+const total = ref(); // 当前总数
+const selectData = reactive({ list: [] }); // 多选框选择的数据
+
+const addDialogVisible = ref(false); // 控制添加员工弹窗
+
+// 表单数据
+const formSize = ref("default");
+const ruleFormRef = ref();
+const ruleForm = reactive({
+  textarea: "",
+  id: "",
+});
+// 表单验证
+const rules = reactive({
+  textarea: [{ required: true, message: "审核内容不能为空", trigger: "blur" }],
+  // phone: [
+  //   { required: true, message: "请输入手机号", trigger: "blur" },
+  //   {
+  //     // pattern: /^((0\d{2,3}-\d{7,8})|(1[3584]\d{9}))$/,
+  //     pattern: /^((\(\+86\))|(\(86\)))?[1][3456789][0-9]{9}$/,
+  //     message: "请输入合法手机号/电话号",
+  //     trigger: "blur",
+  //   },
+  // ],
+});
+// 获取摄像头列表
+const getList = async (message) => {
+  let data = new FormData();
+  if (searchInput.createTime == null) {
+    searchInput.createTime = "";
+  }
+  data.set("user_name", searchInput.name);
+  data.set("user_phone", searchInput.phone);
+  data.set("create_time", searchInput.createTime); //前面的key记得对应！
+  data.set("page", currentPage.value);
+  data.set("rows", pageSize.value); //前面的key记得对应！
+  let res = await axios({
+    method: "post",
+    url: api.value + "/carBook/userlist.action",
+    headers: {
+      token: sessionStorage.getItem("token"),
+    },
+    data: data,
+  });
+  console.log(res);
+  if (res.status == 200) {
+    if (message) {
+      ElMessage({
+        type: "success",
+        showClose: true,
+        message: message,
+        center: true,
+      });
+    }
+    tableData.list = res.data.rows;
+    total.value = res.data.total;
+  } else {
+    tableData.list = res.data.rows;
+    currentPage.value = 1;
+    total.value = res.data.total;
+    ElMessage({
+      type: "error",
+      showClose: true,
+      message: res.data.message,
+      center: true,
+    });
+    if (res.data.message == "token错误") {
+      router.push({
+        path: `/login`,
+      });
+    }
+  }
+};
+
+// 搜索功能
+const searchBtn = lodash.debounce(async () => {
+  getList("查询成功");
+}, 300);
+// 重置搜索
+const searchRefresh = lodash.debounce(async () => {
+  searchInput.name = "";
+  searchInput.phone = "";
+  searchInput.createTime = "";
+  currentPage.value = 1;
+  getList();
+}, 300);
+// 拒绝
+const refuse = () => {
+  dialongTitle.value = "拒绝审核";
+  addDialogVisible.value = true;
+  ruleForm.textarea = "";
+};
+
+// 取消拒绝
+const cancelAdd = () => {
+  addDialogVisible.value = false;
+  ruleFormRef.value.resetFields();
+};
+// 确认添加员工
+const submitAdd = async (formEl) => {
+  if (!formEl) return;
+  await formEl.validate(async (valid, fields) => {
+    if (valid) {
+      let data = {
+        user_name: ruleForm.name,
+        user_phone: ruleForm.phone,
+        user_zz: ruleForm.post,
+        id: ruleForm.id,
+      };
+      let res = await axios({
+        method: "post",
+        url: api.value + "/carBook/userupdate.action",
+        headers: {
+          "Content-Type": "application/json;charset=utf-8",
+          token: sessionStorage.getItem("token"),
+        },
+        data: data,
+      });
+      // console.log(res, "修改账号");
+      if (res.data.code == 200) {
+        getList();
+
+        ElMessage({
+          type: "success",
+          showClose: true,
+          message: res.data.message,
+          center: true,
+        });
+        addDialogVisible.value = false;
+        ruleFormRef.value.resetFields();
+      } else {
+        ElMessage({
+          type: "error",
+          showClose: true,
+          message: res.data.message,
+          center: true,
+        });
+      }
+    } else {
+      console.log("error submit!", fields);
+    }
+  });
+};
+
+// 通过
+const pass = (row) => {
+  ElMessageBox.confirm(`是否通过审核`, "提示", {
+    confirmButtonText: "确认",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(async () => {
+      // let data = new FormData();
+      // data.set("id", row.id);
+      // let res = await axios({
+      //   method: "post",
+      //   url: api.value + "/carBook/userdel.action",
+      //   headers: {
+      //     token: sessionStorage.getItem("token"),
+      //   },
+      //   data: data,
+      // });
+      // if (res.data.code == 200) {
+      //   if (tableData.list.length == 1 && currentPage.value != 1) {
+      //     currentPage.value = currentPage.value - 1;
+      //   }
+      //   getList();
+      //   ElMessage({
+      //     type: "success",
+      //     showClose: true,
+      //     message: res.data.message,
+      //     center: true,
+      //   });
+      // } else {
+      //   ElMessage({
+      //     type: "error",
+      //     showClose: true,
+      //     message: res.data.message,
+      //     center: true,
+      //   });
+      // }
+    })
+    .catch(() => {});
+};
+//导出功能
+const importExcel = async () => {
+  if (searchInput.createTime == null) {
+    searchInput.createTime = "";
+  }
+  let data = new FormData();
+  data.set("user_name", searchInput.name);
+  data.set("user_phone", searchInput.phone);
+  data.set("create_time", searchInput.createTime);
+  let res = await axios({
+    method: "post",
+    url: api.value + "/carBook/usertoExcel.action",
+    headers: {
+      token: sessionStorage.getItem("token"),
+    },
+    data: data,
+  });
+  // console.log(res, "导出账号");
+  if (res.data.code == 200) {
+    // const elt = document.createElement("a");
+    // elt.setAttribute(
+    //   "href",
+    //   "https://chtech.ncjti.edu.cn/carstop" + res.data.downurl
+    // );
+    // // elt.setAttribute("download", "file.xlsx");
+    // // elt.style.display = "none";
+    // document.body.appendChild(elt);
+    // elt.click();
+    var downloadPath = "https://chtech.ncjti.edu.cn/carstop" + res.data.downurl;
+    console.log("获得地址数据:", downloadPath);
+    var downloadLink = document.createElement("a");
+    downloadLink.style.display = "none"; // 使其隐藏
+    downloadLink.href = downloadPath;
+    downloadLink.download = "";
+    downloadLink.click();
+    document.body.appendChild(downloadLink);
+    document.body.removeChild(downloadLink);
+    ElMessage({
+      type: "success",
+      showClose: true,
+      message: res.data.message,
+      center: true,
+    });
+  } else {
+    ElMessage({
+      type: "error",
+      showClose: true,
+      message: res.data.message,
+      center: true,
+    });
+  }
+};
+// 多选框功能
+const handleSelectionChange = (val) => {
+  console.log(val);
+  selectData.list = val;
+};
+
+// 表格斑马纹颜色修改
+const tableRowClassName = ({ row, rowIndex }) => {
+  if (rowIndex % 2 === 0) {
+    return "even";
+  } else if (rowIndex % 2 !== 0) {
+    return "odd";
+  }
+  return "";
+};
+// 分页
+const handleCurrentChange = (value) => {
+  // console.log(value);
+  currentPage.value = value;
+  getList();
+};
+
+onBeforeMount(() => {
+  api.value = store.state.user.api;
+  getList();
+});
+onUnmounted(() => {
+  // document.removeEventListener("keyup", Enters);
+});
+</script>
+
+<style scoped lang="scss">
+.content-box {
+  width: calc(100% - 40px);
+  height: calc(100% - 105px);
+  margin: 20px auto;
+  background-color: #fff;
+  color: #fff;
+  display: flex;
+  flex-direction: column;
+
+  .left {
+    width: calc(100% - 60px);
+    display: flex;
+    align-items: center;
+    height: 60px;
+    margin: 0 30px;
+    border-bottom: 1px solid #ccc;
+    color: #000;
+    font-size: 18px;
+    font-weight: 600;
+    .camera {
+      margin-right: 15px;
+      color: #4392f7;
+    }
+  }
+  .middle {
+    width: calc(100% - 60px);
+    margin: 0 auto;
+
+    color: #000;
+    // border-bottom: 1px solid rgb(231, 231, 231);
+    .filter {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      margin: 10px 0 0 0;
+      .search {
+        margin-left: 0 !important;
+      }
+      .condition {
+        display: flex;
+        align-items: center;
+        margin: 10px 30px 10px 0;
+        :deep(.el-input .el-input__inner) {
+          font-size: 16px;
+        }
+        span {
+          margin: 0 10px 0 0;
+        }
+      }
+    }
+    .gongneng {
+      margin: 10px 0;
+    }
+    :deep(.cont) {
+      width: 60%;
+      margin: 20px auto;
+    }
+    :deep(.download) {
+      display: flex;
+      align-items: center;
+      margin: 10px;
+    }
+    :deep(.download span) {
+      font-size: 16px;
+      margin-left: 20px;
+    }
+    :deep(.cont .el-button) {
+      margin-left: 60px;
+      margin-bottom: 30px;
+    }
+
+    :deep(.cont .accomplish) {
+      width: 100%;
+      display: flex;
+      justify-content: center;
+    }
+    :deep(.cont .accomplish .el-button) {
+      width: 50%;
+      margin: 0;
+    }
+  }
+  .footer {
+    width: calc(100% - 60px);
+    flex: 1;
+    margin: 10px auto;
+    overflow: auto;
+
+    .el-table--fit {
+      height: 100%;
+      :deep(.el-table__header-wrapper) {
+        background-color: #000;
+        font-size: 16px;
+        color: #000;
+      }
+      :deep(.el-table__row) {
+        height: 50px;
+        font-size: 16px;
+        color: #000;
+      }
+      :deep(.el-table__row td) {
+        padding: 0;
+        border: 0;
+      }
+
+      .el-button--primary {
+        margin-left: 5px;
+      }
+      :deep(.el-table__body .even) {
+        background-color: #fff;
+      }
+      :deep(.el-table__body .odd) {
+        background-color: rgba(240, 243, 247, 1);
+      }
+      :deep(.look) {
+        padding: 5px 10px;
+        border-radius: 45px;
+        border: 0.74px solid rgba(30, 125, 251, 1);
+      }
+      :deep(.looks) {
+        padding: 5px 10px;
+        border-radius: 45px;
+        border: 0.74px solid #f56c6c;
+      }
+    }
+
+    // 添加员工弹窗样式
+    :deep(.addStaff) {
+      //   height: 420px;
+      border-radius: 11px;
+      .el-dialog__header {
+        border-radius: 11px 11px 0 0;
+        background: rgba(237, 241, 245, 1);
+        font-weight: 600;
+        margin: 0;
+        .el-dialog__headerbtn {
+          outline: none;
+        }
+      }
+      .el-dialog__body {
+        padding: 25px 20px 10px 20px;
+        .el-input {
+          width: 200px;
+        }
+        .options {
+          margin: 30px 0 10px 350px;
+          .el-form-item__content {
+            margin: 0 !important;
+          }
+        }
+      }
+    }
+  }
+  .el-pagination {
+    width: calc(100% - 60px);
+    height: 60px;
+    margin: 0 auto;
+    justify-content: flex-end;
+    :deep(.el-pagination__total) {
+      color: #000;
+    }
+    :deep(.el-pagination__goto) {
+      color: #000;
+    }
+    :deep(.el-pagination__classifier) {
+      color: #000;
+    }
+    :deep(.el-input__wrapper) {
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      box-shadow: none;
+    }
+    :deep(.el-pager li) {
+      margin: 0 5px;
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      background-color: transparent;
+    }
+    :deep(.el-pager li.is-active) {
+      background-color: rgba(30, 125, 251, 1);
+    }
+    :deep(.btn-prev) {
+      margin-right: 5px;
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      background-color: transparent;
+    }
+    :deep(.btn-next) {
+      margin-left: 5px;
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      background-color: transparent;
+    }
+  }
+}
+.el-input {
+  width: 192px;
+}
+</style>

src/views/driver/management.vue

@@ -0,0 +1,704 @@
+<template>
+  <div class="content-box">
+    <div class="left">
+      <!-- <el-icon :size="23" class="camera"><VideoCameraFilled /></el-icon> -->
+      <span class="cameratxt">司机管理</span>
+    </div>
+    <div class="middle">
+      <div class="filter">
+        <div class="condition">
+          <span>司机姓名 : </span>
+          <el-input
+            clearable
+            v-model="searchInput.name"
+            class="w-50 m-2"
+            placeholder="请输入司机姓名"
+            style="width: 150px"
+          />
+        </div>
+        <div class="condition">
+          <span>手机号码 : </span>
+          <el-input
+            clearable
+            v-model="searchInput.phone"
+            class="w-50 m-2"
+            placeholder="请输入手机号码"
+            style="width: 150px"
+          />
+        </div>
+        <div class="condition">
+          <span>车牌号 : </span>
+          <el-input
+            clearable
+            v-model="searchInput.phone"
+            class="w-50 m-2"
+            placeholder="请输入车牌号"
+            style="width: 150px"
+          />
+        </div>
+        <el-button
+          style="margin-left: 20px"
+          color="rgba(61, 81, 232, 1)"
+          type="primary"
+          class="search"
+          @click="searchBtn"
+          ><el-icon><Search /></el-icon> <span>查询</span></el-button
+        >
+        <el-button
+          style="margin-left: 20px !important"
+          color="rgba(61, 81, 232, 1)"
+          type="primary"
+          class="search"
+          @click="searchRefresh"
+          ><el-icon><Refresh /></el-icon><span>重置</span></el-button
+        >
+
+        <el-button
+          color="rgba(61, 81, 232, 1)"
+          class="import"
+          type="primary"
+          @click="importExcel"
+          ><img
+            src="@/assets/import.png"
+            style="width: 14px; height: 14px; margin-right: 4px"
+            alt=""
+          />
+          <span>导出表单</span></el-button
+        >
+      </div>
+    </div>
+    <div class="footer">
+      <el-table
+        :row-class-name="tableRowClassName"
+        :data="tableData.list"
+        @selection-change="handleSelectionChange"
+        style="width: 100%"
+        :header-cell-style="{
+          background: 'rgba(240, 243, 247, 1)',
+          height: '50px',
+          border: 0,
+        }"
+      >
+        <!-- <el-table-column align="center" type="selection" width="80" /> -->
+        <el-table-column
+          type="index"
+          width="80"
+          align="center"
+          label="序号"
+          index="1"
+        />
+        <el-table-column align="center" prop="user_name" label="司机姓名" />
+        <el-table-column align="center" prop="user_phone" label="手机号码" />
+        <el-table-column align="center" prop="user_phone" label="车辆型号" />
+        <el-table-column align="center" prop="user_phone" label="颜色" />
+        <el-table-column align="center" prop="user_phone" label="车牌号" />
+        <el-table-column align="center" prop="user_phone" label="接单状态" />
+        <el-table-column align="center" prop="user_phone" label="保证金" />
+        <el-table-column align="center" prop="user_phone" label="订单数量" />
+        <el-table-column align="center" prop="user_phone" label="保证金" />
+        <el-table-column align="center" prop="user_zz" label="订单数量" />
+        <el-table-column align="center" prop="create_time" label="审核时间" />
+        <el-table-column align="center" prop="create_time" label="创建时间" />
+        <el-table-column align="center" label="操作" width="320">
+          <template #default="scope">
+            <el-button link type="primary" @click="money(scope.row)"
+              ><div class="look">保证金明细</div></el-button
+            >
+            <el-button link type="primary" @click="account(scope.row)"
+              ><div class="look">司机账户明细</div></el-button
+            >
+            <el-button link type="danger" @click="banned(scope.row)"
+              ><div class="looks">封禁</div></el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <!-- 保证金明细 -->
+      <el-dialog
+        class="addStaff"
+        v-model="addDialogVisible"
+        :close-on-click-modal="false"
+        :close-on-press-escape="false"
+        title="保证金明细"
+        align-center
+        width="1250"
+        :before-close="cancelAdd"
+      >
+        <el-table
+          :row-class-name="tableRowClassName"
+          :data="tableData.list"
+          @selection-change="handleSelectionChange"
+          style="width: 100%"
+          :header-cell-style="{
+            background: 'rgba(240, 243, 247, 1)',
+            height: '50px',
+            border: 0,
+          }"
+        >
+          <el-table-column
+            type="index"
+            width="100"
+            align="center"
+            label="序号"
+            index="1"
+          />
+          <el-table-column align="center" prop="user_name" label="保证金" />
+          <el-table-column align="center" prop="user_phone" label="标题" />
+          <el-table-column align="center" prop="user_phone" label="内容" />
+          <el-table-column align="center" prop="create_time" label="创建时间" />
+          <el-table-column align="center" prop="create_time" label="状态" />
+        </el-table>
+        <el-pagination
+          background
+          :current-page="currentPage1"
+          :page-size="pageSize1"
+          layout="total, prev, pager, next, jumper, slot"
+          :total="total1"
+          @update:current-page="handleCurrentChange1"
+        />
+      </el-dialog>
+
+      <!-- 司机账户明细 -->
+      <el-dialog
+        class="accountStaff"
+        v-model="accountDialogVisible"
+        :close-on-click-modal="false"
+        :close-on-press-escape="false"
+        title="司机账户明细"
+        align-center
+        width="1250"
+        :before-close="cancelAccount"
+      >
+        <div class="money">
+          <span>可提现金额</span>
+          <span>400元</span>
+        </div>
+        <div class="table">
+          <el-table
+            :row-class-name="tableRowClassName"
+            :data="tableData.list"
+            @selection-change="handleSelectionChange"
+            style="width: 100%"
+            :header-cell-style="{
+              background: 'rgba(240, 243, 247, 1)',
+              height: '50px',
+              border: 0,
+            }"
+          >
+            <el-table-column
+              type="index"
+              width="100"
+              align="center"
+              label="序号"
+              index="1"
+            />
+            <el-table-column align="center" prop="user_phone" label="标题" />
+            <el-table-column align="center" prop="user_phone" label="内容" />
+            <el-table-column align="center" prop="create_time" label="金额" />
+            <el-table-column
+              align="center"
+              prop="create_time"
+              label="创建时间"
+            />
+          </el-table>
+          <el-pagination
+            background
+            :current-page="currentPage2"
+            :page-size="pageSize2"
+            layout="total, prev, pager, next, jumper, slot"
+            :total="total2"
+            @update:current-page="handleCurrentChange2"
+          />
+        </div>
+      </el-dialog>
+    </div>
+
+    <!-- 分页组件 -->
+    <el-pagination
+      background
+      :current-page="currentPage"
+      layout="total, prev, pager, next, jumper, slot"
+      :total="total"
+      @update:current-page="handleCurrentChange"
+    />
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, nextTick, onBeforeMount, onUnmounted } from "vue";
+import { useRouter } from "vue-router";
+import { ElMessage, ElMessageBox } from "element-plus";
+import { Calendar } from "@element-plus/icons-vue";
+import vidiconsApi from "@/api/vidicons.js";
+import { dayjs } from "element-plus";
+import lodash from "lodash";
+import axios from "axios";
+import { useStore } from "vuex";
+const store = useStore();
+const router = useRouter();
+// 表格数据
+const tableData = reactive({ list: [] });
+const activeIndex = ref(); // 默认跳转路由
+const dialongTitle = ref("新增驾驶员"); // 弹窗标题
+const api = ref("");
+const searchInput = reactive({
+  name: "",
+  phone: "",
+  createTime: "",
+}); // 搜索按钮数据
+
+const currentPage = ref(1); // 当前页
+const pageSize = ref(10);
+const total = ref(10); // 当前总数
+const selectData = reactive({ list: [] }); // 多选框选择的数据
+
+const addDialogVisible = ref(false); // 控制添加员工弹窗
+const currentPage1 = ref(1); // 当前页
+const pageSize1 = ref(10);
+const total1 = ref(10); // 当前总数
+
+const accountDialogVisible = ref(false); // 控制添加员工弹窗
+const currentPage2 = ref(1); // 当前页
+const pageSize2 = ref(10);
+const total2 = ref(10); // 当前总数
+
+// 获取摄像头列表
+const getList = async (message) => {
+  let data = new FormData();
+  if (searchInput.createTime == null) {
+    searchInput.createTime = "";
+  }
+  data.set("user_name", searchInput.name);
+  data.set("user_phone", searchInput.phone);
+  data.set("create_time", searchInput.createTime); //前面的key记得对应！
+  data.set("page", currentPage.value);
+  data.set("rows", pageSize.value); //前面的key记得对应！
+  let res = await axios({
+    method: "post",
+    url: api.value + "/carBook/userlist.action",
+    headers: {
+      token: sessionStorage.getItem("token"),
+    },
+    data: data,
+  });
+  console.log(res);
+  if (res.status == 200) {
+    if (message) {
+      ElMessage({
+        type: "success",
+        showClose: true,
+        message: message,
+        center: true,
+      });
+    }
+    tableData.list = res.data.rows;
+    total.value = res.data.total;
+  } else {
+    tableData.list = res.data.rows;
+    currentPage.value = 1;
+    total.value = res.data.total;
+    ElMessage({
+      type: "error",
+      showClose: true,
+      message: res.data.message,
+      center: true,
+    });
+    if (res.data.message == "token错误") {
+      router.push({
+        path: `/login`,
+      });
+    }
+  }
+};
+
+// 搜索功能
+const searchBtn = lodash.debounce(async () => {
+  getList("查询成功");
+}, 300);
+// 重置搜索
+const searchRefresh = lodash.debounce(async () => {
+  searchInput.name = "";
+  searchInput.phone = "";
+  searchInput.createTime = "";
+  currentPage.value = 1;
+  getList();
+}, 300);
+// 保证金明细
+const money = () => {
+  addDialogVisible.value = true;
+};
+// 取消保证金明细
+const cancelAdd = () => {
+  addDialogVisible.value = false;
+};
+
+// 司机账户明细
+const account = () => {
+  accountDialogVisible.value = true;
+};
+// 取消保证金明细
+const cancelAccount = () => {
+  accountDialogVisible.value = false;
+};
+
+// 通过
+const banned = (row) => {
+  ElMessageBox.confirm(`是否封禁`, "提示", {
+    confirmButtonText: "确认",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(async () => {
+      // let data = new FormData();
+      // data.set("id", row.id);
+      // let res = await axios({
+      //   method: "post",
+      //   url: api.value + "/carBook/userdel.action",
+      //   headers: {
+      //     token: sessionStorage.getItem("token"),
+      //   },
+      //   data: data,
+      // });
+      // if (res.data.code == 200) {
+      //   if (tableData.list.length == 1 && currentPage.value != 1) {
+      //     currentPage.value = currentPage.value - 1;
+      //   }
+      //   getList();
+      //   ElMessage({
+      //     type: "success",
+      //     showClose: true,
+      //     message: res.data.message,
+      //     center: true,
+      //   });
+      // } else {
+      //   ElMessage({
+      //     type: "error",
+      //     showClose: true,
+      //     message: res.data.message,
+      //     center: true,
+      //   });
+      // }
+    })
+    .catch(() => {});
+};
+//导出功能
+const importExcel = async () => {
+  if (searchInput.createTime == null) {
+    searchInput.createTime = "";
+  }
+  let data = new FormData();
+  data.set("user_name", searchInput.name);
+  data.set("user_phone", searchInput.phone);
+  data.set("create_time", searchInput.createTime);
+  let res = await axios({
+    method: "post",
+    url: api.value + "/carBook/usertoExcel.action",
+    headers: {
+      token: sessionStorage.getItem("token"),
+    },
+    data: data,
+  });
+  // console.log(res, "导出账号");
+  if (res.data.code == 200) {
+    // const elt = document.createElement("a");
+    // elt.setAttribute(
+    //   "href",
+    //   "https://chtech.ncjti.edu.cn/carstop" + res.data.downurl
+    // );
+    // // elt.setAttribute("download", "file.xlsx");
+    // // elt.style.display = "none";
+    // document.body.appendChild(elt);
+    // elt.click();
+    var downloadPath = "https://chtech.ncjti.edu.cn/carstop" + res.data.downurl;
+    console.log("获得地址数据:", downloadPath);
+    var downloadLink = document.createElement("a");
+    downloadLink.style.display = "none"; // 使其隐藏
+    downloadLink.href = downloadPath;
+    downloadLink.download = "";
+    downloadLink.click();
+    document.body.appendChild(downloadLink);
+    document.body.removeChild(downloadLink);
+    ElMessage({
+      type: "success",
+      showClose: true,
+      message: res.data.message,
+      center: true,
+    });
+  } else {
+    ElMessage({
+      type: "error",
+      showClose: true,
+      message: res.data.message,
+      center: true,
+    });
+  }
+};
+// 多选框功能
+const handleSelectionChange = (val) => {
+  console.log(val);
+  selectData.list = val;
+};
+
+// 表格斑马纹颜色修改
+const tableRowClassName = ({ row, rowIndex }) => {
+  if (rowIndex % 2 === 0) {
+    return "even";
+  } else if (rowIndex % 2 !== 0) {
+    return "odd";
+  }
+  return "";
+};
+// 分页
+const handleCurrentChange = (value) => {
+  // console.log(value);
+  currentPage.value = value;
+  getList();
+};
+// 分页
+const handleCurrentChange1 = (value) => {
+  // console.log(value);
+  currentPage1.value = value;
+  getList();
+};
+// 分页
+const handleCurrentChange2 = (value) => {
+  // console.log(value);
+  currentPage2.value = value;
+  getList();
+};
+
+onBeforeMount(() => {
+  api.value = store.state.user.api;
+  getList();
+});
+onUnmounted(() => {
+  // document.removeEventListener("keyup", Enters);
+});
+</script>
+
+<style scoped lang="scss">
+.content-box {
+  width: calc(100% - 40px);
+  height: calc(100% - 105px);
+  margin: 20px auto;
+  background-color: #fff;
+  color: #fff;
+  display: flex;
+  flex-direction: column;
+
+  .left {
+    width: calc(100% - 60px);
+    display: flex;
+    align-items: center;
+    height: 60px;
+    margin: 0 30px;
+    border-bottom: 1px solid #ccc;
+    color: #000;
+    font-size: 18px;
+    font-weight: 600;
+    .camera {
+      margin-right: 15px;
+      color: #4392f7;
+    }
+  }
+  .middle {
+    width: calc(100% - 60px);
+    margin: 0 auto;
+
+    color: #000;
+    // border-bottom: 1px solid rgb(231, 231, 231);
+    .filter {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      margin: 10px 0 0 0;
+      .search {
+        margin-left: 0 !important;
+      }
+      .condition {
+        display: flex;
+        align-items: center;
+        margin: 10px 30px 10px 0;
+        :deep(.el-input .el-input__inner) {
+          font-size: 16px;
+        }
+        span {
+          margin: 0 10px 0 0;
+        }
+      }
+    }
+    .gongneng {
+      margin: 10px 0;
+    }
+    :deep(.cont) {
+      width: 60%;
+      margin: 20px auto;
+    }
+    :deep(.download) {
+      display: flex;
+      align-items: center;
+      margin: 10px;
+    }
+    :deep(.download span) {
+      font-size: 16px;
+      margin-left: 20px;
+    }
+    :deep(.cont .el-button) {
+      margin-left: 60px;
+      margin-bottom: 30px;
+    }
+
+    :deep(.cont .accomplish) {
+      width: 100%;
+      display: flex;
+      justify-content: center;
+    }
+    :deep(.cont .accomplish .el-button) {
+      width: 50%;
+      margin: 0;
+    }
+  }
+  .footer {
+    width: calc(100% - 60px);
+    flex: 1;
+    margin: 10px auto;
+    overflow: auto;
+
+    .el-table--fit {
+      height: 100%;
+      :deep(.el-table__header-wrapper) {
+        background-color: #000;
+        font-size: 16px;
+        color: #000;
+      }
+      :deep(.el-table__row) {
+        height: 50px;
+        font-size: 16px;
+        color: #000;
+      }
+      :deep(.el-table__row td) {
+        padding: 0;
+        border: 0;
+      }
+
+      .el-button--primary {
+        margin-left: 5px;
+      }
+      :deep(.el-table__body .even) {
+        background-color: #fff;
+      }
+      :deep(.el-table__body .odd) {
+        background-color: rgba(240, 243, 247, 1);
+      }
+      :deep(.look) {
+        padding: 5px 10px;
+        border-radius: 45px;
+        border: 0.74px solid rgba(30, 125, 251, 1);
+      }
+      :deep(.looks) {
+        padding: 5px 10px;
+        border-radius: 45px;
+        border: 0.74px solid #f56c6c;
+      }
+    }
+
+    // 添加员工弹窗样式
+    :deep(.addStaff) {
+      //   height: 420px;
+      border-radius: 11px;
+      .el-dialog__header {
+        border-radius: 11px 11px 0 0;
+        background: rgba(237, 241, 245, 1);
+        font-weight: 600;
+        margin: 0;
+        .el-dialog__headerbtn {
+          outline: none;
+        }
+      }
+      .el-dialog__body {
+        padding: 25px 25px 10px 25px;
+        
+      }
+    }
+
+    :deep(.accountStaff) {
+      //   height: 420px;
+      border-radius: 11px;
+      .el-dialog__header {
+        border-radius: 11px 11px 0 0;
+        background: rgba(237, 241, 245, 1);
+        font-weight: 600;
+        margin: 0;
+        .el-dialog__headerbtn {
+          outline: none;
+        }
+      }
+      .el-dialog__body {
+        padding: 25px 25px 10px 25px;
+        display: flex;
+        .money {
+          width: 180px;
+          height: 100px;
+          border: 1px solid #000;
+          margin-right: 20px;
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          justify-content: center;
+        }
+        .table {
+          flex: 1;
+        }
+        .el-table--fit {
+          height: 600px;
+        }
+      }
+    }
+  }
+  .el-pagination {
+    width: calc(100% - 60px);
+    height: 60px;
+    margin: 0 auto;
+    justify-content: flex-end;
+    :deep(.el-pagination__total) {
+      color: #000;
+    }
+    :deep(.el-pagination__goto) {
+      color: #000;
+    }
+    :deep(.el-pagination__classifier) {
+      color: #000;
+    }
+    :deep(.el-input__wrapper) {
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      box-shadow: none;
+    }
+    :deep(.el-pager li) {
+      margin: 0 5px;
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      background-color: transparent;
+    }
+    :deep(.el-pager li.is-active) {
+      background-color: rgba(30, 125, 251, 1);
+    }
+    :deep(.btn-prev) {
+      margin-right: 5px;
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      background-color: transparent;
+    }
+    :deep(.btn-next) {
+      margin-left: 5px;
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      background-color: transparent;
+    }
+  }
+}
+// .el-input {
+//   width: 192px;
+// }
+</style>

src/views/driver/order.vue

@@ -0,0 +1,641 @@
+<template>
+  <div class="content-box">
+    <div class="left">
+      <!-- <el-icon :size="23" class="camera"><VideoCameraFilled /></el-icon> -->
+      <span class="cameratxt">订单管理</span>
+    </div>
+    <div class="middle">
+      <div class="filter">
+        <div class="condition">
+          <span>状态 : </span>
+          <el-select
+            style="width: 180px"
+            v-model="searchInput.car_number"
+            class="m-2"
+            placeholder="请选择状态"
+            :clearable="true"
+          >
+            <el-option label="全部" value="全部" />
+            <el-option label="队列中" value="队列中" />
+            <el-option label="待出发" value="待出发" />
+            <el-option label="行程中" value="行程中" />
+            <el-option label="已完成" value="已完成" />
+            <el-option label="已取消" value="已取消" />
+          </el-select>
+        </div>
+        <div class="condition">
+          <span>用户手机号 : </span>
+          <el-input
+            clearable
+            v-model="searchInput.phone"
+            class="w-50 m-2"
+            placeholder="请输入用户手机号"
+            style="width: 150px"
+          />
+        </div>
+        <div class="condition">
+          <span>出发地 : </span>
+          <el-select
+            style="width: 180px"
+            v-model="searchInput.car_number"
+            class="m-2"
+            placeholder="请选择出发地"
+            :clearable="true"
+          >
+            <el-option label="全部" value="全部" />
+            <el-option label="队列中" value="队列中" />
+            <el-option label="待出发" value="待出发" />
+            <el-option label="行程中" value="行程中" />
+            <el-option label="已完成" value="已完成" />
+            <el-option label="已取消" value="已取消" />
+          </el-select>
+        </div>
+        <div class="condition">
+          <span>目的地 : </span>
+          <el-select
+            style="width: 180px"
+            v-model="searchInput.car_number"
+            class="m-2"
+            placeholder="请选择目的地"
+            :clearable="true"
+          >
+            <el-option label="全部" value="全部" />
+            <el-option label="队列中" value="队列中" />
+            <el-option label="待出发" value="待出发" />
+            <el-option label="行程中" value="行程中" />
+            <el-option label="已完成" value="已完成" />
+            <el-option label="已取消" value="已取消" />
+          </el-select>
+        </div>
+        <div class="condition">
+          <span>订单号 : </span>
+          <el-input
+            clearable
+            v-model="searchInput.phone"
+            class="w-50 m-2"
+            placeholder="请输入订单号"
+            style="width: 150px"
+          />
+        </div>
+        <div class="condition">
+          <span>司机姓名 : </span>
+          <el-input
+            clearable
+            v-model="searchInput.phone"
+            class="w-50 m-2"
+            placeholder="请输入司机姓名"
+            style="width: 150px"
+          />
+        </div>
+        <div class="condition">
+          <span>司机手机号 : </span>
+          <el-input
+            clearable
+            v-model="searchInput.phone"
+            class="w-50 m-2"
+            placeholder="请输入司机手机号"
+            style="width: 150px"
+          />
+        </div>
+        <div class="condition">
+          <span>车牌号 : </span>
+          <el-input
+            clearable
+            v-model="searchInput.phone"
+            class="w-50 m-2"
+            placeholder="请输入车牌号"
+            style="width: 150px"
+          />
+        </div>
+        <div class="condition">
+          <span>乘车时间 : </span>
+          <el-date-picker
+            v-model="searchInput.createTime"
+            type="datetimerange"
+            format="YYYY-MM-DD HH:mm:ss"
+            value-format="YYYY-MM-DD HH:mm:ss"
+            range-separator="-"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+            :prefix-icon="Calendar"
+          />
+        </div>
+      </div>
+      <!-- 按钮列表 -->
+      <div class="gongneng">
+        <el-button
+          color="rgba(61, 81, 232, 1)"
+          type="primary"
+          class="search"
+          @click="searchBtn"
+          ><el-icon><Search /></el-icon> <span>查询</span></el-button
+        >
+        <el-button
+          color="rgba(61, 81, 232, 1)"
+          type="primary"
+          class="search"
+          @click="searchRefresh"
+          ><el-icon><Refresh /></el-icon><span>重置</span></el-button
+        >
+        <el-button
+          color="rgba(61, 81, 232, 1)"
+          class="import"
+          type="primary"
+          @click="importExcel"
+          ><img
+            src="@/assets/import.png"
+            style="width: 14px; height: 14px; margin-right: 4px"
+            alt=""
+          />
+          <span>导出表单</span></el-button
+        >
+      </div>
+    </div>
+    <div class="footer">
+      <el-table
+        :row-class-name="tableRowClassName"
+        :data="tableData.list"
+        @selection-change="handleSelectionChange"
+        style="width: 100%"
+        :header-cell-style="{
+          background: 'rgba(240, 243, 247, 1)',
+          height: '50px',
+          border: 0,
+        }"
+      >
+        <!-- <el-table-column align="center" type="selection" width="80" /> -->
+        <el-table-column
+          type="index"
+          width="80"
+          align="center"
+          label="序号"
+          index="1"
+        />
+        <el-table-column align="center" prop="user_name" label="用户手机号" />
+        <el-table-column
+          align="center"
+          prop="user_zz"
+          label="出发地"
+        />
+        <el-table-column align="center" prop="user_phone" label="目的地" />
+        <el-table-column align="center" prop="user_phone" width="200" label="乘车时间" />
+        <el-table-column align="center" prop="user_phone" label="乘车人数" />
+        <el-table-column align="center" prop="user_phone" width="200"  label="报名时间" />
+        <el-table-column align="center" prop="user_phone" label="订单号" />
+        <el-table-column align="center" prop="user_phone" label="订单价格" />
+        <el-table-column align="center" prop="user_phone" width="200"  label="司机接单时间" />
+        <el-table-column align="center" prop="user_phone" label="司机姓名" />
+        <el-table-column align="center" prop="user_phone" label="司机手机号" />
+        <el-table-column align="center" prop="user_phone" label="车辆型号" />
+        <el-table-column align="center" prop="user_phone" label="车辆颜色" />
+        <el-table-column align="center" prop="user_phone" label="车牌号" />
+        <el-table-column align="center" prop="user_phone" width="200"  label="行程开始时间" />
+        <el-table-column align="center" prop="user_phone" width="200"  label="行程结束时间" />
+        <el-table-column align="center" prop="user_phone" label="状态" />
+        <el-table-column align="center" label="操作" width="220">
+          <template #default="scope">
+            <el-button link type="primary" @click="depart(scope.row)"
+              ><div class="look">发车</div></el-button
+            >
+            <el-button link type="danger" @click="departCancel(scope.row)"
+              ><div class="looks">取消</div></el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+
+    <!-- 分页组件 -->
+    <el-pagination
+      background
+      :current-page="currentPage"
+      :page-size="pageSize"
+      layout="total, prev, pager, next, jumper, slot"
+      :total="total"
+      @update:current-page="handleCurrentChange"
+    />
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, nextTick, onBeforeMount, onUnmounted } from "vue";
+import { useRouter } from "vue-router";
+import { ElMessage, ElMessageBox } from "element-plus";
+import { Calendar } from "@element-plus/icons-vue";
+import vidiconsApi from "@/api/vidicons.js";
+import { dayjs } from "element-plus";
+import lodash from "lodash";
+import axios from "axios";
+import { useStore } from "vuex";
+const store = useStore();
+const router = useRouter();
+// 表格数据
+const tableData = reactive({ list: [] });
+const activeIndex = ref(); // 默认跳转路由
+const dialongTitle = ref("新增驾驶员"); // 弹窗标题
+const api = ref("");
+const searchInput = reactive({
+  name: "",
+  phone: "",
+  createTime: "",
+}); // 搜索按钮数据
+
+const currentPage = ref(1); // 当前页
+const pageSize = ref(10);
+const total = ref(); // 当前总数
+const selectData = reactive({ list: [] }); // 多选框选择的数据
+
+const addDialogVisible = ref(false); // 控制添加员工弹窗
+
+// 获取摄像头列表
+const getList = async (message) => {
+  let data = new FormData();
+  if (searchInput.createTime == null) {
+    searchInput.createTime = "";
+  }
+  data.set("user_name", searchInput.name);
+  data.set("user_phone", searchInput.phone);
+  data.set("create_time", searchInput.createTime); //前面的key记得对应！
+  data.set("page", currentPage.value);
+  data.set("rows", pageSize.value); //前面的key记得对应！
+  // let res = await adminApi.adminLogin(data);
+  let res = await axios({
+    method: "post",
+    url: api.value + "/carBook/userlist.action",
+    headers: {
+      token: sessionStorage.getItem("token"),
+    },
+    data: data,
+  });
+  console.log(res);
+  if (res.status == 200) {
+    if (message) {
+      ElMessage({
+        type: "success",
+        showClose: true,
+        message: message,
+        center: true,
+      });
+    }
+    // ElMessage({
+    //   type: "success",
+    //   showClose: true,
+    //   message: res.data.message,
+    //   center: true,
+    // });
+    tableData.list = res.data.rows;
+    // currentPage.value = res.data.currentPage;
+    total.value = res.data.total;
+  } else {
+    tableData.list = res.data.rows;
+    currentPage.value = 1;
+    total.value = res.data.total;
+    ElMessage({
+      type: "error",
+      showClose: true,
+      message: res.data.message,
+      center: true,
+    });
+    if (res.data.message == "token错误") {
+      router.push({
+        path: `/login`,
+      });
+    }
+  }
+  // console.log(res);
+};
+
+// 搜索功能
+const searchBtn = lodash.debounce(async () => {
+  getList("查询成功");
+}, 300);
+// 重置搜索
+const searchRefresh = lodash.debounce(async () => {
+  searchInput.name = "";
+  searchInput.phone = "";
+  searchInput.createTime = "";
+  currentPage.value = 1;
+  getList();
+}, 300);
+
+//删除按钮
+const departCancel = (row) => {
+  ElMessageBox.confirm(`是否取消此订单?`, "提示", {
+    confirmButtonText: "确认",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(async () => {
+      // let data = new FormData();
+      // data.set("id", row.id);
+      // let res = await axios({
+      //   method: "post",
+      //   url: api.value + "/carBook/userdel.action",
+      //   headers: {
+      //     token: sessionStorage.getItem("token"),
+      //   },
+      //   data: data,
+      // });
+      // if (res.data.code == 200) {
+      //   if (tableData.list.length == 1 && currentPage.value != 1) {
+      //     currentPage.value = currentPage.value - 1;
+      //   }
+      //   getList();
+      //   ElMessage({
+      //     type: "success",
+      //     showClose: true,
+      //     message: res.data.message,
+      //     center: true,
+      //   });
+      // } else {
+      //   ElMessage({
+      //     type: "error",
+      //     showClose: true,
+      //     message: res.data.message,
+      //     center: true,
+      //   });
+      // }
+    })
+    .catch(() => {
+      
+    });
+};
+//导出功能
+const importExcel = async () => {
+  if (searchInput.createTime == null) {
+    searchInput.createTime = "";
+  }
+  let data = new FormData();
+  data.set("user_name", searchInput.name);
+  data.set("user_phone", searchInput.phone);
+  data.set("create_time", searchInput.createTime);
+  let res = await axios({
+    method: "post",
+    url: api.value + "/carBook/usertoExcel.action",
+    headers: {
+      token: sessionStorage.getItem("token"),
+    },
+    data: data,
+  });
+  // console.log(res, "导出账号");
+  if (res.data.code == 200) {
+    // const elt = document.createElement("a");
+    // elt.setAttribute(
+    //   "href",
+    //   "https://chtech.ncjti.edu.cn/carstop" + res.data.downurl
+    // );
+    // // elt.setAttribute("download", "file.xlsx");
+    // // elt.style.display = "none";
+    // document.body.appendChild(elt);
+    // elt.click();
+    var downloadPath = "https://chtech.ncjti.edu.cn/carstop" + res.data.downurl;
+    console.log("获得地址数据:", downloadPath);
+    var downloadLink = document.createElement("a");
+    downloadLink.style.display = "none"; // 使其隐藏
+    downloadLink.href = downloadPath;
+    downloadLink.download = "";
+    downloadLink.click();
+    document.body.appendChild(downloadLink);
+    document.body.removeChild(downloadLink);
+    ElMessage({
+      type: "success",
+      showClose: true,
+      message: res.data.message,
+      center: true,
+    });
+  } else {
+    ElMessage({
+      type: "error",
+      showClose: true,
+      message: res.data.message,
+      center: true,
+    });
+  }
+};
+// 多选框功能
+const handleSelectionChange = (val) => {
+  console.log(val);
+  selectData.list = val;
+};
+
+// 表格斑马纹颜色修改
+const tableRowClassName = ({ row, rowIndex }) => {
+  if (rowIndex % 2 === 0) {
+    return "even";
+  } else if (rowIndex % 2 !== 0) {
+    return "odd";
+  }
+  return "";
+};
+// 分页
+const handleCurrentChange = (value) => {
+  // console.log(value);
+  currentPage.value = value;
+  getList();
+};
+
+onBeforeMount(() => {
+  api.value = store.state.user.api;
+  getList();
+});
+onUnmounted(() => {
+  // document.removeEventListener("keyup", Enters);
+});
+</script>
+
+<style scoped lang="scss">
+.content-box {
+  width: calc(100% - 40px);
+  height: calc(100% - 105px);
+  margin: 20px auto;
+  background-color: #fff;
+  color: #fff;
+  display: flex;
+  flex-direction: column;
+
+  .left {
+    width: calc(100% - 60px);
+    display: flex;
+    align-items: center;
+    height: 60px;
+    margin: 0 30px;
+    border-bottom: 1px solid #ccc;
+    color: #000;
+    font-size: 18px;
+    font-weight: 600;
+    .camera {
+      margin-right: 15px;
+      color: #4392f7;
+    }
+  }
+  .middle {
+    width: calc(100% - 60px);
+    margin: 0 auto;
+
+    color: #000;
+    // border-bottom: 1px solid rgb(231, 231, 231);
+    .filter {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      margin: 10px 0 0 0;
+      .search {
+        margin-left: 0 !important;
+      }
+      .condition {
+        display: flex;
+        align-items: center;
+        margin: 10px 30px 10px 0;
+        :deep(.el-input .el-input__inner) {
+          font-size: 16px;
+        }
+        span {
+          margin: 0 10px 0 0;
+        }
+      }
+    }
+    .gongneng {
+      margin: 10px 0;
+    }
+    :deep(.cont) {
+      width: 60%;
+      margin: 20px auto;
+    }
+    :deep(.download) {
+      display: flex;
+      align-items: center;
+      margin: 10px;
+    }
+    :deep(.download span) {
+      font-size: 16px;
+      margin-left: 20px;
+    }
+    :deep(.cont .el-button) {
+      margin-left: 60px;
+      margin-bottom: 30px;
+    }
+
+    :deep(.cont .accomplish) {
+      width: 100%;
+      display: flex;
+      justify-content: center;
+    }
+    :deep(.cont .accomplish .el-button) {
+      width: 50%;
+      margin: 0;
+    }
+  }
+  .footer {
+    width: calc(100% - 60px);
+    flex:1;
+    margin: 10px auto;
+    overflow: auto;
+    
+    .el-table--fit {
+      height: 100%;
+      :deep(.el-table__header-wrapper) {
+        background-color: #000;
+        font-size: 16px;
+        color: #000;
+      }
+      :deep(.el-table__row) {
+        height: 50px;
+        font-size: 16px;
+        color: #000;
+      }
+      :deep(.el-table__row td) {
+        padding: 0;
+        border: 0;
+      }
+
+      .el-button--primary {
+        margin-left: 5px;
+      }
+      :deep(.el-table__body .even) {
+        background-color: #fff;
+      }
+      :deep(.el-table__body .odd) {
+        background-color: rgba(240, 243, 247, 1);
+      }
+      :deep(.look) {
+        padding: 5px 10px;
+        border-radius: 45px;
+        border: 0.74px solid rgba(30, 125, 251, 1);
+      }
+      :deep(.looks) {
+        padding: 5px 10px;
+        border-radius: 45px;
+        border: 0.74px solid #f56c6c;
+      }
+    }
+
+    // 添加员工弹窗样式
+    :deep(.addStaff) {
+      //   height: 420px;
+      border-radius: 11px;
+      .el-dialog__header {
+        border-radius: 11px 11px 0 0;
+        background: rgba(237, 241, 245, 1);
+        font-weight: 600;
+        margin: 0;
+        .el-dialog__headerbtn {
+          outline: none;
+        }
+      }
+      .el-dialog__body {
+        padding: 30px 20px 10px 20px;
+        .el-input {
+          width: 200px;
+        }
+        .options {
+          margin-left: 320px;
+        }
+      }
+    }
+  }
+  .el-pagination {
+    width: calc(100% - 60px);
+    height: 60px;
+    margin: 0 auto;
+    justify-content: flex-end;
+    :deep(.el-pagination__total) {
+      color: #000;
+    }
+    :deep(.el-pagination__goto) {
+      color: #000;
+    }
+    :deep(.el-pagination__classifier) {
+      color: #000;
+    }
+    :deep(.el-input__wrapper) {
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      box-shadow: none;
+    }
+    :deep(.el-pager li) {
+      margin: 0 5px;
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      background-color: transparent;
+    }
+    :deep(.el-pager li.is-active) {
+      background-color: rgba(30, 125, 251, 1);
+    }
+    :deep(.btn-prev) {
+      margin-right: 5px;
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      background-color: transparent;
+    }
+    :deep(.btn-next) {
+      margin-left: 5px;
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      background-color: transparent;
+    }
+  }
+}
+.el-input {
+  width: 192px;
+}
+</style>

src/views/driver/path.vue

@@ -0,0 +1,835 @@
+<template>
+  <div class="content-box">
+    <div class="left">
+      <!-- <el-icon :size="23" class="camera"><VideoCameraFilled /></el-icon> -->
+      <span class="cameratxt">路线管理</span>
+    </div>
+    <div class="middle">
+      <div class="filter">
+        <div class="condition">
+          <span>地点 : </span>
+          <el-select
+            v-model="searchInput.phone"
+            multiple
+            collapse-tags
+            collapse-tags-tooltip
+            :max-collapse-tags="3"
+            placeholder="请选择地点"
+            style="width: 240px"
+          >
+            <el-option label="全部" value="全部" />
+            <el-option label="待审核" value="待审核" />
+            <el-option label="审核成功" value="审核成功" />
+            <el-option label="拒绝" value="拒绝" />
+          </el-select>
+        </div>
+        <div class="condition">
+          <span>状态 : </span>
+          <el-select
+            style="width: 180px"
+            v-model="searchInput.car_number"
+            class="m-2"
+            placeholder="请选择状态"
+            :clearable="true"
+          >
+            <el-option label="全部" value="全部" />
+            <el-option label="待审核" value="待审核" />
+            <el-option label="审核成功" value="审核成功" />
+            <el-option label="拒绝" value="拒绝" />
+          </el-select>
+        </div>
+        <div class="condition">
+          <span>出发地 : </span>
+          <el-select
+            style="width: 180px"
+            v-model="searchInput.car_number"
+            class="m-2"
+            placeholder="请选择出发地"
+            :clearable="true"
+          >
+            <el-option label="全部" value="全部" />
+            <el-option label="待审核" value="待审核" />
+            <el-option label="审核成功" value="审核成功" />
+            <el-option label="拒绝" value="拒绝" />
+          </el-select>
+        </div>
+        <div class="condition">
+          <span>目的地 : </span>
+          <el-select
+            style="width: 180px"
+            v-model="searchInput.car_number"
+            class="m-2"
+            placeholder="请选择目的地"
+            :clearable="true"
+          >
+            <el-option label="全部" value="全部" />
+            <el-option label="待审核" value="待审核" />
+            <el-option label="审核成功" value="审核成功" />
+            <el-option label="拒绝" value="拒绝" />
+          </el-select>
+        </div>
+        <div class="condition">
+          <span>创建时间 : </span>
+          <el-date-picker
+            v-model="searchInput.createTime"
+            type="date"
+            format="YYYY-MM-DD"
+            value-format="YYYY-MM-DD"
+            :prefix-icon="Calendar"
+            placeholder="请选择日期"
+          />
+        </div>
+      </div>
+      <!-- 按钮列表 -->
+      <div class="gongneng">
+        <el-button
+          color="rgba(61, 81, 232, 1)"
+          type="primary"
+          class="search"
+          @click="searchBtn"
+          ><el-icon><Search /></el-icon> <span>查询</span></el-button
+        >
+        <el-button
+          style="margin-left: 10px !important"
+          color="rgba(61, 81, 232, 1)"
+          type="primary"
+          class="search"
+          @click="searchRefresh"
+          ><el-icon><Refresh /></el-icon><span>重置</span></el-button
+        >
+        <el-button
+          color="rgba(61, 81, 232, 1)"
+          class="import"
+          type="primary"
+          @click="importExcel"
+          ><img
+            src="@/assets/import.png"
+            style="width: 14px; height: 14px; margin-right: 4px"
+            alt=""
+          />
+          <span>导出表单</span></el-button
+        >
+        <el-button
+          style="margin-left: 10px !important"
+          type="primary"
+          color="rgba(61, 81, 232, 1)"
+          @click="addlist"
+          ><el-icon><CirclePlus /></el-icon><span>新增路线</span></el-button
+        >
+      </div>
+    </div>
+    <div class="footer">
+      <el-table
+        :row-class-name="tableRowClassName"
+        :data="tableData.list"
+        @selection-change="handleSelectionChange"
+        style="width: 100%"
+        :header-cell-style="{
+          background: 'rgba(240, 243, 247, 1)',
+          height: '50px',
+          border: 0,
+        }"
+      >
+        <!-- <el-table-column align="center" type="selection" width="80" /> -->
+        <el-table-column
+          type="index"
+          width="100"
+          align="center"
+          label="序号"
+          index="1"
+        />
+        <el-table-column align="center" prop="user_name" label="出发地" />
+        <el-table-column align="center" prop="user_zz" label="目的地" />
+        <el-table-column align="center" prop="user_phone" label="每人车费" />
+        <el-table-column align="center" prop="create_time" label="创建时间" />
+
+        <el-table-column align="center" label="操作" width="220">
+          <template #default="scope">
+            <el-button link type="primary" @click="edit(scope.row)"
+              ><div class="look">编辑</div></el-button
+            >
+            <el-button link type="danger" @click="del(scope.row)"
+              ><div class="looks">删除</div></el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <!-- 添加员工弹窗 -->
+      <el-dialog
+        class="addStaff"
+        v-model="addDialogVisible"
+        :close-on-click-modal="false"
+        :close-on-press-escape="false"
+        :title="dialongTitle"
+        align-center
+        width="509"
+        :before-close="cancelAdd"
+      >
+        <el-form
+          ref="ruleFormRef"
+          :model="ruleForm"
+          :rules="rules"
+          label-width="100px"
+          class="demo-ruleForm"
+          :size="formSize"
+          label-position="left"
+          status-icon
+        >
+          <el-form-item label="出发地 :" prop="name">
+            <el-select
+              style="width: 180px"
+              v-model="searchInput.car_number"
+              class="m-2"
+              placeholder="请选择出发地"
+              :clearable="true"
+            >
+              <el-option label="全部" value="全部" />
+              <el-option label="待审核" value="待审核" />
+              <el-option label="审核成功" value="审核成功" />
+              <el-option label="拒绝" value="拒绝" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="目的地 :" prop="cardnumber">
+            <el-select
+              style="width: 180px"
+              v-model="searchInput.car_number"
+              class="m-2"
+              placeholder="请选择目的地"
+              :clearable="true"
+            >
+              <el-option label="全部" value="全部" />
+              <el-option label="待审核" value="待审核" />
+              <el-option label="审核成功" value="审核成功" />
+              <el-option label="拒绝" value="拒绝" />
+            </el-select>
+          </el-form-item>
+
+          <el-form-item label="每人车费 :">
+            <el-input
+              v-model="ruleForm.phone"
+              placeholder="请输入每人车费"
+              clearable
+            />
+          </el-form-item>
+
+          <el-form-item class="options">
+            <el-button
+              color="rgba(61, 81, 232, 1)"
+              class="queding"
+              type="primary"
+              @click="submitAdd(ruleFormRef)"
+            >
+              确定
+            </el-button>
+            <el-button class="congzhi" @click="cancelAdd(ruleFormRef)"
+              >取消</el-button
+            >
+          </el-form-item>
+        </el-form>
+      </el-dialog>
+    </div>
+
+    <!-- 分页组件 -->
+    <el-pagination
+      background
+      :current-page="currentPage"
+      :page-size="pageSize"
+      layout="total, prev, pager, next, jumper, slot"
+      :total="total"
+      @update:current-page="handleCurrentChange"
+    />
+  </div>
+</template>
+
+<script setup>
+import { ref, reactive, nextTick, onBeforeMount, onUnmounted } from "vue";
+import { useRouter } from "vue-router";
+import { ElMessage, ElMessageBox } from "element-plus";
+import { Calendar } from "@element-plus/icons-vue";
+import vidiconsApi from "@/api/vidicons.js";
+import { dayjs } from "element-plus";
+import lodash from "lodash";
+import axios from "axios";
+import { useStore } from "vuex";
+const store = useStore();
+const router = useRouter();
+// 表格数据
+const tableData = reactive({ list: [] });
+const activeIndex = ref(); // 默认跳转路由
+const dialongTitle = ref("新增驾驶员"); // 弹窗标题
+const api = ref("");
+const searchInput = reactive({
+  name: "",
+  phone: "",
+  createTime: "",
+}); // 搜索按钮数据
+
+const currentPage = ref(1); // 当前页
+const pageSize = ref(10);
+const total = ref(); // 当前总数
+const selectData = reactive({ list: [] }); // 多选框选择的数据
+
+const addDialogVisible = ref(false); // 控制添加员工弹窗
+
+// 表单数据
+const formSize = ref("default");
+const ruleFormRef = ref();
+const ruleForm = reactive({
+  name: "",
+  phone: "",
+  post: "0",
+  cardnumber: "",
+  id: "",
+});
+// 表单验证
+const rules = reactive({
+  name: [
+    { required: true, message: "姓名不能为空", trigger: "blur" },
+    {
+      pattern: /[\u4e00-\u9fa5]$/,
+      message: "请输入正确姓名",
+      trigger: "blur",
+    },
+  ],
+  // /^[\u4E00-\u9FA5]$/
+  cardnumber: [
+    { required: true, message: "卡号不能为空", trigger: "blur" },
+    // {
+    //   // pattern: /^((0\d{2,3}-\d{7,8})|(1[3584]\d{9}))$/,
+    //   // pattern: /^[0-9]*$/,
+    //   message: "请输入正确卡号(数字类型)",
+    //   trigger: "blur",
+    // },
+  ],
+  phone: [
+    { required: true, message: "请输入手机号", trigger: "blur" },
+    {
+      // pattern: /^((0\d{2,3}-\d{7,8})|(1[3584]\d{9}))$/,
+      pattern: /^((\(\+86\))|(\(86\)))?[1][3456789][0-9]{9}$/,
+      message: "请输入合法手机号/电话号",
+      trigger: "blur",
+    },
+  ],
+  post: [
+    {
+      required: true,
+      message: "职位不能为空",
+      trigger: "blur",
+    },
+  ],
+
+  // desc: [{ required: true, message: "Please input activity form", trigger: "blur" }],
+});
+// 获取摄像头列表
+const getList = async (message) => {
+  let data = new FormData();
+  if (searchInput.createTime == null) {
+    searchInput.createTime = "";
+  }
+  data.set("user_name", searchInput.name);
+  data.set("user_phone", searchInput.phone);
+  data.set("create_time", searchInput.createTime); //前面的key记得对应！
+  data.set("page", currentPage.value);
+  data.set("rows", pageSize.value); //前面的key记得对应！
+  // let res = await adminApi.adminLogin(data);
+  let res = await axios({
+    method: "post",
+    url: api.value + "/carBook/userlist.action",
+    headers: {
+      token: sessionStorage.getItem("token"),
+    },
+    data: data,
+  });
+  console.log(res);
+  if (res.status == 200) {
+    if (message) {
+      ElMessage({
+        type: "success",
+        showClose: true,
+        message: message,
+        center: true,
+      });
+    }
+    // ElMessage({
+    //   type: "success",
+    //   showClose: true,
+    //   message: res.data.message,
+    //   center: true,
+    // });
+    tableData.list = res.data.rows;
+    // currentPage.value = res.data.currentPage;
+    total.value = res.data.total;
+  } else {
+    tableData.list = res.data.rows;
+    currentPage.value = 1;
+    total.value = res.data.total;
+    ElMessage({
+      type: "error",
+      showClose: true,
+      message: res.data.message,
+      center: true,
+    });
+    if (res.data.message == "token错误") {
+      router.push({
+        path: `/login`,
+      });
+    }
+  }
+  // console.log(res);
+};
+
+// 搜索功能
+const searchBtn = lodash.debounce(async () => {
+  getList("查询成功");
+}, 300);
+// 重置搜索
+const searchRefresh = lodash.debounce(async () => {
+  searchInput.name = "";
+  searchInput.phone = "";
+  searchInput.createTime = "";
+  currentPage.value = 1;
+  getList();
+}, 300);
+// 添加员工
+const addlist = () => {
+  dialongTitle.value = "新增路线";
+  addDialogVisible.value = true;
+  ruleForm.name = "";
+  ruleForm.phone = "";
+  ruleForm.post = "";
+  ruleForm.cardnumber = "";
+};
+//编辑按钮
+const edit = (row) => {
+  dialongTitle.value = "编辑驾驶员";
+  addDialogVisible.value = true;
+  console.log(row);
+  ruleForm.name = row.user_name;
+  ruleForm.phone = row.user_phone;
+  ruleForm.post = row.user_zz;
+  ruleForm.id = row.id;
+};
+// 取消添加员工
+const cancelAdd = () => {
+  addDialogVisible.value = false;
+  ruleFormRef.value.resetFields();
+};
+// 确认添加员工
+const submitAdd = async (formEl) => {
+  if (!formEl) return;
+  await formEl.validate(async (valid, fields) => {
+    if (valid) {
+      if (dialongTitle.value == "新增驾驶员") {
+        let data = {
+          user_name: ruleForm.name,
+          user_phone: ruleForm.phone,
+          user_zz: ruleForm.post,
+          card_number: ruleForm.cardnumber,
+        };
+        // let res = await admin.adminAdd(data);
+        let res = await axios({
+          method: "post",
+          url: api.value + "/carBook/userinsert.action",
+          headers: {
+            "Content-Type": "application/json;charset=utf-8",
+            token: sessionStorage.getItem("token"),
+          },
+          data: data,
+        });
+        // console.log(res, "添加账号");
+        if (res.data.code == 200) {
+          getList();
+          ElMessage({
+            type: "success",
+            showClose: true,
+            message: res.data.message,
+            center: true,
+          });
+          addDialogVisible.value = false;
+          ruleFormRef.value.resetFields();
+        } else {
+          ElMessage({
+            type: "error",
+            showClose: true,
+            message: res.data.message,
+            center: true,
+          });
+        }
+      } else {
+        let data = {
+          user_name: ruleForm.name,
+          user_phone: ruleForm.phone,
+          user_zz: ruleForm.post,
+          id: ruleForm.id,
+        };
+        // let res = await admin.adminAdd(data);
+        let res = await axios({
+          method: "post",
+          url: api.value + "/carBook/userupdate.action",
+          headers: {
+            "Content-Type": "application/json;charset=utf-8",
+            token: sessionStorage.getItem("token"),
+          },
+          data: data,
+        });
+        // console.log(res, "修改账号");
+        if (res.data.code == 200) {
+          getList();
+
+          ElMessage({
+            type: "success",
+            showClose: true,
+            message: res.data.message,
+            center: true,
+          });
+          addDialogVisible.value = false;
+          ruleFormRef.value.resetFields();
+        } else {
+          ElMessage({
+            type: "error",
+            showClose: true,
+            message: res.data.message,
+            center: true,
+          });
+        }
+      }
+    } else {
+      console.log("error submit!", fields);
+    }
+  });
+};
+
+//删除按钮
+const del = (row) => {
+  ElMessageBox.confirm(`是否删除 ${row.user_name} 驾驶员?`, "提示", {
+    confirmButtonText: "确认",
+    cancelButtonText: "取消",
+    type: "warning",
+  })
+    .then(async () => {
+      let data = new FormData();
+      data.set("id", row.id);
+      // let res = await adminApi.adminLogin(data);
+      let res = await axios({
+        method: "post",
+        url: api.value + "/carBook/userdel.action",
+        headers: {
+          token: sessionStorage.getItem("token"),
+        },
+        data: data,
+      });
+      if (res.data.code == 200) {
+        if (tableData.list.length == 1 && currentPage.value != 1) {
+          currentPage.value = currentPage.value - 1;
+        }
+        getList();
+        ElMessage({
+          type: "success",
+          showClose: true,
+          message: res.data.message,
+          center: true,
+        });
+      } else {
+        ElMessage({
+          type: "error",
+          showClose: true,
+          message: res.data.message,
+          center: true,
+        });
+      }
+      console.log(res);
+    })
+    .catch(() => {
+      ElMessage({
+        type: "info",
+        message: "已取消删除",
+      });
+    });
+};
+//导出功能
+const importExcel = async () => {
+  if (searchInput.createTime == null) {
+    searchInput.createTime = "";
+  }
+  let data = new FormData();
+  data.set("user_name", searchInput.name);
+  data.set("user_phone", searchInput.phone);
+  data.set("create_time", searchInput.createTime);
+  let res = await axios({
+    method: "post",
+    url: api.value + "/carBook/usertoExcel.action",
+    headers: {
+      token: sessionStorage.getItem("token"),
+    },
+    data: data,
+  });
+  // console.log(res, "导出账号");
+  if (res.data.code == 200) {
+    // const elt = document.createElement("a");
+    // elt.setAttribute(
+    //   "href",
+    //   "https://chtech.ncjti.edu.cn/carstop" + res.data.downurl
+    // );
+    // // elt.setAttribute("download", "file.xlsx");
+    // // elt.style.display = "none";
+    // document.body.appendChild(elt);
+    // elt.click();
+    var downloadPath = "https://chtech.ncjti.edu.cn/carstop" + res.data.downurl;
+    console.log("获得地址数据:", downloadPath);
+    var downloadLink = document.createElement("a");
+    downloadLink.style.display = "none"; // 使其隐藏
+    downloadLink.href = downloadPath;
+    downloadLink.download = "";
+    downloadLink.click();
+    document.body.appendChild(downloadLink);
+    document.body.removeChild(downloadLink);
+    ElMessage({
+      type: "success",
+      showClose: true,
+      message: res.data.message,
+      center: true,
+    });
+  } else {
+    ElMessage({
+      type: "error",
+      showClose: true,
+      message: res.data.message,
+      center: true,
+    });
+  }
+};
+// 多选框功能
+const handleSelectionChange = (val) => {
+  console.log(val);
+  selectData.list = val;
+};
+
+// 表格斑马纹颜色修改
+const tableRowClassName = ({ row, rowIndex }) => {
+  if (rowIndex % 2 === 0) {
+    return "even";
+  } else if (rowIndex % 2 !== 0) {
+    return "odd";
+  }
+  return "";
+};
+// 分页
+const handleCurrentChange = (value) => {
+  // console.log(value);
+  currentPage.value = value;
+  getList();
+};
+
+onBeforeMount(() => {
+  api.value = store.state.user.api;
+  getList();
+});
+onUnmounted(() => {
+  // document.removeEventListener("keyup", Enters);
+});
+</script>
+
+<style scoped lang="scss">
+.content-box {
+  width: calc(100% - 40px);
+  height: calc(100% - 105px);
+  margin: 20px auto;
+  background-color: #fff;
+  color: #fff;
+  display: flex;
+  flex-direction: column;
+
+  .left {
+    width: calc(100% - 60px);
+    display: flex;
+    align-items: center;
+    height: 60px;
+    margin: 0 30px;
+    border-bottom: 1px solid #ccc;
+    color: #000;
+    font-size: 18px;
+    font-weight: 600;
+    .camera {
+      margin-right: 15px;
+      color: #4392f7;
+    }
+  }
+  .middle {
+    width: calc(100% - 60px);
+    margin: 0 auto;
+
+    color: #000;
+    // border-bottom: 1px solid rgb(231, 231, 231);
+    .filter {
+      display: flex;
+      flex-wrap: wrap;
+      align-items: center;
+      margin: 10px 0 0 0;
+      .search {
+        margin-left: 0 !important;
+      }
+      .condition {
+        display: flex;
+        align-items: center;
+        margin: 10px 30px 10px 0;
+        :deep(.el-input .el-input__inner) {
+          font-size: 16px;
+        }
+        span {
+          margin: 0 10px 0 0;
+        }
+      }
+    }
+    .gongneng {
+      margin: 10px 0;
+    }
+    :deep(.cont) {
+      width: 60%;
+      margin: 20px auto;
+    }
+    :deep(.download) {
+      display: flex;
+      align-items: center;
+      margin: 10px;
+    }
+    :deep(.download span) {
+      font-size: 16px;
+      margin-left: 20px;
+    }
+    :deep(.cont .el-button) {
+      margin-left: 60px;
+      margin-bottom: 30px;
+    }
+
+    :deep(.cont .accomplish) {
+      width: 100%;
+      display: flex;
+      justify-content: center;
+    }
+    :deep(.cont .accomplish .el-button) {
+      width: 50%;
+      margin: 0;
+    }
+  }
+  .footer {
+    width: calc(100% - 60px);
+    flex: 1;
+    margin: 10px auto;
+    overflow: auto;
+
+    .el-table--fit {
+      height: 100%;
+      :deep(.el-table__header-wrapper) {
+        background-color: #000;
+        font-size: 16px;
+        color: #000;
+      }
+      :deep(.el-table__row) {
+        height: 50px;
+        font-size: 16px;
+        color: #000;
+      }
+      :deep(.el-table__row td) {
+        padding: 0;
+        border: 0;
+      }
+
+      .el-button--primary {
+        margin-left: 5px;
+      }
+      :deep(.el-table__body .even) {
+        background-color: #fff;
+      }
+      :deep(.el-table__body .odd) {
+        background-color: rgba(240, 243, 247, 1);
+      }
+      :deep(.look) {
+        padding: 5px 10px;
+        border-radius: 45px;
+        border: 0.74px solid rgba(30, 125, 251, 1);
+      }
+      :deep(.looks) {
+        padding: 5px 10px;
+        border-radius: 45px;
+        border: 0.74px solid #f56c6c;
+      }
+    }
+
+    // 添加员工弹窗样式
+    :deep(.addStaff) {
+      //   height: 420px;
+      border-radius: 11px;
+      .el-dialog__header {
+        border-radius: 11px 11px 0 0;
+        background: rgba(237, 241, 245, 1);
+        font-weight: 600;
+        margin: 0;
+        .el-dialog__headerbtn {
+          outline: none;
+        }
+      }
+      .el-dialog__body {
+        padding: 30px 20px 10px 20px;
+        .el-input {
+          width: 200px;
+        }
+        .options {
+          .el-form-item__content {
+            margin: 0 !important;
+            display: flex;
+            flex-direction: row-reverse;
+            .queding {
+              margin-left: 10px;
+            }
+          }
+        }
+      }
+    }
+  }
+  .el-pagination {
+    width: calc(100% - 60px);
+    height: 60px;
+    margin: 0 auto;
+    justify-content: flex-end;
+    :deep(.el-pagination__total) {
+      color: #000;
+    }
+    :deep(.el-pagination__goto) {
+      color: #000;
+    }
+    :deep(.el-pagination__classifier) {
+      color: #000;
+    }
+    :deep(.el-input__wrapper) {
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      box-shadow: none;
+    }
+    :deep(.el-pager li) {
+      margin: 0 5px;
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      background-color: transparent;
+    }
+    :deep(.el-pager li.is-active) {
+      background-color: rgba(30, 125, 251, 1);
+    }
+    :deep(.btn-prev) {
+      margin-right: 5px;
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      background-color: transparent;
+    }
+    :deep(.btn-next) {
+      margin-left: 5px;
+      border: 1px solid rgba(0, 0, 0, 1);
+      border-radius: 5px;
+      background-color: transparent;
+    }
+  }
+}
+.el-input {
+  width: 192px;
+}
+</style>

src/views/driver/rule copy.vue

@@ -0,0 +1,439 @@
+<template>
+  <div class="content-box">
+    <div class="left">
+      <!-- <el-icon :size="23" class="camera"><VideoCameraFilled /></el-icon> -->
+      <span class="cameratxt">规则设置</span>
+    </div>
+    <div class="middle">
+      <div class="filter">
+        <div class="condition">
+          <h3>可约车时间段设置</h3>
+          <div>
+            <span>约车时间段</span>
+            <el-time-picker
+              v-model="ruleForm.startTime"
+              is-range
+              range-separator="-"
+              start-placeholder="开始时间"
+              end-placeholder="结束时间"
+              format="HH:mm"
+              value-format="HH:mm"
+            />
+          </div>
+        </div>
+        <div class="condition">
+          <h3>截至取消订单时间设置</h3>
+          <div>
+            <span>乘车时间前</span>
+            <el-input
+              :clearable="false"
+              v-model="ruleForm.time"
+              class="w-50 m-2"
+              style="width: 100px"
+              @change="timeVerify"
+            />
+            <span>&nbsp;&nbsp;分钟</span>
+          </div>
+        </div>
+        <div class="condition">
+          <h3>顺风车须知设置</h3>
+          <div>
+            <el-input
+              v-model="ruleForm.startTime"
+              style="width: 500px"
+              :rows="5"
+              type="textarea"
+              placeholder="请输入内容"
+            />
+          </div>
+        </div>
+        <div class="condition">
+          <h3>客服联系方式设置</h3>
+          <div>
+            <el-input
+              :clearable="false"
+              v-model="ruleForm.black_count"
+              class="w-50 m-2"
+              style="width: 220px"
+              placeholder="请输入联系方式"
+            />
+          </div>
+        </div>
+        <div class="condition">
+          <h3>顺风车服务条款设置</h3>
+          <div>
+            <el-input
+              v-model="ruleForm.startTime"
+              style="width: 500px"
+              :rows="5"
+              type="textarea"
+              placeholder="请输入内容"
+            />
+          </div>
+        </div>
+        <div class="condition">
+          <h3>司机取消订单保证金扣款规则设置</h3>
+          <div>
+            <span>司机取消订单，扣当前订单的</span>
+            <el-input
+              :clearable="false"
+              v-model="ruleForm.notice_time"
+              class="w-50 m-2"
+              style="width: 100px"
+              @change="timeVerify"
+            />
+            <span>（如0.25则是抽当前订单支付金额的25%，保留2位小数）</span>
+          </div>
+          <div style="margin: 10px 0;">
+            <span>保证金低于</span>
+            <el-input
+              :clearable="false"
+              v-model="ruleForm.notice_time"
+              class="w-50 m-2"
+              style="width: 100px"
+              @change="timeVerify"
+            />
+            <span>&nbsp;&nbsp;则不能接单，需补交保证金</span>
+          </div>
+        </div>
+        <div class="condition">
+          <h3>用户取消订单违约金规则设置</h3>
+          <div>
+            <span>司机取消订单，扣当前订单的</span>
+            <el-input
+              :clearable="false"
+              v-model="ruleForm.notice_time"
+              class="w-50 m-2"
+              style="width: 100px"
+              @change="timeVerify"
+            />
+            <span>（如0.25则是抽当前订单支付金额的25%，保留2位小数）</span>
+          </div>
+        </div>
+        <div class="condition">
+          <h3>保证金规则设置</h3>
+          <div>
+            <span>保证金退款</span>
+            <div>
+              <el-input
+                v-model="ruleForm.startTime"
+                style="width: 500px"
+                :rows="5"
+                type="textarea"
+                placeholder="请输入保证金"
+              />
+            </div>
+          </div>
+          <div style="margin: 10px 0;">
+            <span>保证金缴纳</span>
+            <div>
+              <el-input
+                v-model="ruleForm.startTime"
+                style="width: 500px"
+                :rows="5"
+                type="textarea"
+                placeholder="请输入保证金"
+              />
+            </div>
+          </div>
+          <div>
+            <span>充值保证金</span>
+            <el-input
+              :clearable="false"
+              v-model="ruleForm.notice_time"
+              class="w-50 m-2"
+              style="width: 100px"
+            />
+          </div>
+        </div>
+        <div class="condition">
+          <h3>提现设置</h3>
+          <div>
+            <span>提现时平台技术服务费抽成</span>
+            <el-input
+              :clearable="false"
+              v-model="ruleForm.notice_time"
+              class="w-50 m-2"
+              style="width: 100px"
+              @change="timeVerify"
+            />
+            <span>（如0.25则是抽当前订单支付金额的25%，保留2位小数）</span>
+          </div>
+          <div  style="margin: 10px 0;">
+            <span>提现最低额度</span>
+            <el-input
+              :clearable="false"
+              v-model="ruleForm.notice_time"
+              class="w-50 m-2"
+              style="width: 100px"
+              @change="timeVerify"
+            />
+            <span>&nbsp;&nbsp;元（保留2位小数）</span>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div class="footer"></div>
+  </div>
+</template>
+
+<script setup>
+import {
+  ref,
+  reactive,
+  watch,
+  nextTick,
+  onBeforeMount,
+  onUnmounted,
+} from "vue";
+import { useRouter } from "vue-router";
+import { ElMessage, ElMessageBox } from "element-plus";
+import { dayjs } from "element-plus";
+import lodash from "lodash";
+import axios from "axios";
+import { useStore } from "vuex";
+const store = useStore();
+const api = ref("");
+const router = useRouter();
+// 表格数据
+const ruleForm = reactive({
+  time:"",
+  yy_duration: "",
+  hh_end: "", //截止预约时间设置
+  yy_end: "", //候补截止预约时间设置
+  black_count: "", //黑名单设置次数
+  notice_time: "", //发车前提前
+  startTime: "", // 扫码前时间
+  endTime: "", // 扫码后时间
+  scanInterval: "", // 扫码间隔
+  bb_before: "", // 报备人预约车辆时间设置
+  id: "",
+});
+
+// 获取系统设置数据
+const getlist = async (message) => {
+  // let res = await axios({
+  //   method: "post",
+  //   url: api.value + "/carBook/cnqueryHb.action",
+  //   headers: {
+  //     token: sessionStorage.getItem("token"),
+  //   },
+  // });
+  // console.log(res);
+  // if (res.data.code == 200) {
+  //   if (message) {
+  //     ElMessage({
+  //       type: "success",
+  //       showClose: true,
+  //       message: message,
+  //       center: true,
+  //     });
+  //   }
+  // } else {
+  //   ElMessage({
+  //     type: "error",
+  //     showClose: true,
+  //     message: res.data.message,
+  //     center: true,
+  //   });
+  //   if (res.data.message == "token错误") {
+  //     router.push({
+  //       path: `/login`,
+  //     });
+  //   }
+  // }
+};
+const getTimeList = async () => {
+  // let res = await axios({
+  //   method: "post",
+  //   url: api.value + "/carBook/weekConfigqueryList.action",
+  //   headers: {
+  //     token: sessionStorage.getItem("token"),
+  //   },
+  // });
+  // console.log(res, "开始时间段配置");
+  // if (res.data.code == 200) {
+  //   let resData = res.data.data;
+  // } else {
+  //   ElMessage({
+  //     type: "error",
+  //     showClose: true,
+  //     message: res.data.message,
+  //     center: true,
+  //   });
+  //   if (res.data.message == "token错误") {
+  //     router.push({
+  //       path: `/login`,
+  //     });
+  //   }
+  // }
+};
+
+// 页面数据一修改就调用函数
+const timeVerify = (val) => {
+  const regex = /^[0-9]+$/;
+  if (regex.test(val)) {
+    // timeUpdata();
+  } else {
+    // getlist();
+    ElMessage({
+      type: "warning",
+      showClose: true,
+      message: "请输入正确数值",
+      center: true,
+    });
+  }
+};
+const timeUpdata = async () => {
+  // let data = {
+  //   yy_duration: ruleForm.yy_duration,
+  //   scanInterval: ruleForm.scanInterval,
+  //   yy_end: ruleForm.yy_end,
+  //   hh_end: ruleForm.hh_end,
+  //   black_count: ruleForm.black_count,
+  //   notice_time: ruleForm.notice_time,
+  //   sm_start: ruleForm.startTime,
+  //   sm_end: ruleForm.endTime,
+  //   bb_before: ruleForm.bb_before,
+  //   id: ruleForm.id,
+  // };
+  // let res = await axios({
+  //   method: "post",
+  //   url: api.value + "/carBook/cnupdate.action",
+  //   headers: {
+  //     "Content-Type": "application/json;charset=utf-8",
+  //     token: sessionStorage.getItem("token"),
+  //   },
+  //   data: data,
+  // });
+  // console.log(res, "修改候补");
+  // if (res.data.code == 200) {
+  //   // getlist();
+  //   store.dispatch("sm_time");
+  //   ElMessage({
+  //     type: "success",
+  //     showClose: true,
+  //     message: res.data.message,
+  //     center: true,
+  //   });
+  // } else {
+  //   getlist();
+  //   ElMessage({
+  //     type: "error",
+  //     showClose: true,
+  //     message: "修改失败",
+  //     center: true,
+  //   });
+  // }
+};
+
+onBeforeMount(() => {
+  api.value = store.state.user.api;
+  getlist();
+  getTimeList();
+});
+onUnmounted(() => {});
+</script>
+
+<style scoped lang="scss">
+.content-box {
+  width: calc(100% - 40px);
+  height: calc(100% - 105px);
+  margin: 20px auto;
+  background-color: #fff;
+  color: #fff;
+  display: flex;
+  flex-direction: column;
+
+  .left {
+    // width: calc(100wh - 40px);
+    display: flex;
+    align-items: center;
+    height: 60px;
+    margin: 0 30px;
+    border-bottom: 1px solid #ccc;
+    color: #000;
+    font-size: 18px;
+    font-weight: 600;
+    .camera {
+      margin-right: 15px;
+      color: #4392f7;
+    }
+  }
+  .middle {
+    width: calc(100% - 60px);
+    height: calc(100% - 60px);
+    overflow: auto;
+    margin: 0 auto;
+    color: #000;
+
+    // border-bottom: 1px solid rgb(231, 231, 231);
+    .filter {
+      display: flex;
+      flex-wrap: wrap;
+      flex-direction: column;
+      .condition {
+        display: flex;
+        flex-direction: column;
+        margin: 10px 30px 10px 0;
+        h3 {
+          margin: 12px 12px 12px 0;
+        }
+        span {
+          margin: 0 10px 0 0;
+          font-size: 18px;
+          color: #000;
+        }
+        .addTime {
+          display: flex;
+          align-items: center;
+          .el-checkbox-group {
+            .el-checkbox {
+              margin: 0 15px 0 0;
+            }
+          }
+          :deep(.timePicker) {
+            width: 200px;
+          }
+        }
+      }
+    }
+    .gongneng {
+      margin: 10px 0;
+    }
+    :deep(.cont) {
+      width: 60%;
+      margin: 20px auto;
+    }
+    :deep(.download) {
+      display: flex;
+      align-items: center;
+      margin: 10px;
+    }
+    :deep(.download span) {
+      font-size: 16px;
+      margin-left: 20px;
+    }
+    :deep(.cont .el-button) {
+      margin-left: 60px;
+      margin-bottom: 30px;
+    }
+
+    :deep(.cont .accomplish) {
+      width: 100%;
+      display: flex;
+      justify-content: center;
+    }
+    :deep(.cont .accomplish .el-button) {
+      width: 50%;
+      margin: 0;
+    }
+    .footer{
+      
+    }
+  }
+}
+.el-input {
+  width: 192px;
+}
+</style>

src/views/driver/rule.vue

@@ -0,0 +1,525 @@
+<template>
+  <div class="content-box">
+    <div class="left">
+      <!-- <el-icon :size="23" class="camera"><VideoCameraFilled /></el-icon> -->
+      <span class="cameratxt">规则设置</span>
+    </div>
+    <div class="middle">
+      <div class="filter">
+        <el-form
+          ref="ruleFormRef"
+          :model="ruleForm"
+          :rules="rules"
+          label-width="0"
+          class="demo-ruleForm"
+          :size="formSize"
+          label-position="left"
+          status-icon
+        >
+          <el-form-item label="" prop="textarea">
+            <div class="condition">
+              <h3 style="margin: 12px 0">可约车时间段设置</h3>
+              <div>
+                <span>约车时间段</span>
+                <el-time-picker
+                  v-model="ruleForm.startTime"
+                  is-range
+                  range-separator="-"
+                  start-placeholder="开始时间"
+                  end-placeholder="结束时间"
+                  format="HH:mm"
+                  value-format="HH:mm"
+                />
+              </div>
+            </div>
+          </el-form-item>
+          <el-form-item label="" prop="time">
+            <div class="condition">
+              <h3>截至取消订单时间设置</h3>
+              <div>
+                <span>乘车时间前</span>
+                <el-input
+                  :clearable="false"
+                  v-model="ruleForm.time"
+                  class="w-50 m-2"
+                  style="width: 100px"
+                />
+                <span>&nbsp;&nbsp;分钟</span>
+              </div>
+            </div>
+          </el-form-item>
+          <el-form-item label="" prop="textarea">
+            <div class="condition">
+              <h3>顺风车须知设置</h3>
+              <div>
+                <el-input
+                  v-model="ruleForm.startTime"
+                  style="width: 500px"
+                  :rows="5"
+                  type="textarea"
+                  placeholder="请输入内容"
+                />
+              </div>
+            </div>
+          </el-form-item>
+          <el-form-item label="" prop="textarea">
+            <div class="condition">
+              <h3>客服联系方式设置</h3>
+              <div>
+                <el-input
+                  :clearable="false"
+                  v-model="ruleForm.black_count"
+                  class="w-50 m-2"
+                  style="width: 220px"
+                  placeholder="请输入联系方式"
+                />
+              </div>
+            </div>
+          </el-form-item>
+          <el-form-item label="" prop="textarea">
+            <div class="condition">
+              <h3>顺风车服务条款设置</h3>
+              <div>
+                <el-input
+                  v-model="ruleForm.startTime"
+                  style="width: 500px"
+                  :rows="5"
+                  type="textarea"
+                  placeholder="请输入内容"
+                />
+              </div>
+            </div>
+          </el-form-item>
+          <el-form-item label="" prop="textarea">
+            <div class="condition">
+              <h3>司机取消订单保证金扣款规则设置</h3>
+              <div>
+                <span>司机取消订单，扣当前订单的</span>
+                <el-input
+                  :clearable="false"
+                  v-model="ruleForm.notice_time"
+                  class="w-50 m-2"
+                  style="width: 100px"
+                />
+                <span>（如0.25则是抽当前订单支付金额的25%，保留2位小数）</span>
+              </div>
+            </div>
+          </el-form-item>
+          <el-form-item label="" prop="textarea">
+            <div class="condition">
+              <div>
+                <span>保证金低于</span>
+                <el-input
+                  :clearable="false"
+                  v-model="ruleForm.notice_time"
+                  class="w-50 m-2"
+                  style="width: 100px"
+                />
+                <span>&nbsp;&nbsp;则不能接单，需补交保证金</span>
+              </div>
+            </div>
+          </el-form-item>
+          <el-form-item label="" prop="textarea">
+            <div class="condition">
+              <h3>用户取消订单违约金规则设置</h3>
+              <div>
+                <span>司机取消订单，扣当前订单的</span>
+                <el-input
+                  :clearable="false"
+                  v-model="ruleForm.notice_time"
+                  class="w-50 m-2"
+                  style="width: 100px"
+                />
+                <span>（如0.25则是抽当前订单支付金额的25%，保留2位小数）</span>
+              </div>
+            </div>
+          </el-form-item>
+          <el-form-item label="" prop="textarea">
+            <div class="condition">
+              <h3>保证金规则设置</h3>
+              <div>
+                <span>保证金退款</span>
+                <div>
+                  <el-input
+                    v-model="ruleForm.startTime"
+                    style="width: 500px"
+                    :rows="5"
+                    type="textarea"
+                    placeholder="请输入保证金"
+                  />
+                </div>
+              </div>
+            </div>
+          </el-form-item>
+          <el-form-item label="" prop="textarea">
+            <div class="condition">
+              <div>
+                <span>保证金缴纳</span>
+                <div>
+                  <el-input
+                    v-model="ruleForm.startTime"
+                    style="width: 500px"
+                    :rows="5"
+                    type="textarea"
+                    placeholder="请输入保证金"
+                  />
+                </div>
+              </div>
+            </div>
+          </el-form-item>
+          <el-form-item label="" prop="textarea">
+            <div class="condition">
+              <div>
+                <span>充值保证金</span>
+                <el-input
+                  :clearable="false"
+                  v-model="ruleForm.notice_time"
+                  class="w-50 m-2"
+                  style="width: 100px"
+                />
+              </div>
+            </div>
+          </el-form-item>
+          <el-form-item label="" prop="textarea">
+            <div class="condition">
+              <h3>提现设置</h3>
+              <div>
+                <span>提现时平台技术服务费抽成</span>
+                <el-input
+                  :clearable="false"
+                  v-model="ruleForm.notice_time"
+                  class="w-50 m-2"
+                  style="width: 100px"
+                />
+                <span>（如0.25则是抽当前订单支付金额的25%，保留2位小数）</span>
+              </div>
+            </div>
+          </el-form-item>
+          <el-form-item label="" prop="quota">
+            <div class="condition">
+              <div>
+                <span>提现最低额度</span>
+                <el-input
+                  :clearable="false"
+                  v-model="ruleForm.quota"
+                  class="w-50 m-2"
+                  style="width: 100px"
+                />
+                <span>&nbsp;&nbsp;元（保留2位小数）</span>
+              </div>
+            </div>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="footer">
+        <div class="options">
+          <el-button
+            color="rgba(61, 81, 232, 1)"
+            class="queding"
+            type="primary"
+            @click="edit"
+          >
+            修改
+          </el-button>
+          <el-button
+            color="rgba(61, 81, 232, 1)"
+            class="queding"
+            type="primary"
+            @click="submit(ruleFormRef)"
+          >
+            确定
+          </el-button>
+          <el-button class="congzhi" @click="cancel">取消</el-button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import {
+  ref,
+  reactive,
+  watch,
+  nextTick,
+  onBeforeMount,
+  onUnmounted,
+} from "vue";
+import { useRouter } from "vue-router";
+import { ElMessage, ElMessageBox } from "element-plus";
+import { dayjs } from "element-plus";
+import lodash from "lodash";
+import axios from "axios";
+import { useStore } from "vuex";
+const store = useStore();
+const api = ref("");
+const router = useRouter();
+
+// 表单数据
+const formSize = ref("default");
+const ruleFormRef = ref();
+const ruleForm = reactive({
+  time: "",
+  yy_duration: "",
+  hh_end: "", //截止预约时间设置
+  yy_end: "", //候补截止预约时间设置
+  black_count: "", //黑名单设置次数
+  notice_time: "", //发车前提前
+  startTime: "", // 扫码前时间
+  endTime: "", // 扫码后时间
+  scanInterval: "", // 扫码间隔
+  bb_before: "", // 报备人预约车辆时间设置
+  id: "",
+});
+// 表单验证
+const rules = reactive({
+  time: [
+    { required: true, message: "姓名不能为空", trigger: "blur" },
+    {
+      pattern: /^(0|[1-9]\d*)$/,
+      message: "请输入正确数字",
+      trigger: "blur",
+    },
+  ],
+  quota: [
+    { required: true, message: "额度不能为空", trigger: "blur" },
+    {
+      pattern: /^(?!0\d)\d+(?:\.\d{1,2})?$/,
+      message: "请输入正确额度",
+      trigger: "blur",
+    },
+  ],
+});
+
+// 获取系统设置数据
+const getlist = async (message) => {
+  // let res = await axios({
+  //   method: "post",
+  //   url: api.value + "/carBook/cnqueryHb.action",
+  //   headers: {
+  //     token: sessionStorage.getItem("token"),
+  //   },
+  // });
+  // console.log(res);
+  // if (res.data.code == 200) {
+  //   if (message) {
+  //     ElMessage({
+  //       type: "success",
+  //       showClose: true,
+  //       message: message,
+  //       center: true,
+  //     });
+  //   }
+  // } else {
+  //   ElMessage({
+  //     type: "error",
+  //     showClose: true,
+  //     message: res.data.message,
+  //     center: true,
+  //   });
+  //   if (res.data.message == "token错误") {
+  //     router.push({
+  //       path: `/login`,
+  //     });
+  //   }
+  // }
+};
+const getTimeList = async () => {
+  // let res = await axios({
+  //   method: "post",
+  //   url: api.value + "/carBook/weekConfigqueryList.action",
+  //   headers: {
+  //     token: sessionStorage.getItem("token"),
+  //   },
+  // });
+  // console.log(res, "开始时间段配置");
+  // if (res.data.code == 200) {
+  //   let resData = res.data.data;
+  // } else {
+  //   ElMessage({
+  //     type: "error",
+  //     showClose: true,
+  //     message: res.data.message,
+  //     center: true,
+  //   });
+  //   if (res.data.message == "token错误") {
+  //     router.push({
+  //       path: `/login`,
+  //     });
+  //   }
+  // }
+};
+
+const timeUpdata = async () => {
+  // let data = {
+  //   yy_duration: ruleForm.yy_duration,
+  //   scanInterval: ruleForm.scanInterval,
+  //   yy_end: ruleForm.yy_end,
+  //   hh_end: ruleForm.hh_end,
+  //   black_count: ruleForm.black_count,
+  //   notice_time: ruleForm.notice_time,
+  //   sm_start: ruleForm.startTime,
+  //   sm_end: ruleForm.endTime,
+  //   bb_before: ruleForm.bb_before,
+  //   id: ruleForm.id,
+  // };
+  // let res = await axios({
+  //   method: "post",
+  //   url: api.value + "/carBook/cnupdate.action",
+  //   headers: {
+  //     "Content-Type": "application/json;charset=utf-8",
+  //     token: sessionStorage.getItem("token"),
+  //   },
+  //   data: data,
+  // });
+  // console.log(res, "修改候补");
+  // if (res.data.code == 200) {
+  //   // getlist();
+  //   store.dispatch("sm_time");
+  //   ElMessage({
+  //     type: "success",
+  //     showClose: true,
+  //     message: res.data.message,
+  //     center: true,
+  //   });
+  // } else {
+  //   getlist();
+  //   ElMessage({
+  //     type: "error",
+  //     showClose: true,
+  //     message: "修改失败",
+  //     center: true,
+  //   });
+  // }
+};
+
+//编辑按钮
+const edit = () => {};
+// 取消
+const cancel = () => {
+  ruleFormRef.value.resetFields();
+};
+// 确认
+const submit = async (formEl) => {
+  if (!formEl) return;
+  await formEl.validate(async (valid, fields) => {
+    if (valid) {
+    } else {
+      console.log("error submit!", fields);
+    }
+  });
+};
+
+onBeforeMount(() => {
+  api.value = store.state.user.api;
+  getlist();
+  getTimeList();
+});
+onUnmounted(() => {});
+</script>
+
+<style scoped lang="scss">
+.content-box {
+  width: calc(100% - 40px);
+  height: calc(100% - 105px);
+  margin: 20px auto;
+  background-color: #fff;
+  color: #fff;
+  display: flex;
+  flex-direction: column;
+
+  .left {
+    // width: calc(100wh - 40px);
+    display: flex;
+    align-items: center;
+    height: 60px;
+    margin: 0 30px;
+    border-bottom: 1px solid #ccc;
+    color: #000;
+    font-size: 18px;
+    font-weight: 600;
+    .camera {
+      margin-right: 15px;
+      color: #4392f7;
+    }
+  }
+  .middle {
+    width: calc(100% - 60px);
+    height: calc(100% - 60px);
+    overflow: auto;
+    margin: 0 auto;
+    color: #000;
+
+    // border-bottom: 1px solid rgb(231, 231, 231);
+    .filter {
+      display: flex;
+      flex-wrap: wrap;
+      flex-direction: column;
+      .condition {
+        display: flex;
+        flex-direction: column;
+        margin: 0;
+        h3 {
+          font-size: 19px;
+          margin: 0px 12px 12px 0;
+        }
+        span {
+          margin: 0 10px 0 0;
+          font-size: 16px;
+          color: #000;
+        }
+        .addTime {
+          display: flex;
+          align-items: center;
+          .el-checkbox-group {
+            .el-checkbox {
+              margin: 0 15px 0 0;
+            }
+          }
+          :deep(.timePicker) {
+            width: 200px;
+          }
+        }
+      }
+    }
+    .gongneng {
+      margin: 10px 0;
+    }
+    :deep(.cont) {
+      width: 60%;
+      margin: 20px auto;
+    }
+    :deep(.download) {
+      display: flex;
+      align-items: center;
+      margin: 10px;
+    }
+    :deep(.download span) {
+      font-size: 16px;
+      margin-left: 20px;
+    }
+    :deep(.cont .el-button) {
+      margin-left: 60px;
+      margin-bottom: 30px;
+    }
+
+    :deep(.cont .accomplish) {
+      width: 100%;
+      display: flex;
+      justify-content: center;
+    }
+    :deep(.cont .accomplish .el-button) {
+      width: 50%;
+      margin: 0;
+    }
+    .footer {
+      margin: 10px 0 25px 0;
+      .options {
+      }
+    }
+  }
+}
+.el-input {
+  width: 192px;
+}
+</style>

src/views/waiting/waiting.vue

@@ -29,7 +29,7 @@
           </div>
           <div
             style="display: flex; align-items: center; margin-bottom: 8px"
-            v-for="(i, ind) in timeList.list"
+            v-for="(i, ind) in timeList.list" :key="ind"
           >
             <div class="addTime">
               <span>周期配置&nbsp;&nbsp;</span>