人员档案接口

src/api/toBeDone/toBeDone.js

@@ -0,0 +1,10 @@
+import request from "@/utils/httpRequest";
+
+export default class toBeDone {
+    list(params) {
+        return request.get(
+            ``,
+            params
+        )
+    }
+}

src/api/user/UserManage.js

@@ -0,0 +1,10 @@
+import request from "@/utils/request";
+
+export default class UserManage {
+    list(params) {
+        return request.get(
+            `/user/usermanagement/userManagement/list`,
+            params
+        )
+    }
+}

src/views/placeManage/placePerson.vue

@@ -11,30 +11,44 @@
       <template #action>
         <div @click="onClickButton">
           <van-dropdown-menu>
-            <van-dropdown-item overlay="false" v-model="value1" :options="option1" />
+            <van-dropdown-item
+              overlay="false"
+              v-model="value1"
+              :options="option1"
+            />
           </van-dropdown-menu>
         </div>
       </template>
     </van-search>
   </div>
   <div class="PersonList">
-    <div class="PersonItem" v-for="item in Person.PersonList" :key="item.id" @click="goPlacePersonInfo">
+    <div
+      class="PersonItem"
+      v-for="item in Person.PersonList"
+      :key="item.id"
+      @click="goPlacePersonInfo"
+    >
       <van-row>
         <van-col span="18">
-            <p>{{item.name}}（<span style="color:#36a7f3;">{{item.id}}</span>）</p>
+          <p>
+            {{ item.name }}（<span style="color: #36a7f3">{{ item.idcard }}</span
+            >）
+          </p>
         </van-col>
         <van-col span="6">
-            <p v-if="item.church == '基督教'" style="color:#36a7f3;">基督教</p>
-            <p v-else-if="item.church == '佛教'" style="color:#e4dd65;">佛教</p>
-            <p v-else-if="item.church == '伊斯兰教'" style="color:#52ca7d;">伊斯兰教</p>
+          <p v-if="item.church == '基督教'" style="color: #36a7f3">基督教</p>
+          <p v-else-if="item.church == '佛教'" style="color: #e4dd65">佛教</p>
+          <p v-else-if="item.church == '伊斯兰教'" style="color: #52ca7d">
+            伊斯兰教
+          </p>
         </van-col>
       </van-row>
       <van-row>
         <van-col span="18">
-            <p>{{item.address}}</p>
+          <p>{{ item.nativePlace }}</p>
         </van-col>
         <van-col span="6">
-            <p>{{item.position}}</p>
+          <p>{{ item.position }}</p>
         </van-col>
       </van-row>
     </div>
@@ -42,8 +56,10 @@
 </template>
 
 <script>
-import { reactive,ref } from "vue";
-import { useRouter } from 'vue-router'
+import { reactive, ref } from "vue";
+import { useRouter } from "vue-router";
+import UserManage from "@/api/user/UserManage";
+import { List } from 'vant';
 export default {
   setup() {
     const value = ref("");
@@ -55,49 +71,65 @@ export default {
       { text: "伊斯兰教", value: 3 },
     ];
     const Person = reactive({
-        PersonList:[
-            {
-                name:'孙辉',
-                id:'320902198901523010',
-                church:'基督教',
-                address:'盐都基督教总教',
-                position:'教职人员'
-            },
-            {
-                name:'孙辉',
-                id:'320902198901523010',
-                church:'佛教',
-                address:'盐城永宁寺',
-                position:'教职人员'
-            },
-            {
-                name:'孙辉',
-                id:'320902198901523010',
-                church:'基督教',
-                address:'盐都基督教总教',
-                position:'教职人员'
-            },
-            {
-                name:'孙辉',
-                id:'320902198901523010',
-                church:'基督教',
-                address:'盐都基督教总教',
-                position:'教职人员'
-            },
-            {
-                name:'孙辉',
-                id:'320902198901523010',
-                church:'伊斯兰教',
-                address:'盐都清真寺',
-                position:'教职人员'
-            },
-        ]
-    })
+      PersonList: [
+        {
+          name: "孙辉",
+          id: "320902198901523010",
+          church: "基督教",
+          address: "盐都基督教总教",
+          position: "教职人员",
+        },
+        {
+          name: "孙辉",
+          id: "320902198901523010",
+          church: "佛教",
+          address: "盐城永宁寺",
+          position: "教职人员",
+        },
+        {
+          name: "孙辉",
+          id: "320902198901523010",
+          church: "基督教",
+          address: "盐都基督教总教",
+          position: "教职人员",
+        },
+        {
+          name: "孙辉",
+          id: "320902198901523010",
+          church: "基督教",
+          address: "盐都基督教总教",
+          position: "教职人员",
+        },
+        {
+          name: "孙辉",
+          id: "320902198901523010",
+          church: "伊斯兰教",
+          address: "盐都清真寺",
+          position: "教职人员",
+        },
+      ],
+    });
     //跳转
-    let router = useRouter()
-    const goPlacePersonInfo = ()=>{
-      router.push("/placePersoninfo")
-    }
+    let router = useRouter();
+    const goPlacePersonInfo = () => {
+      router.push("/placePersoninfo");
+    };
+
+    //数据获取
+    let list = ref([])
+    const loading = ref(false);
+    const finished = ref(false);
+    new UserManage()
+      .list({
+        current:  1,
+        size: 10,
+      })
+      .then((res) => {
+        // console.log(res);
+        list.value.push(...res.records)
+        Person.PersonList = list
+      });
+
     //返回
     const goback = () => {
       history.back();
@@ -108,7 +140,9 @@ export default {
       value1,
       option1,
       Person,
-      goPlacePersonInfo
+      loading,
+      finished,
+      goPlacePersonInfo,
     };
   },
 };
@@ -139,48 +173,47 @@ html {
 .PersonList {
   background-color: #fff;
   margin-top: 20px;
-  height: 600px;
-  p{
+  height: 100vh;
+  p {
     margin: 0;
     padding: 0;
   }
-  .PersonItem{
+  .PersonItem {
     padding: 10px 10px;
     font-size: 16px;
     border-bottom: 1px solid #f2f2f2;
-    .van-row{
-        &:nth-child(1){
-            margin-bottom: 10px;
-            .van-col{
-                &:nth-child(1){
-                    p{
-                        font-weight: 700;
-                    }
-                }
-                &:nth-child(2){
-                    p{
-                        text-align: right;
-                    }
-                }
+    .van-row {
+      &:nth-child(1) {
+        margin-bottom: 10px;
+        .van-col {
+          &:nth-child(1) {
+            p {
+              font-weight: 700;
+            }
+          }
+          &:nth-child(2) {
+            p {
+              text-align: right;
             }
+          }
         }
-        &:nth-child(2){
-            .van-col{
-                &:nth-child(1){
-                    p{
-                        color: #d0d0d0;
-                    }
-                }
-                &:nth-child(2){
-                    p{
-                        text-align: right;
-                        color: #d0d0d0;
-                    }
-                }
+      }
+      &:nth-child(2) {
+        .van-col {
+          &:nth-child(1) {
+            p {
+              color: #d0d0d0;
+            }
+          }
+          &:nth-child(2) {
+            p {
+              text-align: right;
+              color: #d0d0d0;
             }
+          }
         }
+      }
     }
   }
-  
 }
 </style>

src/views/placeManage/placePersoninfo.vue

@@ -227,7 +227,19 @@
 </template>
 
 <script>
-export default {};
+import { reactive,ref } from "vue";
+export default {
+  setup(){
+    
+    //返回
+    const goback = () => {
+      history.back();
+    };
+    return{
+      goback
+    }
+  }
+};
 </script>
 
 <style lang="less">