.gitignore

@@ -23,4 +23,6 @@ yarn-error.log*
 *.sw?
 vue.config.js
 package-lock.json
-.history
+.history
+.codebuddy
+.workbuddy

src/components/CommomSelect/dept-select.vue

@@ -8,8 +8,11 @@
     value-key="id"
     default-expand-all
     :placeholder="placeholder"
+    :filterable="filterable"
+    :filter-method="deptFilterMethod"
     @input="updateValue"
     @change="changeChoose"
+    @visible-change="visibleChange"
     ref="treeSelect"
     v-bind="$attrs"
   />
@@ -25,6 +28,16 @@
       placeholder: {
         type: String,
         default: '请选择'
+      },
+      // 是否在下拉框内显示搜索框
+      filterable: {
+        type: Boolean,
+        default: false
+      },
+      // 自定义搜索过滤方法(关键字, 节点数据)，不传则默认按部门名称/部门编码匹配
+      filterMethod: {
+        type: Function,
+        default: null
       }
     },
     data() {
@@ -32,10 +45,27 @@
         treeData: []
       };
     },
+    computed: {
+      // 传给 ele-tree-select 的过滤方法
+      deptFilterMethod() {
+        return this.filterMethod || this.defaultFilterMethod;
+      }
+    },
     created() {
       this.getData();
     },
     methods: {
+      // 默认过滤：按部门名称或部门编码模糊匹配(不区分大小写)
+      defaultFilterMethod(keyword, data) {
+        const key = (keyword || '').trim().toLowerCase();
+        if (!key) {
+          return true;
+        }
+        return (
+          (data.name || '').toLowerCase().includes(key) ||
+          (data.groupCode || '').toLowerCase().includes(key)
+        );
+      },
       async getData(parmas = {}) {
         const data = await listOrganizations(parmas);
         this.treeData = this.$util.toTreeData({
@@ -55,6 +85,16 @@
           this.$refs.treeSelect.getNodeByValue(val)
         );
       },
+      // 下拉框展开/收起时清空上一次的搜索关键字，保证每次打开都是空的
+      visibleChange() {
+        this.$nextTick(() => {
+          const treeSelect = this.$refs.treeSelect;
+          if (treeSelect && treeSelect.keywords) {
+            treeSelect.keywords = '';
+            treeSelect.filterNode();
+          }
+        });
+      },
       async locateByName(code) {
         await this.getData();
         const res = this.findNodesByNameWithPath(this.treeData, code);

src/components/CommomSelect/user-select.vue

@@ -0,0 +1,218 @@
+<!-- 人员选择下拉框（面板内带搜索框，仅可选所选部门下的人员） -->
+<template>
+  <ele-basic-select
+    :value="value || ''"
+    :selected-label="selectedLabel"
+    :selected="[]"
+    :visible="visible"
+    :placeholder="placeholder"
+    clearable
+    popper-class="ele-tree-select-dropdown"
+    @update:visible="updateVisible"
+    @clear="clearValue"
+  >
+    <!-- 搜索框 -->
+    <div class="ele-tree-select-search">
+      <el-input
+        v-model="keyword"
+        clearable
+        size="mini"
+        placeholder="搜索姓名/工号/账号"
+        prefix-icon="el-icon-search"
+      />
+    </div>
+    <!-- 人员列表 -->
+    <div class="user-select-list">
+      <div
+        v-for="item in filteredList"
+        :key="item.id"
+        class="user-select-item"
+        :class="{ 'is-active': item.id == value }"
+        @click="selectItem(item)"
+      >
+        <span class="user-select-name">{{ item.name }}</span>
+        <span v-if="item.jobNumber" class="user-select-job">
+          {{ item.jobNumber }}
+        </span>
+      </div>
+      <div v-if="!filteredList.length" class="user-select-empty">
+        {{ emptyText }}
+      </div>
+    </div>
+  </ele-basic-select>
+</template>
+
+<script>
+  import { getUserPage } from '@/api/system/organization';
+  export default {
+    name: 'UserSelect',
+    props: {
+      // 选中的数据(v-model)
+      value: [Number, String],
+      // 部门id，必须先选择部门才能选择人员
+      groupId: [Number, String],
+      // 已选人员姓名(列表未加载完成时用于回显)
+      label: {
+        type: String,
+        default: ''
+      },
+      // 提示信息
+      placeholder: {
+        type: String,
+        default: '请选择'
+      }
+    },
+    data() {
+      return {
+        visible: false,
+        keyword: '',
+        // 部门人员列表
+        userList: [],
+        loading: false,
+        // 请求序号，避免并发请求返回顺序错乱
+        reqId: 0
+      };
+    },
+    computed: {
+      // 回显文本
+      selectedLabel() {
+        const user = this.userList.find((item) => item.id == this.value);
+        return user ? user.name : this.label || '';
+      },
+      // 搜索过滤后的列表(姓名/工号/账号)
+      filteredList() {
+        const key = (this.keyword || '').trim().toLowerCase();
+        if (!key) {
+          return this.userList;
+        }
+        return this.userList.filter((item) => {
+          return (
+            (item.name || '').toLowerCase().includes(key) ||
+            (item.jobNumber || '').toLowerCase().includes(key) ||
+            (item.loginName || '').toLowerCase().includes(key)
+          );
+        });
+      },
+      // 空列表提示
+      emptyText() {
+        if (!this.groupId) {
+          return '请先选择部门';
+        }
+        if (this.loading) {
+          return '加载中...';
+        }
+        if (!this.userList.length) {
+          return '该部门暂无人员';
+        }
+        return '未匹配到人员';
+      }
+    },
+    watch: {
+      // 部门变化后重新查询人员(已选人员由父组件清空)
+      groupId(val, oldVal) {
+        if (val == oldVal) {
+          return;
+        }
+        // 清空旧部门的人员与搜索条件，避免展示过期数据
+        this.userList = [];
+        this.keyword = '';
+        this.visible = false;
+        if (this.groupId) {
+          this.getData();
+        }
+      }
+    },
+    created() {
+      if (this.groupId) {
+        this.getData();
+      }
+    },
+    methods: {
+      // 获取所选部门下的人员
+      async getData() {
+        if (!this.groupId) {
+          this.userList = [];
+          return;
+        }
+        const reqId = ++this.reqId;
+        this.loading = true;
+        try {
+          const res = await getUserPage({
+            pageNum: 1,
+            size: -1,
+            groupId: this.groupId
+          });
+          if (reqId !== this.reqId) {
+            return;
+          }
+          this.userList = res.list || [];
+        } catch (error) {
+          this.userList = [];
+        } finally {
+          if (reqId === this.reqId) {
+            this.loading = false;
+          }
+        }
+      },
+      updateVisible(visible) {
+        this.visible = visible;
+        if (visible) {
+          this.keyword = '';
+          if (this.groupId && !this.userList.length) {
+            this.getData();
+          }
+        }
+      },
+      selectItem(item) {
+        this.$emit('input', item.id);
+        this.$emit('change', item);
+        this.visible = false;
+        this.keyword = '';
+      },
+      clearValue() {
+        this.$emit('input', null);
+        this.$emit('change', null);
+      }
+    }
+  };
+</script>
+
+<style lang="scss" scoped>
+  .user-select-list {
+    max-height: 274px;
+    overflow-y: auto;
+  }
+  .user-select-item {
+    height: 34px;
+    line-height: 34px;
+    padding: 0 20px;
+    font-size: 14px;
+    color: #606266;
+    cursor: pointer;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    &:hover {
+      background-color: #f5f7fa;
+    }
+    &.is-active {
+      color: #409eff;
+      font-weight: 600;
+    }
+  }
+  .user-select-name {
+    margin-right: 10px;
+  }
+  .user-select-job {
+    color: #909399;
+    font-size: 12px;
+  }
+  .user-select-empty {
+    height: 34px;
+    line-height: 34px;
+    padding: 0 20px;
+    color: #909399;
+    font-size: 14px;
+    text-align: center;
+  }
+</style>

src/views/inspectionProjectTask/components/inspectionProjectTaskSend.vue

@@ -89,23 +89,18 @@
             <deptSelect
               v-model="form.executeDeptId"
               @changeGroup="searchDeptNodeClick"
+              filterable
             /> </el-form-item
         ></el-col>
         <el-col :span="8">
           <el-form-item label="执行人" prop="executeUserId">
-            <el-select
+            <userSelect
               v-model="form.executeUserId"
+              :group-id="form.executeDeptId"
+              :label="form.executeUserName"
               @change="changeExecutor"
-              filterable
-              style="width: 100%"
-            >
-              <el-option
-                v-for="item in executorList"
-                :key="item.id"
-                :value="item.id"
-                :label="item.name"
-              ></el-option>
-            </el-select> </el-form-item></el-col
+              :placeholder="form.executeDeptId ? '请选择人员' : '请先选择部门'"
+            /> </el-form-item></el-col
       ></el-row>
       <el-row v-else>
         <el-col :span="8">
@@ -114,23 +109,18 @@
               v-model="form.receiveDeptId"
               @changeGroup="searchDeptNodeClick"
               ref="deptSelect"
+              filterable
             /> </el-form-item
         ></el-col>
         <el-col :span="8">
           <el-form-item label="接收人" prop="receiveUserId">
-            <el-select
+            <userSelect
               v-model="form.receiveUserId"
+              :group-id="form.receiveDeptId"
+              :label="form.receiveUserName"
               @change="changeExecutor"
-              filterable
-              style="width: 100%"
-            >
-              <el-option
-                v-for="item in executorList"
-                :key="item.id"
-                :value="item.id"
-                :label="item.name"
-              ></el-option>
-            </el-select> </el-form-item></el-col
+              :placeholder="form.receiveDeptId ? '请选择人员' : '请先选择部门'"
+            /> </el-form-item></el-col
       ></el-row>
       <el-row>
         <el-col :span="8">
@@ -168,7 +158,7 @@
   } from '@/api/inspectionProjectRequest';
   import { inspectionProjectStatus } from '@/enum/dict.js';
   import deptSelect from '@/components/CommomSelect/dept-select.vue';
-  import { getUserPage } from '@/api/system/organization';
+  import userSelect from '@/components/CommomSelect/user-select.vue';
   import { recordingMethodList } from '@/utils/util.js';
   import { getCode } from '@/api/login/index.js';
   const defaultForm = {
@@ -186,7 +176,7 @@
     type: 1
   };
   export default {
-    components: { deptSelect },
+    components: { deptSelect, userSelect },
 
     data() {
       return {
@@ -194,7 +184,6 @@
         recordingMethodList,
         pgaeName: '',
         form: { ...defaultForm },
-        executorList: [],
         selection: [],
         list: [],
         templateLis: [],
@@ -499,15 +488,6 @@
         this.templateIdS = [];
         if (pgaeName == 'inspectionProjectRequest') {
           this.form = await getQualityInspectionItemById(row.id);
-          this.getUserList(
-            {
-              groupId:
-                this.type == 1
-                  ? this.form.executeDeptId
-                  : this.form.receiveDeptId
-            },
-            true
-          );
           const list =
             row.recordingMethod == 1
               ? this.form.templateList
@@ -545,47 +525,32 @@
       searchDeptNodeClick(info, row) {
         let depKey = this.type == 1 ? 'executeDeptId' : 'receiveDeptId';
         let depNameKey = this.type == 1 ? 'executeDeptName' : 'receiveDeptName';
+        let userKey = this.type == 1 ? 'executeUserId' : 'receiveUserId';
+        let userNameKey =
+          this.type == 1 ? 'executeUserName' : 'receiveUserName';
 
         if (info) {
-          const params = { groupId: info };
           this.form[depKey] = info;
           this.form[depNameKey] = row.name;
-          this.getUserList(params);
         } else {
           this.form[depKey] = null;
           this.form[depNameKey] = null;
-          this.executorList = [];
         }
+        // 部门变化后人员范围变化，清空已选人员
+        this.form[userKey] = null;
+        this.form[userNameKey] = null;
       },
-      // 获取人员
-      async getUserList(params, init) {
+      // 选中/清空人员
+      changeExecutor(user) {
         let userKey = this.type == 1 ? 'executeUserId' : 'receiveUserId';
         let userNameKey =
           this.type == 1 ? 'executeUserName' : 'receiveUserName';
-        try {
-          let data = { pageNum: 1, size: -1 };
-
-          if (params) {
-            data = Object.assign(data, params);
-          }
-          const res = await getUserPage(data);
-          this.executorList = res.list;
-          if (init) {
-            return;
-          }
+        if (user) {
+          this.form[userKey] = user.id;
+          this.form[userNameKey] = user.name;
+        } else {
           this.form[userKey] = null;
           this.form[userNameKey] = null;
-        } catch (error) {}
-      },
-      changeExecutor(val) {
-        let userKey = this.type == 1 ? 'executeUserId' : 'receiveUserId';
-        let userNameKey =
-          this.type == 1 ? 'executeUserName' : 'receiveUserName';
-        if (val) {
-          this.form[userKey] = val;
-          this.form[userNameKey] = this.executorList.find(
-            (item) => item.id === val
-          ).name;
         }
       },
       save() {

src/views/inspectionWork/components/baseInfo.vue

@@ -221,6 +221,7 @@
           >
             <el-input
               :min="0"
+              disabled
               @input="limitation('qualifiedNumber', form.qualifiedNumber)"
               @blur="quantityCalculation('qualifiedNumber')"
               v-model="form.qualifiedNumber"
@@ -239,6 +240,7 @@
           >
             <el-input
               :min="0"
+              disabled
               @input="limitation('noQualifiedNumber', form.noQualifiedNumber)"
               @blur="quantityCalculation('noQualifiedNumber')"
               v-model="form.noQualifiedNumber"

src/views/qualityBoard/components/DrillDialog.vue

@@ -349,22 +349,48 @@ export default {
 </script>
 
 <style>
-/* append-to-body 后 scoped 失效，统一以 .qb-drill-dialog / .qb-drill-popper 收窄作用域 */
+/* 弹窗外壳：与看板同款深空蓝 + 青色边框 + 角括号 */
 .qb-drill-dialog.el-dialog {
-  border: 1px solid #2a4d92;
-  border-radius: 10px;
-  background: radial-gradient(circle at 12% 0%, #16304f 0%, #0c1c42 46%, #0a1730 100%);
-  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.55);
+  border: 1px solid rgba(0, 200, 255, 0.28);
+  border-radius: 4px;
+  background:
+    radial-gradient(ellipse 70% 42% at 50% -8%, rgba(0, 150, 220, 0.25), transparent 58%),
+    linear-gradient(180deg, #001526 0%, #000912 46%, #00060d 100%);
+  box-shadow:
+    0 24px 60px rgba(0, 0, 0, 0.55),
+    0 0 32px rgba(0, 190, 255, 0.12);
   overflow: hidden;
 }
+/* 左上 / 右下角括号（与看板卡片同款） */
+.qb-drill-dialog.el-dialog::before,
+.qb-drill-dialog.el-dialog::after {
+  content: '';
+  position: absolute;
+  z-index: 3;
+  width: 18px;
+  height: 18px;
+  border: 2px solid #00eaff;
+  pointer-events: none;
+  filter: drop-shadow(0 0 6px rgba(0, 230, 255, 0.65));
+}
+.qb-drill-dialog.el-dialog::before {
+  top: 0;
+  left: 0;
+  border-width: 2px 0 0 2px;
+}
+.qb-drill-dialog.el-dialog::after {
+  right: 0;
+  bottom: 0;
+  border-width: 0 2px 2px 0;
+}
 .qb-drill-dialog .el-dialog__header {
   position: relative;
   padding: 0;
-  border-bottom: 1px solid rgba(59, 167, 255, 0.18);
+  border-bottom: 1px solid rgba(0, 200, 255, 0.22);
 }
 .qb-drill-dialog .el-dialog__body {
   padding: 0;
-  color: #dbe7f7;
+  color: #e4f6ff;
 }
 .qb-drill-head {
   display: flex;
@@ -384,31 +410,34 @@ export default {
   display: flex;
   align-items: center;
   font-size: 18px;
-  font-weight: 600;
+  font-weight: 650;
   letter-spacing: 1px;
-  color: #eaf4ff;
+  color: #eaf9ff;
+  text-shadow: 0 0 12px rgba(0, 200, 255, 0.35);
 }
+/* 标题竖条：看板面板标题同款渐变辉光条 */
 .qb-drill-title-bar {
   width: 4px;
   height: 16px;
   margin-right: 8px;
-  border-radius: 2px;
-  background: linear-gradient(180deg, #4fb6ff, #25d0b0);
+  background: linear-gradient(180deg, #7af6ff, rgba(0, 180, 255, 0.1));
+  box-shadow: 0 0 10px rgba(0, 230, 255, 0.8);
 }
 .qb-drill-source {
   margin-top: 4px;
   font-size: 12px;
-  color: #8aa0bd;
+  color: #7eafc8;
 }
-/* 工厂筛选提示：与标题同一行，用边框胶囊与口径说明区分 */
+/* 工厂筛选提示：青色胶囊，与口径说明区分 */
 .qb-drill-factory {
   margin-top: 4px;
   margin-left: 10px;
   padding: 1px 10px;
   font-size: 12px;
-  color: #7fe3c8;
-  border: 1px solid rgba(37, 208, 176, 0.45);
+  color: #4fe3ff;
+  border: 1px solid rgba(0, 210, 255, 0.4);
   border-radius: 10px;
+  background: rgba(0, 150, 220, 0.12);
 }
 /* 导出 / 关闭按钮组：绝对定位到标题栏右上角，不受标题宽度影响 */
 .qb-drill-head-right {
@@ -425,10 +454,10 @@ export default {
   align-items: center;
   padding: 6px 14px;
   font-size: 12px;
-  color: #cfe2ff;
-  background: rgba(59, 167, 255, 0.12);
-  border: 1px solid rgba(59, 167, 255, 0.5);
-  border-radius: 6px;
+  color: #d5f1ff;
+  background: rgba(0, 40, 70, 0.6);
+  border: 1px solid rgba(0, 210, 255, 0.45);
+  border-radius: 4px;
   cursor: pointer;
   transition: all 0.2s;
 }
@@ -437,8 +466,9 @@ export default {
 }
 .qb-drill-btn:hover:not(:disabled) {
   color: #fff;
-  background: rgba(59, 167, 255, 0.26);
-  border-color: #3ba7ff;
+  background: rgba(0, 150, 220, 0.3);
+  border-color: rgba(0, 230, 255, 0.8);
+  box-shadow: 0 0 14px rgba(0, 200, 255, 0.25);
   transform: translateY(-1px);
 }
 .qb-drill-btn:disabled {
@@ -446,10 +476,16 @@ export default {
   cursor: not-allowed;
 }
 .qb-drill-btn-primary {
-  color: #fff;
-  background: linear-gradient(90deg, #2b7cff, #25d0b0);
+  color: #02121f;
+  background: linear-gradient(90deg, #00b4ff, #00eaff);
   border-color: transparent;
   font-weight: 600;
+  text-shadow: none;
+}
+.qb-drill-btn-primary:hover:not(:disabled) {
+  color: #02121f;
+  background: linear-gradient(90deg, #00c4ff, #4df0ff);
+  box-shadow: 0 0 18px rgba(0, 220, 255, 0.45);
 }
 /* 右上角关闭按钮 */
 .qb-drill-btn-close {
@@ -465,6 +501,7 @@ export default {
   color: #fff;
   background: rgba(255, 107, 129, 0.28);
   border-color: #ff6b81;
+  box-shadow: 0 0 14px rgba(255, 107, 129, 0.3);
 }
 .qb-drill-body {
   padding: 0 18px 12px;
@@ -475,7 +512,7 @@ export default {
   align-items: center;
   gap: 8px 10px;
   padding: 12px 0;
-  border-bottom: 1px dashed rgba(59, 167, 255, 0.16);
+  border-bottom: 1px dashed rgba(0, 200, 255, 0.18);
 }
 .qb-drill-field {
   display: flex;
@@ -486,7 +523,7 @@ export default {
   flex: 0 0 auto;
   margin-right: 6px;
   font-size: 12px;
-  color: #8aa0bd;
+  color: #7eafc8;
   white-space: nowrap;
 }
 .qb-drill-control {
@@ -517,150 +554,151 @@ export default {
 }
 .qb-drill-total {
   font-size: 12px;
-  color: #8aa0bd;
+  color: #7eafc8;
 }
 .qb-drill-total i {
   font-style: normal;
   font-weight: 700;
-  color: #4fb6ff;
+  color: #4fe3ff;
 }
 
 .qb-drill-tag {
   border: none;
 }
-/* 输入控件深色化 */
+/* 输入控件深色化（青色系） */
 .qb-drill-dialog .el-input__inner,
 .qb-drill-dialog .el-range-input,
 .qb-drill-dialog .el-range-separator {
-  background: #0e1a30;
-  color: #dbe7f7;
-  border-color: rgba(42, 77, 146, 0.9);
+  background: rgba(0, 24, 46, 0.9);
+  color: #e4f6ff;
+  border-color: rgba(0, 210, 255, 0.38);
   font-size: 12px;
 }
 .qb-drill-dialog .el-range-editor.el-input__inner {
-  background: #0e1a30;
-  border-color: rgba(42, 77, 146, 0.9);
+  background: rgba(0, 24, 46, 0.9);
+  border-color: rgba(0, 210, 255, 0.38);
 }
 .qb-drill-dialog .el-input__inner:focus,
 .qb-drill-dialog .el-range-editor.is-active {
-  border-color: #3ba7ff;
-  box-shadow: 0 0 0 2px rgba(59, 167, 255, 0.16);
+  border-color: rgba(0, 230, 255, 0.8);
+  box-shadow: 0 0 0 2px rgba(0, 220, 255, 0.16);
 }
 .qb-drill-dialog .el-range-editor.is-active .el-range-input {
-  background: #0e1a30;
+  background: rgba(0, 24, 46, 0.9);
 }
 .qb-drill-dialog .el-range-editor .el-range__icon,
 .qb-drill-dialog .el-range-editor .el-range__close-icon {
-  color: #54708f;
+  color: #6f97b0;
 }
-/* 表格深色化 */
+/* 表格深色化（青色系） */
 .qb-drill-dialog .el-table {
   background: transparent;
-  color: #cfe2ff;
+  color: #d5f1ff;
   font-size: 12px;
 }
 .qb-drill-dialog .el-table::before {
-  background-color: rgba(42, 77, 146, 0.5);
+  background-color: rgba(0, 200, 255, 0.3);
 }
 .qb-drill-dialog .el-table th.el-table__cell {
-  background: #10233f;
-  color: #8aa0bd;
+  background: rgba(0, 45, 80, 0.65);
+  color: #8fc4de;
   font-weight: 600;
   font-size: 12px;
-  border-bottom-color: rgba(42, 77, 146, 0.6);
+  border-bottom-color: rgba(0, 200, 255, 0.35);
 }
 .qb-drill-dialog .el-table tr {
   background: transparent;
 }
 .qb-drill-dialog .el-table td.el-table__cell {
-  border-bottom-color: rgba(42, 77, 146, 0.35);
+  border-bottom-color: rgba(0, 200, 255, 0.18);
   background: transparent;
 }
 .qb-drill-dialog .el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
-  background: rgba(59, 167, 255, 0.04);
+  background: rgba(0, 200, 255, 0.05);
 }
 .qb-drill-dialog .el-table__body tr:hover > td.el-table__cell {
-  background: rgba(59, 167, 255, 0.12) !important;
+  background: rgba(0, 200, 255, 0.14) !important;
 }
 .qb-drill-dialog .el-table__empty-text {
-  color: #54708f;
+  color: #6f97b0;
   font-size: 12px;
 }
 .qb-drill-dialog .el-table__fixed-right::before,
 .qb-drill-dialog .el-table__fixed::before {
-  background-color: rgba(42, 77, 146, 0.5);
+  background-color: rgba(0, 200, 255, 0.3);
 }
-/* 分页深色化 */
+/* 分页深色化（青色系） */
 .qb-drill-dialog .el-pagination {
   padding: 0;
-  color: #8aa0bd;
+  color: #7eafc8;
   font-size: 12px;
 }
 .qb-drill-dialog .el-pagination.is-background .btn-prev,
 .qb-drill-dialog .el-pagination.is-background .btn-next,
 .qb-drill-dialog .el-pagination.is-background .el-pager li {
-  background: rgba(59, 167, 255, 0.08);
-  color: #8aa0bd;
-  border: 1px solid rgba(42, 77, 146, 0.6);
+  background: rgba(0, 190, 255, 0.1);
+  color: #8fc4de;
+  border: 1px solid rgba(0, 200, 255, 0.3);
 }
 .qb-drill-dialog .el-pagination.is-background .el-pager li:not(.disabled).active {
-  background: linear-gradient(90deg, #2b7cff, #25d0b0);
-  color: #fff;
+  background: linear-gradient(90deg, #00b4ff, #00eaff);
+  color: #02121f;
+  font-weight: 600;
   border-color: transparent;
 }
 .qb-drill-dialog .el-pagination .el-select .el-input .el-input__inner,
 .qb-drill-dialog .el-pagination__editor.el-input .el-input__inner {
-  background: #0e1a30;
-  color: #dbe7f7;
-  border-color: rgba(42, 77, 146, 0.9);
+  background: rgba(0, 24, 46, 0.9);
+  color: #e4f6ff;
+  border-color: rgba(0, 210, 255, 0.38);
 }
-/* 下拉面板挂载在 body，单独收窄 */
+/* 下拉面板挂载在 body，单独收窄（HR org-popper 同款） */
 .qb-drill-popper.el-select-dropdown,
 .qb-drill-popper.el-picker-panel {
-  background: #0e1a30;
-  border-color: #2a4d92;
-  color: #dbe7f7;
+  background: linear-gradient(180deg, rgba(3, 28, 48, 0.98), rgba(2, 15, 30, 0.98));
+  border-color: rgba(0, 200, 255, 0.34) !important;
+  color: #e4f6ff;
 }
 .qb-drill-popper .el-select-dropdown__item {
-  color: #cfe2ff;
+  color: #d5f1ff;
   font-size: 12px;
 }
 .qb-drill-popper .el-select-dropdown__item.hover,
 .qb-drill-popper .el-select-dropdown__item:hover {
-  background: rgba(59, 167, 255, 0.14);
+  background: rgba(0, 150, 220, 0.22);
 }
 .qb-drill-popper .el-select-dropdown__item.selected {
-  color: #4fb6ff;
+  color: #4fe3ff;
 }
 .qb-drill-popper .el-date-table th {
-  color: #8aa0bd;
+  color: #8fc4de;
 }
 .qb-drill-popper .el-date-table td.available:hover,
 .qb-drill-popper .el-date-table td.today span {
-  color: #4fb6ff;
+  color: #4fe3ff;
 }
 .qb-drill-popper .el-date-table td.in-range div,
 .qb-drill-popper .el-date-table td.in-range div:hover {
-  background: rgba(59, 167, 255, 0.16);
+  background: rgba(0, 150, 220, 0.24);
 }
 .qb-drill-popper .el-picker-panel__icon-btn,
 .qb-drill-popper .el-date-picker__header-label,
 .qb-drill-popper .el-date-range-picker__header div {
-  color: #cfe2ff;
+  color: #d5f1ff;
 }
 .qb-drill-popper .el-picker-panel__footer {
-  background: #0c1c42;
-  border-top-color: rgba(42, 77, 146, 0.5);
+  background: rgba(2, 15, 30, 0.98);
+  border-top-color: rgba(0, 200, 255, 0.3);
 }
 .qb-drill-popper .el-button--text {
-  color: #4fb6ff;
+  color: #4fe3ff;
 }
 .qb-drill-popper .el-time-panel {
-  background: #0e1a30;
-  border-color: #2a4d92;
+  background: linear-gradient(180deg, rgba(3, 28, 48, 0.98), rgba(2, 15, 30, 0.98));
+  border-color: rgba(0, 200, 255, 0.34);
 }
 .qb-drill-popper .el-time-spinner__item {
-  color: #cfe2ff;
+  color: #d5f1ff;
 }
 @media (max-width: 1280px) {
   .qb-drill-field {