diff --git a/src/views/archivesManage/archivesCheck/module/checkDetail.vue b/src/views/archivesManage/archivesCheck/module/checkDetail.vue
index f57b6da..f055c30 100644
--- a/src/views/archivesManage/archivesCheck/module/checkDetail.vue
+++ b/src/views/archivesManage/archivesCheck/module/checkDetail.vue
@@ -93,5 +93,8 @@ p{
     flex: 1;
   }
 }
-
+::v-deep .el-dialog .el-dialog__header .el-dialog__close::before{
+    position: absolute;
+    right: -155px;
+}
 </style>
diff --git a/src/views/archivesManage/lendManage/toLend/index.vue b/src/views/archivesManage/lendManage/toLend/index.vue
index f2553ff..268a37e 100644
--- a/src/views/archivesManage/lendManage/toLend/index.vue
+++ b/src/views/archivesManage/lendManage/toLend/index.vue
@@ -35,84 +35,7 @@
       <el-table-column prop="operationTime" align="center" label="操作时间" min-width="85" />
     </el-table>
     <!-- 借阅登记模态框 -->
-    <el-dialog append-to-body :close-on-click-modal="false" :visible.sync="recordFormVisible" title="借阅登记">
-      <span class="dialog-right-top" />
-      <span class="dialog-left-bottom" />
-      <div class="setting-dialog">
-        <el-form
-          ref="recordFormDom"
-          :model="recordForm"
-          :rules="rules"
-          size="small"
-          label-width="80px"
-        >
-          <el-form-item label="借阅人" prop="borrowerName">
-            <el-input v-model="recordForm.borrowerName" style="width: 420px" />
-          </el-form-item>
-          <el-form-item label="电话号码" prop="tel">
-            <el-input v-model="recordForm.tel" style="width: 420px" />
-          </el-form-item>
-          <el-form-item label="所属部门" prop="department" class="down-select">
-            <el-select
-              v-model="recordForm.departmentDatas"
-              style="width: 420px"
-              multiple
-              placeholder="请选择"
-            >
-              <el-option
-                v-for="item in recordForm.departmentDatas"
-                :key="item.name"
-                :disabled="level !== 1 && item.level <= level"
-                :label="item.name"
-                :value="item.id"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="证件类型" prop="idType" class="down-select">
-            <el-select
-              v-model="recordForm.idType"
-              style="width: 420px"
-              multiple
-              placeholder="请选择"
-            >
-              <el-option
-                v-for="item in recordForm.idType"
-                :key="item.name"
-                :disabled="level !== 1 && item.level <= level"
-                :label="item.name"
-                :value="item.id"
-              />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="证件号码" prop="idNumber">
-            <el-input v-model="recordForm.idNumber" style="width: 420px" />
-          </el-form-item>
-          <el-form-item label="借阅时间" prop="lendDate">
-            <date-range-picker v-model="lendDates" style="width: 420px" />
-            <!-- <el-date-picker v-model="lendDates" type="daterange" start-placeholder="开始日期" range-separator="至" end-placeholder="结束日期" style="width: 420px;" /> -->
-          </el-form-item>
-          <el-form-item label="借阅目的" prop="borrowGoal" class="down-select">
-            <el-select
-              v-model="recordForm.borrowGoal"
-              style="width: 420px"
-              multiple
-              placeholder="请选择"
-            >
-              <el-option
-                v-for="item in recordForm.borrowGoal"
-                :key="item.name"
-                :disabled="level !== 1 && item.level <= level"
-                :label="item.name"
-                :value="item.id"
-              />
-            </el-select>
-          </el-form-item>
-        </el-form>
-        <div slot="footer" class="dialog-footer">
-          <el-button type="primary" @click="handleRecordConfirm">确认</el-button>
-        </div>
-      </div>
-    </el-dialog>
+    <lend-record ref="lendRecordDom" />
     <!-- 移出确认弹框 -->
     <delConfirm ref="delConfirmDom" :list-name="listName" />
     <!-- 档案详情 -->
@@ -129,13 +52,13 @@
 import pagination from '@crud/Pagination'
 // import crudOperation from '@crud/CRUD.operation'
 import headSlot from '../components/headSlot.vue'
-import DateRangePicker from '@/components/DateRangePicker'
 import CRUD, { presenter, crud } from '@crud/crud'
 import delConfirm from '../components/delConfirm.vue'
 import archiveDetail from './module/archiveDetail.vue'
+import lendRecord from './module/lendRecord.vue'
 import data2 from '../data2.json'
 export default {
-  components: { headSlot, pagination, delConfirm, archiveDetail, DateRangePicker },
+  components: { headSlot, pagination, delConfirm, archiveDetail, lendRecord },
   mixins: [presenter(), crud()],
   cruds() {
     return CRUD({
@@ -153,26 +76,9 @@ export default {
   },
   data() {
     return {
-      lendDates: '',
       tableData: [],
       selections: [], // 选中列表
-      listName: '借出列表',
-      recordFormVisible: false,
-      recordForm: {
-        borrowerName: '',
-        tel: '',
-        departmentDatas: [],
-        idType: [],
-        idNumber: '',
-        lendDate: '',
-        borrowGoal: []
-      },
-      rules: {
-        borrowerName: [
-          { required: true, message: '请输入姓名', trigger: 'blur' }
-        ],
-        tel: [{ required: true, message: '请输入电话号码', trigger: 'blur' }]
-      }
+      listName: '借出列表'
     }
   },
   created() {
@@ -184,7 +90,7 @@ export default {
       this.tableData = data2.rows
     },
     handleRecord() {
-      this.recordFormVisible = true
+      this.$refs.lendRecordDom.recordFormVisible = true
     },
     // 移出
     handleRemove() {
@@ -201,22 +107,8 @@ export default {
     },
     clickRowHandler(row) {
       this.$refs.table.toggleRowSelection(row) // 单击选中
-    },
-    handleRecordConfirm() {
-      // console.log(this.lendDates)
-      this.$refs.recordFormDom.validate((valid) => {
-        if (valid) {
-          this.$message({
-            message: '登记成功！',
-            type: 'success'
-          })
-          this.recordFormVisible = false
-        } else {
-          this.$message.error('登记失败！')
-          return false
-        }
-      })
     }
+
     // cell({ row, columnIndex }) {
     //   if (row.lendStatus === '待借' && columnIndex === 7) {
     //     return 'no-lend'
diff --git a/src/views/archivesManage/lendManage/toLend/module/lendRecord.vue b/src/views/archivesManage/lendManage/toLend/module/lendRecord.vue
new file mode 100644
index 0000000..4209112
--- /dev/null
+++ b/src/views/archivesManage/lendManage/toLend/module/lendRecord.vue
@@ -0,0 +1,152 @@
+<template>
+  <div>
+    <el-dialog append-to-body :close-on-click-modal="false" :visible.sync="recordFormVisible" title="借阅登记">
+      <span class="dialog-right-top" />
+      <span class="dialog-left-bottom" />
+      <div class="setting-dialog">
+        <el-form
+          ref="recordFormDom"
+          :model="recordForm"
+          :rules="rules"
+          size="small"
+          label-width="80px"
+          style="margin-left:85px"
+        >
+          <el-form-item label="借阅人" prop="borrowerName">
+            <!-- <el-input v-model="recordForm.borrowerName" style="width: 320px" /> -->
+            <input-select :options="options" @selectValue="handleSelectValue" />
+          </el-form-item>
+          <el-form-item label="电话号码" prop="tel">
+            <el-input v-model="recordForm.tel" />
+          </el-form-item>
+          <el-form-item label="所属部门" prop="department" class="down-select">
+            <el-select
+              v-model="recordForm.departmentDatas"
+              multiple
+              placeholder="请选择"
+            >
+              <el-option
+                v-for="item in recordForm.departmentDatas"
+                :key="item.name"
+                :disabled="level !== 1 && item.level <= level"
+                :label="item.name"
+                :value="item.id"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="证件类型" prop="idType" class="down-select">
+            <el-select
+              v-model="recordForm.idType"
+              multiple
+              placeholder="请选择"
+            >
+              <el-option
+                v-for="item in recordForm.idType"
+                :key="item.name"
+                :disabled="level !== 1 && item.level <= level"
+                :label="item.name"
+                :value="item.id"
+              />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="证件号码" prop="idNumber">
+            <el-input v-model="recordForm.idNumber" />
+          </el-form-item>
+          <el-form-item label="借阅时间" prop="lendDate">
+            <date-range-picker v-model="lendDates" />
+            <!-- <el-date-picker v-model="lendDates" type="daterange" start-placeholder="开始日期" range-separator="至" end-placeholder="结束日期" style="width: 420px;" /> -->
+          </el-form-item>
+          <el-form-item label="借阅目的" prop="borrowGoal" class="down-select">
+            <el-select
+              v-model="recordForm.borrowGoal"
+              multiple
+              placeholder="请选择"
+            >
+              <el-option
+                v-for="item in recordForm.borrowGoal"
+                :key="item.name"
+                :disabled="level !== 1 && item.level <= level"
+                :label="item.name"
+                :value="item.id"
+              />
+            </el-select>
+          </el-form-item>
+        </el-form>
+        <div slot="footer" class="dialog-footer">
+          <el-button type="primary" @click="handleRecordConfirm">确认</el-button>
+        </div>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import DateRangePicker from '@/components/DateRangePicker'
+import InputSelect from '@/views/components/InputSelect.vue'
+
+export default {
+  components: { DateRangePicker, InputSelect },
+  data() {
+    return {
+      lendDates: '',
+      recordFormVisible: false,
+      recordForm: {
+        borrowerName: '',
+        tel: '',
+        departmentDatas: [],
+        idType: [],
+        idNumber: '',
+        lendDate: '',
+        borrowGoal: []
+      },
+      rules: {
+        borrowerName: [
+          { required: true, message: '请输入姓名', trigger: 'blur' }
+        ],
+        tel: [{ required: true, message: '请输入电话号码', trigger: 'blur' }]
+      },
+      options: [
+        {
+          value: '小红-000000000000',
+          label: '小红-000000000000'
+        }, {
+          value: '小明-111111111111',
+          label: '小明-111111111111'
+        },
+        {
+          value: '小黑-222222222222',
+          label: '小黑-222222222222'
+        }
+
+      ]
+    }
+  },
+  methods: {
+    handleRecordConfirm() {
+      // console.log(this.lendDates)
+      this.$refs.recordFormDom.validate((valid) => {
+        if (valid) {
+          this.$message({
+            message: '登记成功！',
+            type: 'success'
+          })
+          this.recordFormVisible = false
+        } else {
+          this.$message.error('登记失败！')
+          return false
+        }
+      })
+    },
+    handleSelectValue(val) {
+      console.log(val, '-------------')
+      this.recordForm.tel = val.split('-')[1]
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+::v-deep .el-input__inner{
+  width: 320px;
+}
+</style>
diff --git a/src/views/components/InputSelect.vue b/src/views/components/InputSelect.vue
new file mode 100644
index 0000000..6854a56
--- /dev/null
+++ b/src/views/components/InputSelect.vue
@@ -0,0 +1,66 @@
+<template>
+  <div>
+    <el-select
+      v-model="value"
+      placeholder="请选择"
+      clearable
+      filterable
+      @clear="selectClear"
+      @change="selectChange"
+    >
+      <el-option
+        v-for="(item,index) in options"
+        :key="index"
+        :label="item.label"
+        :value="item.value"
+      />
+    </el-select>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    options: {
+      type: Array,
+      required: true,
+      default() {
+        return []
+      }
+    }
+  },
+  data() {
+    return {
+      value: '',
+      selectValue: ''
+    }
+  },
+  watch: {
+    selectValue(val) {
+      this.$emit('selectValue', val)
+    }
+  },
+  methods: {
+    // selectBlur(e) {
+    //   if (e.target.value !== '') {
+    //     console.log(e)
+    //     this.$forceUpdate() // 强制更新
+    //   }
+    // },
+    selectClear() {
+      this.value = ''
+      this.$forceUpdate()
+    },
+    selectChange(val) {
+      this.selectValue = val
+      this.value = this.selectValue.split('-')[0]
+      this.$forceUpdate()
+    }
+  }
+
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>