修改

src/assets/styles/ruoyi.scss

@@ -5,100 +5,100 @@
 
 /** 基础通用 **/
 .pt5 {
-  padding-top: 5px;
+    padding-top: 5px;
 }
 .pr5 {
-  padding-right: 5px;
+    padding-right: 5px;
 }
 .pb5 {
-  padding-bottom: 5px;
+    padding-bottom: 5px;
 }
 .mt5 {
-  margin-top: 5px;
+    margin-top: 5px;
 }
 .mr5 {
-  margin-right: 5px;
+    margin-right: 5px;
 }
 .mb5 {
-  margin-bottom: 5px;
+    margin-bottom: 5px;
 }
 .mb8 {
-  margin-bottom: 8px;
+    margin-bottom: 8px;
 }
 .ml5 {
-  margin-left: 5px;
+    margin-left: 5px;
 }
 .mt10 {
-  margin-top: 10px;
+    margin-top: 10px;
 }
 .mr10 {
-  margin-right: 10px;
+    margin-right: 10px;
 }
 .mb10 {
-  margin-bottom: 10px;
+    margin-bottom: 10px;
 }
 .ml10 {
-  margin-left: 10px;
+    margin-left: 10px;
 }
 .mt20 {
-  margin-top: 20px;
+    margin-top: 20px;
 }
 .mr20 {
-  margin-right: 20px;
+    margin-right: 20px;
 }
 .mb20 {
-  margin-bottom: 20px;
+    margin-bottom: 20px;
 }
 .ml20 {
-  margin-left: 20px;
+    margin-left: 20px;
 }
 .d-flex {
-  display: flex;
+    display: flex;
 }
 .f-w-w {
-  flex-wrap: wrap;
+    flex-wrap: wrap;
 }
 .a-c {
-  align-items: center;
+    align-items: center;
 }
 .j-c {
-  justify-content: center;
+    justify-content: center;
 }
 .j-ed {
-  justify-content: flex-end;
+    justify-content: flex-end;
 }
 .flex-cln {
-  flex-direction: column;
+    flex-direction: column;
 }
 .j-sb {
-  justify-content: space-between;
+    justify-content: space-between;
 }
 .flex-w {
-  flex-wrap: wrap;
+    flex-wrap: wrap;
 }
 .flex-at {
-  flex: auto;
+    flex: auto;
 }
 .flex1 {
-  flex: 1;
+    flex: 1;
 }
 .ov-hd {
-  overflow: hidden;
+    overflow: hidden;
 }
 .p-rtv {
-  position: relative;
+    position: relative;
 }
 .f-w-4 {
-  font-weight: 400;
+    font-weight: 400;
 }
 .f-w-5 {
-  font-weight: 500;
+    font-weight: 500;
 }
 .f-w-6 {
-  font-weight: 600;
+    font-weight: 600;
 }
 .f-w-7 {
-  font-weight: 700;
+    font-weight: 700;
 }
 .h1,
 .h2,
@@ -112,275 +112,278 @@ h3,
 h4,
 h5,
 h6 {
-  font-family: inherit;
-  font-weight: 500;
-  line-height: 1.1;
-  color: inherit;
+    font-family: inherit;
+    font-weight: 500;
+    line-height: 1.1;
+    color: inherit;
 }
 
 .el-form .el-form-item__label {
-  font-weight: 700;
+    font-weight: 700;
 }
 .el-dialog:not(.is-fullscreen) {
-  margin-top: 6vh !important;
+    margin-top: 6vh !important;
 }
 
 .el-dialog.scrollbar .el-dialog__body {
-  overflow: auto;
-  overflow-x: hidden;
-  max-height: 70vh;
-  padding: 10px 20px 0;
+    overflow: auto;
+    overflow-x: hidden;
+    max-height: 70vh;
+    padding: 10px 20px 0;
 }
 
 .el-table {
-  .el-table__header-wrapper,
-  .el-table__fixed-header-wrapper {
-    th {
-      word-break: break-word;
-      background-color: $table-header-bg !important;
-      color: $table-header-text-color;
-      height: 40px !important;
-      font-size: 13px;
+    .el-table__header-wrapper,
+    .el-table__fixed-header-wrapper {
+        th {
+            word-break: break-word;
+            background-color: $table-header-bg !important;
+            color: $table-header-text-color;
+            height: 40px !important;
+            font-size: 13px;
+        }
     }
-  }
-  .el-table__body-wrapper {
-    .el-button [class*='el-icon-'] + span {
-      margin-left: 1px;
+    .el-table__body-wrapper {
+        .el-button [class*='el-icon-'] + span {
+            margin-left: 1px;
+        }
     }
-  }
 }
 
 /** 表单布局 **/
 .form-header {
-  font-size: 15px;
-  color: #6379bb;
-  border-bottom: 1px solid #ddd;
-  margin: 8px 10px 25px 10px;
-  padding-bottom: 5px;
+    font-size: 15px;
+    color: #6379bb;
+    border-bottom: 1px solid #ddd;
+    margin: 8px 10px 25px 10px;
+    padding-bottom: 5px;
 }
 
-
 /* tree border */
 .tree-border {
-  margin-top: 5px;
-  border: 1px solid #e5e6e7;
-  background: #ffffff none;
-  border-radius: 4px;
-  width: 100%;
+    margin-top: 5px;
+    border: 1px solid #e5e6e7;
+    background: #ffffff none;
+    border-radius: 4px;
+    width: 100%;
 }
 
 @media (max-width: 768px) {
-  .pagination-container .el-pagination > .el-pagination__jump {
-    display: none !important;
-  }
-  .pagination-container .el-pagination > .el-pagination__sizes {
-    display: none !important;
-  }
+    .pagination-container .el-pagination > .el-pagination__jump {
+        display: none !important;
+    }
+    .pagination-container .el-pagination > .el-pagination__sizes {
+        display: none !important;
+    }
 }
 
 .el-table .fixed-width .el-button--small {
-  padding-left: 0;
-  padding-right: 0;
-  width: inherit;
+    padding-left: 0;
+    padding-right: 0;
+    width: inherit;
 }
 
 /** 表格更多操作下拉样式 */
 .el-table .el-dropdown-link {
-  cursor: pointer;
-  color: #409eff;
-  margin-left: 10px;
+    cursor: pointer;
+    color: #409eff;
+    margin-left: 10px;
 }
 
 .el-table .el-dropdown,
 .el-icon-arrow-down {
-  font-size: 12px;
+    font-size: 12px;
 }
 
 .el-tree-node__content > .el-checkbox {
-  margin-right: 8px;
+    margin-right: 8px;
 }
 
 .list-group-striped > .list-group-item {
-  border-left: 0;
-  border-right: 0;
-  border-radius: 0;
-  padding-left: 0;
-  padding-right: 0;
+    border-left: 0;
+    border-right: 0;
+    border-radius: 0;
+    padding-left: 0;
+    padding-right: 0;
 }
 
 .list-group {
-  padding-left: 0px;
-  list-style: none;
+    padding-left: 0px;
+    list-style: none;
 }
 
 .list-group-item {
-  border-bottom: 1px solid #e7eaec;
-  border-top: 1px solid #e7eaec;
-  margin-bottom: -1px;
-  padding: 11px 0px;
-  font-size: 13px;
+    border-bottom: 1px solid #e7eaec;
+    border-top: 1px solid #e7eaec;
+    margin-bottom: -1px;
+    padding: 11px 0px;
+    font-size: 13px;
 }
 
 .pull-right {
-  float: right !important;
+    float: right !important;
 }
 
 .el-card__header {
-  padding: 14px 15px 7px !important;
-  min-height: 40px;
+    padding: 14px 15px 7px !important;
+    min-height: 40px;
 }
 
 .el-card__body {
-  padding: 15px 20px 20px 20px !important;
+    padding: 15px 20px 20px 20px !important;
 }
 
 .card-box {
-  padding-right: 15px;
-  padding-left: 15px;
-  margin-bottom: 10px;
+    padding-right: 15px;
+    padding-left: 15px;
+    margin-bottom: 10px;
 }
 
 /* button color */
 .el-button--cyan.is-active,
 .el-button--cyan:active {
-  background: #20b2aa;
-  border-color: #20b2aa;
-  color: #ffffff;
+    background: #20b2aa;
+    border-color: #20b2aa;
+    color: #ffffff;
 }
 
 .el-button--cyan:focus,
 .el-button--cyan:hover {
-  background: #48d1cc;
-  border-color: #48d1cc;
-  color: #ffffff;
+    background: #48d1cc;
+    border-color: #48d1cc;
+    color: #ffffff;
 }
 
 .el-button--cyan {
-  background-color: #20b2aa;
-  border-color: #20b2aa;
-  color: #ffffff;
+    background-color: #20b2aa;
+    border-color: #20b2aa;
+    color: #ffffff;
 }
 
 /* text color */
 .text-navy {
-  color: #1ab394;
+    color: #1ab394;
 }
 
 .text-primary {
-  color: inherit;
+    color: inherit;
 }
 
 .text-success {
-  color: #1c84c6;
+    color: #1c84c6;
 }
 
 .text-info {
-  color: #23c6c8;
+    color: #23c6c8;
 }
 
 .text-warning {
-  color: #f8ac59;
+    color: #f8ac59;
 }
 
 .text-danger {
-  color: #ed5565;
+    color: #ed5565;
 }
 
 .text-muted {
-  color: #888888;
+    color: #888888;
 }
 
 /* image */
 .img-circle {
-  border-radius: 50%;
+    border-radius: 50%;
 }
 
 .img-lg {
-  width: 120px;
-  height: 120px;
+    width: 120px;
+    height: 120px;
 }
 
 /* 拖拽列样式 */
 .sortable-ghost {
-  opacity: 0.8;
-  color: #fff !important;
-  background: #42b983 !important;
+    opacity: 0.8;
+    color: #fff !important;
+    background: #42b983 !important;
 }
 
 /* 表格右侧工具栏样式 */
 .top-right-btn {
-  margin-left: auto;
+    margin-left: auto;
 }
 
 $colors: (
-  333: #333,
-  666: #666,
-  999: #999,
-  fff: #fff,
-  ccc: #ccc,
-  eee: #eee,
-  ddd: #ddd,
-  fa: #FAFAFA,
-  // 主题色
-  primary: #2A6D52,
-  light-black: #4D4D4D,
-  // 成功
-  success: #67C23A,
-  // 警告
-  warning: #E6A23C,
-  // 失败
-  danger: #F56C6C,
-  // 会员绿
-  member-green: #41C06D,
-  // 待审核
-  res-0: #E6A23C,
-  // 审核通过
-  res-1: #67C23A,
-  // 审核失败
-  res-2: #F56C6C,
+    333: #333,
+    666: #666,
+    999: #999,
+    fff: #fff,
+    ccc: #ccc,
+    eee: #eee,
+    ddd: #ddd,
+    fa: #fafafa,
+    // 主题色
+    primary: #2a6d52,
+    light-black: #4d4d4d,
+    // 成功
+    success: #67c23a,
+    // 警告
+    warning: #e6a23c,
+    // 失败
+    danger: #f56c6c,
+    // 会员绿
+    member-green: #41c06d,
+    // 待审核
+    res-0: #e6a23c,
+    // 审核通过
+    res-1: #67c23a,
+    // 审核失败
+    res-2: #f56c6c
 );
 @each $color, $value in $colors {
-  .c-#{$color} {
-    color: $value;
-  }
+    .c-#{$color} {
+        color: $value;
+    }
 }
 @each $color, $value in $colors {
-  .bg-#{$color} {
-    background-color: $value;
-  }
+    .bg-#{$color} {
+        background-color: $value;
+    }
 }
 
 .p-3 {
-  flex: 1;
-  display: flex;
-  flex-direction: column;
-  box-sizing: border-box;
-  padding: 16px;
-  overflow: hidden;
-  box-sizing: border-box;
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    box-sizing: border-box;
+    padding: 16px;
+    overflow: hidden;
+    box-sizing: border-box;
 }
 
 .border-bottom {
-  border-bottom: 1px solid var(--border-color);
+    border-bottom: 1px solid var(--border-color);
 }
 .over-auto {
-  overflow-y: auto;
+    overflow-y: auto;
 }
 .info-title {
-  position: relative;
-  padding-left: 20px;
-  &::before {
-      content: '';
-      position: absolute;
-      top: 0;
-      bottom: 0;
-      left: 0;
-      margin: auto;
-      background-color: var(--el-color-primary);
-      width: 2px;
-      height: 16px;
-  }
+    position: relative;
+    padding-left: 20px;
+    &::before {
+        content: '';
+        position: absolute;
+        top: 0;
+        bottom: 0;
+        left: 0;
+        margin: auto;
+        background-color: var(--el-color-primary);
+        width: 2px;
+        height: 16px;
+    }
 }
 .c-s-p {
-  cursor: pointer;
-}
+    cursor: pointer;
+}
+.p-2 {
+    flex: 1;
+    overflow-y: auto;
+}

src/views/auth/appuser/index.vue

@@ -1,149 +1,147 @@
 <template>
-  <div class="p-2">
-    <transition :enter-active-class="proxy?.animate.searchAnimate.enter"
-      :leave-active-class="proxy?.animate.searchAnimate.leave">
-      <div class="search">
-        <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="108px">
-          <el-form-item label="手机号码" prop="phone">
-            <el-input v-model="queryParams.phone" placeholder="请输入电话号码" clearable style="width: 200px"
-              @keyup.enter="handleQuery" />
-          </el-form-item>
-          <el-form-item label="姓名" prop="name">
-            <el-input v-model="queryParams.name" placeholder="请输入姓名" clearable style="width: 200px"
-              @keyup.enter="handleQuery" />
-          </el-form-item>
-          <el-form-item label="是否绑定邮箱" prop="emailbind">
-            <el-select v-model="queryParams.emailbind" clearable>
-              <el-option v-for="dict in common_yes_no" :value="dict.value" :label="dict.label"></el-option>
-            </el-select>
-          </el-form-item>
-          <el-form-item label="是否绑定微信" prop="wxbind">
-            <el-select v-model="queryParams.wxbind" clearable>
-              <el-option v-for="dict in common_yes_no" :value="dict.value" :label="dict.label"></el-option>
-            </el-select>
-          </el-form-item>
-          <el-form-item>
-            <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
-            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
-          </el-form-item>
-        </el-form>
-      </div>
-    </transition>
-
-    <el-card shadow="never">
-      <template #header v-if="false">
-        <!-- <el-row :gutter="10" class="mb8">
+    <div class="p-3">
+        <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
+            <div class="search">
+                <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="108px">
+                    <el-form-item label="手机号码" prop="phone">
+                        <el-input v-model="queryParams.phone" placeholder="请输入电话号码" clearable style="width: 200px" @keyup.enter="handleQuery" />
+                    </el-form-item>
+                    <el-form-item label="姓名" prop="name">
+                        <el-input v-model="queryParams.name" placeholder="请输入姓名" clearable style="width: 200px" @keyup.enter="handleQuery" />
+                    </el-form-item>
+                    <el-form-item label="是否绑定邮箱" prop="emailbind">
+                        <el-select v-model="queryParams.emailbind" clearable>
+                            <el-option v-for="dict in common_yes_no" :value="dict.value" :label="dict.label"></el-option>
+                        </el-select>
+                    </el-form-item>
+                    <el-form-item label="是否绑定微信" prop="wxbind">
+                        <el-select v-model="queryParams.wxbind" clearable>
+                            <el-option v-for="dict in common_yes_no" :value="dict.value" :label="dict.label"></el-option>
+                        </el-select>
+                    </el-form-item>
+                    <el-form-item>
+                        <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
+                        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
+                    </el-form-item>
+                </el-form>
+            </div>
+        </transition>
+        <div class="flex1 over-auto">
+            <el-card shadow="never">
+                <template #header v-if="false">
+                    <!-- <el-row :gutter="10" class="mb8">
           <el-col :span="1.5">
             <el-button type="warning" plain icon="Download" @click="handleExport"
               v-hasPermi="['auth:user:export']">导出</el-button>
           </el-col>
           <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
         </el-row> -->
-      </template>
-
-      <el-table v-loading="loading" :data="userList" border>
-        <el-table-column type="index" width="55" align="center" label="序号" />
-        <el-table-column label="姓名" align="left" prop="name" width="250">
-          <template #default="scope">
-            <div style="display: flex;align-items: center;">
-              <el-avatar size="small" :src="scope.row.avatar" />
-              <div style="margin-left: 10px;">{{ scope.row.name }}</div>
-            </div>
-          </template>
-        </el-table-column>
-        <el-table-column label="手机号" align="center" prop="phone" width="150" />
-        <el-table-column label="邮箱" align="center" prop="email" width="200" />
-        <el-table-column label="绑定微信" align="center" prop="wxbind" width="90">
-          <template #default="scope">
-            <dict-tag :options="common_yes_no" :value="scope.row.wxbind"></dict-tag>
-          </template>
-        </el-table-column>
-        <el-table-column label="所在企业" align="center" prop="cpyCount" width="300">
-          <template #default="scope">
-            <div v-for="item in scope.row.cpyNames?.split(',')">{{ item }}</div>
-          </template>
-        </el-table-column>
-        <el-table-column label="注册时间" align="center" prop="createTime" width="180" />
-        <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-          <template #default="scope">
-            <el-button size="default" type="primary" @click="handleCpyEdit(scope.row)">修改企业信息</el-button>
-            <el-button size="default" type="primary" @click="handleEdit(scope.row)">修改</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
+                </template>
 
-      <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum"
-        v-model:limit="queryParams.pageSize" @pagination="getList" />
-    </el-card>
-    <el-dialog :close-on-click-modal="false" title="用户信息修改" v-model="userDialogVisible" width="500px" append-to-body>
-      <el-form ref="userFormRef" :model="userForm" :rules="userRules" label-width="108px">
-        <UploadAvatar title="头像" v-model="userForm.avatar"></UploadAvatar>
+                <el-table v-loading="loading" :data="userList" border>
+                    <el-table-column type="index" width="55" align="center" label="序号" />
+                    <el-table-column label="姓名" align="left" prop="name" width="250">
+                        <template #default="scope">
+                            <div style="display: flex;align-items: center;">
+                                <el-avatar size="small" :src="scope.row.avatar" />
+                                <div style="margin-left: 10px;">{{ scope.row.name }}</div>
+                            </div>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="手机号" align="center" prop="phone" width="150" />
+                    <el-table-column label="邮箱" align="center" prop="email" width="200" />
+                    <el-table-column label="绑定微信" align="center" prop="wxbind" width="90">
+                        <template #default="scope">
+                            <dict-tag :options="common_yes_no" :value="scope.row.wxbind"></dict-tag>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="所在企业" align="center" prop="cpyCount" width="300">
+                        <template #default="scope">
+                            <div v-for="item in scope.row.cpyNames?.split(',')">{{ item }}</div>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="注册时间" align="center" prop="createTime" width="180" />
+                    <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+                        <template #default="scope">
+                            <el-button size="default" type="primary" @click="handleCpyEdit(scope.row)">修改企业信息</el-button>
+                            <el-button size="default" type="primary" @click="handleEdit(scope.row)">修改</el-button>
+                        </template>
+                    </el-table-column>
+                </el-table>
 
-        <el-form-item label="姓名" prop="name">
-          <el-input v-model="userForm.name" placeholder="请输入姓名" clearable />
-        </el-form-item>
-        <el-form-item label="手机号" prop="phone">
-          <el-input v-model="userForm.phone" placeholder="请输入手机号" clearable />
-        </el-form-item>
-        <el-form-item label="邮箱" prop="email">
-          <el-input v-model="userForm.email" placeholder="请输入邮箱" clearable />
-        </el-form-item>
-      </el-form>
-      <template #footer>
-        <div class="dialog-footer">
-          <el-button :loading="buttonLoading" type="primary" @click="submitUser">确 定</el-button>
-          <el-button @click="cancelUser">取 消</el-button>
+                <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
+            </el-card>
         </div>
-      </template>
-    </el-dialog>
-    <el-dialog :close-on-click-modal="false" title="企业信息修改" v-model="cpyDialogVisible" width="500px" append-to-body>
-      <div style="display: flex;align-items: center;">
-        <el-avatar size="small" :src="currentUser?.avatar" />
-        <div style="margin-left: 10px;">【{{ currentUser?.name }}】目前已加入企业：</div>
-      </div>
-      <div class="cpy-container" v-loading="loading">
-        <div class="cpy-item" v-for="item in cpyList">
-          <span>{{ item.cpyInfo?.cpyName || '无名' }}({{ item.cpyInfo?.creditCode }})</span><el-button type="text"
-            icon="close" @click="removeUserCpy(item)"></el-button>
-        </div>
-      </div>
-      <span v-show="cpyList.length == 0">暂未加入任何企业</span>
-      <template #footer>
-        <div class="center-btn-container">
+        <el-dialog :close-on-click-modal="false" title="用户信息修改" v-model="userDialogVisible" width="500px" append-to-body>
+            <el-form ref="userFormRef" :model="userForm" :rules="userRules" label-width="108px">
+                <UploadAvatar title="头像" v-model="userForm.avatar"></UploadAvatar>
 
-          <el-button @click="handleCpyAdd" type="primary" :loading="buttonLoading">添加企业<ElIcon>
-              <Plus />
-            </ElIcon> </el-button>
-        </div>
-      </template>
-    </el-dialog>
-    <el-drawer v-model="cpySelectVisible" size="40%" :close-on-click-modal="false" v-loading="loading">
-      <el-form :model="cpyQueryParams" ref="queryFormRef" label-width="100px" :inline="true">
-        <el-form-item label="企业名称" prop="cpyName">
-          <el-input v-model="cpyQueryParams.cpyName" placeholder="请输入企业名称" clearable @keyup.enter="handleQueryCpy" />
-        </el-form-item>
-        <el-form-item label="社会信用代码" prop="creditCode">
-          <el-input v-model="cpyQueryParams.creditCode" placeholder="请输入社会信用代码" clearable @keyup.enter="handleQueryCpy" />
-        </el-form-item>
-        <el-form-item>
-          <el-button type="primary" icon="Search" @click="handleQueryCpy">搜索</el-button>
-          <el-button icon="Refresh" @click="resetQueryCpy">重置</el-button>
-        </el-form-item>
-      </el-form>
-      <el-table v-loading="loading" :data="recordCompanyList" border>
-        <el-table-column type="index" width="55" align="center" label="序号" />
-        <el-table-column label="企业名称" align="center" prop="cpyName" />
-        <el-table-column label="社会统一信用代码" align="center" prop="creditCode"></el-table-column>
-        <el-table-column label="操作" width="100">
-          <template #default="scope">
-            <el-button type="text" @click="addCPy(scope.row)">选择</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <pagination v-show="cpyTotal > 0" :total="cpyTotal" v-model:page="cpyQueryParams.pageNum"
-        v-model:limit="cpyQueryParams.pageSize" @pagination="getCpyList" />
-    </el-drawer>
-  </div>
+                <el-form-item label="姓名" prop="name">
+                    <el-input v-model="userForm.name" placeholder="请输入姓名" clearable />
+                </el-form-item>
+                <el-form-item label="手机号" prop="phone">
+                    <el-input v-model="userForm.phone" placeholder="请输入手机号" clearable />
+                </el-form-item>
+                <el-form-item label="邮箱" prop="email">
+                    <el-input v-model="userForm.email" placeholder="请输入邮箱" clearable />
+                </el-form-item>
+            </el-form>
+            <template #footer>
+                <div class="dialog-footer">
+                    <el-button :loading="buttonLoading" type="primary" @click="submitUser">确 定</el-button>
+                    <el-button @click="cancelUser">取 消</el-button>
+                </div>
+            </template>
+        </el-dialog>
+        <el-dialog :close-on-click-modal="false" title="企业信息修改" v-model="cpyDialogVisible" width="500px" append-to-body>
+            <div style="display: flex;align-items: center;">
+                <el-avatar size="small" :src="currentUser?.avatar" />
+                <div style="margin-left: 10px;">【{{ currentUser?.name }}】目前已加入企业：</div>
+            </div>
+            <div class="cpy-container" v-loading="loading">
+                <div class="cpy-item" v-for="item in cpyList">
+                    <span>{{ item.cpyInfo?.cpyName || '无名' }}({{ item.cpyInfo?.creditCode }})</span>
+                    <el-button type="text" icon="close" @click="removeUserCpy(item)"></el-button>
+                </div>
+            </div>
+            <span v-show="cpyList.length == 0">暂未加入任何企业</span>
+            <template #footer>
+                <div class="center-btn-container">
+                    <el-button @click="handleCpyAdd" type="primary" :loading="buttonLoading">
+                        添加企业
+                        <ElIcon>
+                            <Plus />
+                        </ElIcon>
+                    </el-button>
+                </div>
+            </template>
+        </el-dialog>
+        <el-drawer v-model="cpySelectVisible" size="40%" :close-on-click-modal="false" v-loading="loading">
+            <el-form :model="cpyQueryParams" ref="queryFormRef" label-width="100px" :inline="true">
+                <el-form-item label="企业名称" prop="cpyName">
+                    <el-input v-model="cpyQueryParams.cpyName" placeholder="请输入企业名称" clearable @keyup.enter="handleQueryCpy" />
+                </el-form-item>
+                <el-form-item label="社会信用代码" prop="creditCode">
+                    <el-input v-model="cpyQueryParams.creditCode" placeholder="请输入社会信用代码" clearable @keyup.enter="handleQueryCpy" />
+                </el-form-item>
+                <el-form-item>
+                    <el-button type="primary" icon="Search" @click="handleQueryCpy">搜索</el-button>
+                    <el-button icon="Refresh" @click="resetQueryCpy">重置</el-button>
+                </el-form-item>
+            </el-form>
+            <el-table v-loading="loading" :data="recordCompanyList" border>
+                <el-table-column type="index" width="55" align="center" label="序号" />
+                <el-table-column label="企业名称" align="center" prop="cpyName" />
+                <el-table-column label="社会统一信用代码" align="center" prop="creditCode"></el-table-column>
+                <el-table-column label="操作" width="100">
+                    <template #default="scope">
+                        <el-button type="text" @click="addCPy(scope.row)">选择</el-button>
+                    </template>
+                </el-table-column>
+            </el-table>
+            <pagination v-show="cpyTotal > 0" :total="cpyTotal" v-model:page="cpyQueryParams.pageNum" v-model:limit="cpyQueryParams.pageSize" @pagination="getCpyList" />
+        </el-drawer>
+    </div>
 </template>
 
 <script setup name="User" lang="ts">

src/views/auth/userbind/index.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="p-2">
+    <div class="p-3">
         <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
             <div class="search">
                 <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="108px">
@@ -25,64 +25,64 @@
                 </el-form>
             </div>
         </transition>
-
-        <el-card shadow="never">
-            <template #header v-if="false"></template>
-
-            <el-table v-loading="loading" :data="userList" border>
-                <el-table-column type="index" width="55" align="center" label="序号" />
-                <el-table-column label="姓名" align="left" prop="name" width="200">
-                    <template #default="scope">
-                        <div style="display: flex;align-items: center;">
-                            <el-avatar size="small" :src="scope.row.userInfo.avatar" />
-                            <div style="margin-left: 10px;">{{ scope.row.userInfo.name }}</div>
-                        </div>
-                    </template>
-                </el-table-column>
-                <el-table-column label="手机号" align="left" prop="phone" width="200">
-                    <template #default="scope">
-                        <div style="display: flex;align-items: center;">
-                            <div style="margin-left: 10px;">{{ scope.row.userInfo.phone }}</div>
-                        </div>
-                    </template>
-                </el-table-column>
-                <el-table-column label="申请企业" align="center" prop="cpyName" width="300">
-                    <template #default="scope">
-                        <div style="display: flex;align-items: center;">
-                            <el-avatar size="small" :src="scope.row.cpyInfo.storePhoto" />
-                            <div style="margin-left: 10px;">{{ scope.row.cpyInfo.cpyName }}</div>
-                        </div>
-                    </template>
-                </el-table-column>
-                <el-table-column label="是否有管理员" align="center" prop="hasAdmin" width="90">
-                    <template #default="{ row }">
-                        <dict-tag :options="yes_no" :value="row.hasAdmin"></dict-tag>
-                    </template>
-                </el-table-column>
-                <el-table-column label="统一社会信用代码" align="center" prop="cpyName" width="250">
-                    <template #default="scope">
-                        <div style="margin-left: 10px;">{{ scope.row.cpyInfo.creditCode }}</div>
-                    </template>
-                </el-table-column>
-                <el-table-column label="时间申请" align="center" prop="createTime" width="200" />
-                <el-table-column prop="res" width="90" label="状态">
-                    <template #default="{ row }">
-                        <div :style="{ color: approval_query_type.find((item: any) => item.value === row.res).elTagClass }">
-                            {{ selectDictLabel(approval_query_type, row.res) }}
-                        </div>
-                    </template>
-                </el-table-column>
-                <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
-                    <template #default="scope">
-                        <div v-if="scope.row.res == '0'">
-                            <el-button @click="handleApproval(scope.row, '1')" type="success">审核通过</el-button>
-                            <el-button @click="handleApproval(scope.row, '2')" type="warning">审核不通过</el-button>
-                        </div>
-                    </template>
-                </el-table-column>
-            </el-table>
-            <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
-        </el-card>
+        <div class="flex1 over-auto">
+            <el-card shadow="never">
+                <template #header v-if="false"></template>
+                <el-table v-loading="loading" :data="userList" border>
+                    <el-table-column type="index" width="55" align="center" label="序号" />
+                    <el-table-column label="姓名" align="left" prop="name" width="200">
+                        <template #default="scope">
+                            <div style="display: flex;align-items: center;">
+                                <el-avatar size="small" :src="scope.row.userInfo.avatar" />
+                                <div style="margin-left: 10px;">{{ scope.row.userInfo.name }}</div>
+                            </div>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="手机号" align="left" prop="phone" width="200">
+                        <template #default="scope">
+                            <div style="display: flex;align-items: center;">
+                                <div style="margin-left: 10px;">{{ scope.row.userInfo.phone }}</div>
+                            </div>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="申请企业" align="center" prop="cpyName" width="300">
+                        <template #default="scope">
+                            <div style="display: flex;align-items: center;">
+                                <el-avatar size="small" :src="scope.row.cpyInfo.storePhoto" />
+                                <div style="margin-left: 10px;">{{ scope.row.cpyInfo.cpyName }}</div>
+                            </div>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="是否有管理员" align="center" prop="hasAdmin" width="90">
+                        <template #default="{ row }">
+                            <dict-tag :options="yes_no" :value="row.hasAdmin"></dict-tag>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="统一社会信用代码" align="center" prop="cpyName" width="250">
+                        <template #default="scope">
+                            <div style="margin-left: 10px;">{{ scope.row.cpyInfo.creditCode }}</div>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="时间申请" align="center" prop="createTime" width="200" />
+                    <el-table-column prop="res" width="90" label="状态">
+                        <template #default="{ row }">
+                            <div :style="{ color: approval_query_type.find((item: any) => item.value === row.res).elTagClass }">
+                                {{ selectDictLabel(approval_query_type, row.res) }}
+                            </div>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+                        <template #default="scope">
+                            <div v-if="scope.row.res == '0'">
+                                <el-button @click="handleApproval(scope.row, '1')" type="success">审核通过</el-button>
+                                <el-button @click="handleApproval(scope.row, '2')" type="warning">审核不通过</el-button>
+                            </div>
+                        </template>
+                    </el-table-column>
+                </el-table>
+                <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
+            </el-card>
+        </div>
     </div>
 </template>