src/views/news/index.vue

@@ -47,17 +47,15 @@
                     </template>
                 </el-table-column>
             </el-table>
-            <div class="user-pagination">
+            <el-pagination
-                <el-pagination
+                background
-                    background
+                layout="prev, pager, next"
-                    layout="total, sizes, prev, pager, next, jumper"
+                :total="total"
-                    :total="total"
+                :page-size="query.page_size"
-                    :page-size="query.page_size"
+                :current-page="query.page"
-                    :current-page="query.page"
+                @size-change="handleSizeChange"
-                    @size-change="handleSizeChange"
+                @current-change="handleCurrentChange"
-                    @current-change="handleCurrentChange"
+            />
-                />
-            </div>
         </div>
     </div>
 </template>
@@ -119,38 +117,27 @@ const query = ref({
     start_time: '',
     end_time: '',
 })
-const handleReset = () => {
+
-    dateTime.value = []
-    query.value = {
-        username: '',
-        mobile: '',
-        operative_date: '',
-        next_follow_date: '',
-        risk_type: '',
-        page: 1,
-        page_size: 20
-    }
-    getNews()
-}
 const total = ref(0)
 const getNews = () => {
     news(query.value).then(res => {
+        console.log(res)
         tableData.value = res.list
         total.value = res.total
     })
 }
 const handleSearch = () => {
-    query.value.page = 1
+    query.page = 1
     getNews()
 }
 
 const handleSizeChange = (e) => {
-    query.value.page_size = e
+    query.page_size = e
-    query.value.page = 1
+    query.page = 1
     getNews()
 }
 const handleCurrentChange = (e) => {
-    query.value.page = e
+    query.page = e
     getNews()
 }
 onMounted(() => {
@@ -173,10 +160,4 @@ onMounted(() => {
     .el-link+ .el-link {
         margin-left: 10px;
     }
-    .user-pagination {
-        margin-top: 20px;
-        text-align: right;
-        display: flex;
-        justify-content: right;
-    }
 </style>

src/views/user/index.vue

@@ -1,37 +1,29 @@
 <template>
     <div>
         <div class="user-search">
-            <el-input style="width: 150px;" v-model="query.username" placeholder="请输入患者姓名" />
+            <el-input style="width: 150px;margin-right: 10px;" v-model="query.username" placeholder="请输入患者姓名" />
-            <el-input style="width: 150px;" v-model="query.mobile" placeholder="请输入账号" />
+            <el-input style="width: 150px;margin-right: 10px;" v-model="query.mobile" placeholder="请输入账号" />
+            <!-- 选择胆道闭锁时间 -->
+            <el-date-picker
+                v-model="query.operative_date"
+                type="date"
+                placeholder="选择胆道闭锁时间"
+                style="width: 180px;"
+                value-format="YYYY-MM-DD"
+            />
             <!-- 请选择当前风险 -->
-            <el-select v-model="query.risk_type" placeholder="请选择当前风险" style="width: 150px;">
+            <el-select v-model="query.risk_type" placeholder="请选择当前风险" style="width: 150px;margin-right: 10px;margin-left: 10px;">
                 <el-option label="高风险" value="3" />
                 <el-option label="中风险" value="2" />
                 <el-option label="低风险" value="1" />
             </el-select>
-            <!-- 选择胆道闭锁时间 -->
             <el-date-picker
-                v-model="operative_date"
+                v-model="query.next_follow_date"
-                type="daterange"
+                type="date"
-                range-separator="-"
+                placeholder="选择下次随访时间"
-                start-placeholder="手术开始日期"
+                style="margin-right: 10px;width: 180px;"
-                end-placeholder="结束日期"
                 value-format="YYYY-MM-DD"
-                @change="changeOperative"
-                style="margin-right: 10px;margin-bottom: 20px;"
             />
-            <el-date-picker
-                v-model="next_follow_date"
-                type="daterange"
-                range-separator="-"
-                start-placeholder="下次随访开始日期"
-                end-placeholder="结束日期"
-                value-format="YYYY-MM-DD"
-                @change="changeNextFollow"
-                 style="margin-right: 10px;margin-bottom: 20px;"
-            />
-            
-            
             <el-button type="primary" icon="Search" @click="handleSearch">搜索</el-button>
             <el-button icon="Refresh" @click="handleReset">重置</el-button>
             
@@ -40,7 +32,7 @@
             <el-button type="primary" @click="handleExport">导出</el-button>
         </div>
         <div class="user-table">
-            <el-table :data="tableData" style="width: 100%" max-height="calc(100vh - 240px)">
+            <el-table :data="tableData" style="width: 100%">
                 <el-table-column prop="username" label="姓名" />
                 <el-table-column label="性别">
                     <template #default="scope">
@@ -83,17 +75,15 @@
                     </template>
                 </el-table-column>
             </el-table>
-            <div class="user-pagination">
+            <el-pagination
-                <el-pagination
+                background
-                    background
+                layout="prev, pager, next"
-                    layout="total, sizes, prev, pager, next, jumper"
+                :total="total"
-                    :total="total"
+                :page-size="query.page_size"
-                    :page-size="query.page_size"
+                :current-page="query.page"
-                    :current-page="query.page"
+                @size-change="handleSizeChange"
-                    @size-change="handleSizeChange"
+                @current-change="handleCurrentChange"
-                    @current-change="handleCurrentChange"
+            />
-                />
-            </div>
         </div>
     </div>
 </template>
@@ -120,45 +110,17 @@ const handleCheck = (row) => {
         }
     })
 }
-const operative_date = ref([])
+
-const next_follow_date = ref([])
 const query = ref({
     username: '',
     mobile: '',
-    operative_date_start: '',
+    operative_date: '',
-    operative_date_end: '',
+    next_follow_date: '',
-    next_follow_date_start: '',
-    next_follow_date_end: '',
     risk_type: '',
     page: 1,
     page_size: 20
 })
 const total = ref(0)
-
-const changeOperative = (val) => {
-    if (!val) {
-        query.value.operative_date_start = ''
-        query.value.operative_date_end = ''
-    } else {
-        query.value.operative_date_start = val[0]
-        query.value.operative_date_end = val[1]
-    }
-    
-    query.value.page = 1
-    getList()
-}
-const changeNextFollow = (val) => { 
-    if (!val) {
-        query.value.next_follow_date_start = ''
-        query.value.next_follow_date_end = ''
-    } else {
-        query.value.next_follow_date_start = val[0]
-        query.value.next_follow_date_end = val[1]
-    }
-    query.value.page = 1
-    getList()
-   
-}
 const getList = () => {
     users(query.value).then(res => {
         total.value = res.total
@@ -169,15 +131,11 @@ const handleSearch = () => {
     getList()
 }
 const handleReset = () => {
-    operative_date.value = []
-    next_follow_date.value = []
     query.value = {
         username: '',
         mobile: '',
-        operative_date_start: '',
+        operative_date: '',
-        operative_date_end: '',
+        next_follow_date: '',
-        next_follow_date_start: '',
-        next_follow_date_end: '',
         risk_type: '',
         page: 1,
         page_size: 20
@@ -201,12 +159,12 @@ const handleExport = () => {
     })
 }
 const handleSizeChange = (e) => {
-    query.value.page_size = e
+    query.page_size = e
-    query.value.page = 1
+    query.page = 1
     getList()
 }
 const handleCurrentChange = (e) => {
-    query.value.page = e
+    query.page = e
     getList()
 }
 onMounted(() => {
@@ -216,26 +174,6 @@ onMounted(() => {
 
 <style scoped>
 .user-search {
-    }
+        margin-bottom: 10px;
-    .user-pagination {
-        margin-top: 20px;
-        text-align: right;
-        display: flex;
-        justify-content: right;
-    }
-    .el-input{
-        margin-bottom: 20px;
-        margin-right: 10px;
-    }
-    .el-select{
-        margin-bottom: 20px;
-        margin-right: 10px;
-    }
-    .el-range-editor.el-input__wrapper{
-        margin-bottom: 20px;
-        margin-right: 10px;
-    }
-    .el-button{
-        margin-bottom: 20px;
     }
 </style>

src/views/user/userDetail.vue

@@ -35,7 +35,7 @@
             <el-descriptions-item label="产次：">{{ userInfo.birth_number }} </el-descriptions-item>
             <el-descriptions-item label="受孕方式：">
                 <el-tag v-if="userInfo.conception_type == 0" type="info">未知</el-tag>
-                <el-tag v-if="userInfo.conception_type == 1" type="success">自然受孕</el-tag>
+                <el-tag v-if="userInfo.conception_type == 1" type="success">自认受孕</el-tag>
                 <el-tag v-if="userInfo.conception_type == 2" type="warning">辅助生殖技术</el-tag>
             
             </el-descriptions-item>