From 5ffbec0a33a49c698699646ab71ddb3ad1ea310c Mon Sep 17 00:00:00 2001
From: charles <981744753@qq.com>
Date: 星期二, 21 五月 2024 17:10:03 +0800
Subject: [PATCH] fix:增加一个登录功能

---
 src/views/home/components/textManager/index.vue |  112 ++++++++++++++++++++++++++++++++++++++++++-------------
 1 files changed, 85 insertions(+), 27 deletions(-)

diff --git a/src/views/home/components/textManager/index.vue b/src/views/home/components/textManager/index.vue
index 5eab2bc..2ab05f5 100644
--- a/src/views/home/components/textManager/index.vue
+++ b/src/views/home/components/textManager/index.vue
@@ -1,21 +1,54 @@
 <template>
     <div>
-        <div class="search">
-            <el-form :inline="true" class="demo-form-inline">
-                <el-form-item label="鏂囧瓧鍐呭/杞﹀彿锛�">
-                    <el-input v-model="keyword" size="small" placeholder="璇疯緭鍏�"></el-input>
+        <!--娣诲姞鐨勬ā鎬佹-->
+        <el-dialog
+                title="娣诲姞"
+                :visible.sync="addModal"
+                width="40%"
+                :close-on-click-modal="false"
+                @close="addModal=false"
+                :destroy-on-close="true"
+                >
+            <el-form  ref="textForm" class="demo-form-inline" label-width="120px" :model="textObj" :rules="textRules">
+                <el-form-item label="鏂囧瓧鍐呭锛�" prop="content">
+                    <el-input v-model="textObj.content" placeholder="璇疯緭鍏ユ枃瀛楀唴瀹�"/>
                 </el-form-item>
-                <el-form-item>
-                    <el-button  @click="searchCar" size="mini" type="primary" style="border:none;background-color: rgba(24, 144, 255, 1)">鏌ヨ</el-button>
+                <el-form-item label="杞﹀彿锛�">
+                    <el-input v-model="textObj.locomotiveNumber" placeholder="璇疯緭鍏ヨ溅鍙�"/>
                 </el-form-item>
             </el-form>
+            <span slot="footer" class="dialog-footer">
+                <el-button @click="addModal = false">鍙� 娑�</el-button>
+                <el-button type="primary" @click="addText">纭� 瀹�</el-button>
+            </span>
+        </el-dialog>
+        <div class="search">
+            <el-row type="flex" justify="center">
+                <el-col :span="18">
+                    <el-form :inline="true" class="demo-form-inline">
+                        <el-form-item label="鏂囧瓧鍐呭/杞﹀彿锛�">
+                            <el-input v-model="keyword" size="small" placeholder="璇疯緭鍏�"></el-input>
+                        </el-form-item>
+                        <el-form-item>
+                            <el-button  @click="searchCar" size="mini" type="primary" style="border:none;background-color: rgba(24, 144, 255, 1)">鏌ヨ</el-button>
+                        </el-form-item>
+                    </el-form>
+                </el-col>
+                <el-col :span="6" style="text-align: right">
+                    <el-button  size="mini" @click="addModal=true" type="primary" style="border:none;background-color: rgba(24, 144, 255, 1)">娣诲姞</el-button>
+                </el-col>
+            </el-row>
         </div>
         <div>
             <el-table :data="pageInfo.textList" >
-                <el-table-column prop="id" label="搴忓彿" align="center" />
-                <el-table-column prop="textContent" label="鏂囧瓧鍐呭" align="center" />
-                <el-table-column prop="cid" label="杞﹀彿" align="center" />
-                <el-table-column prop="date" label="娣诲姞鏃堕棿" align="center"  />
+                <el-table-column prop="ID" label="搴忓彿" align="center" />
+                <el-table-column prop="content" label="鏂囧瓧鍐呭" align="center" />
+                <el-table-column prop="locomotiveNumber" label="杞﹀彿" align="center" />
+                <el-table-column prop="CreatedAt" label="娣诲姞鏃堕棿" align="center" >
+                    <template slot-scope="scope">
+                        {{$moment(scope.row.CreatedAt).format('YYYY-MM-DD HH:mm:ss')}}
+                    </template>
+                </el-table-column>
             </el-table>
             <div class="pagination">
                 <div class="total">鍏辫{{pageInfo.total}}鏉¤褰� 绗瑊{pageData.page}}/{{lastPage}}椤�</div>
@@ -36,11 +69,19 @@
 </template>
 
 <script>
+    import { getTextListApi,addTextApi} from '@/api';
     export default {
         name: "textManager",
         data(){
             return{
+                textRules:{
+                    content: [
+                        { required: true, message: '鍐呭涓嶈兘涓虹┖', trigger: 'blur' },
+                    ],
+                },
+                addModal:false,
                 keyword:'',
+                textObj:{content:'',locomotiveNumber:''},
                 pageInfo:{
                   total:100,
                   textList:[]
@@ -53,31 +94,48 @@
               return Math.ceil(this.pageInfo.total/this.pageData.pageSize)
           }
         },
+        watch:{
+          pageData:{
+              handler(){
+                  this.searchCar();
+              },
+              deep:true,
+              immediate:true
+          }
+        },
         methods:{
-            searchCar(){
-                //鎼滅储
-                this.pageInfo.textList=[
-                    {id:1, textContent: '鐏溅鍚姩', cid: 'k12', date: '2016-05-02'},
-                    {id:2, textContent: '鐏溅鍚姩', cid: 'k12', date: '2016-05-02'},
-                    {id:3, textContent: '鐏溅鍚姩', cid: 'k12', date: '2016-05-02'},
-                    {id:4, textContent: '鐏溅鍚姩', cid: 'k12', date: '2016-05-02'},
-                    {id:5, textContent: '鐏溅鍚姩', cid: 'k12', date: '2016-05-02'},
-                    {id:6, textContent: '鐏溅鍚姩', cid: 'k12', date: '2016-05-02'},
-                    {id:7, textContent: '鐏溅鍚姩', cid: 'k12', date: '2016-05-02'},
-                    {id:8, textContent: '鐏溅鍚姩', cid: 'k12', date: '2016-05-02'},
-                    {id:9, textContent: '鐏溅鍚姩', cid: 'k12', date: '2016-05-02'},
-                    {id:10, textContent: '鐏溅鍚姩', cid: 'k12', date: '2016-05-02'}
-                ];
+            async searchCar(){
+                const {code,data,total}=await getTextListApi({keyword:this.keyword,...this.pageData});
+                if(code===200){
+                    this.pageInfo.textList=data;
+                    this.pageInfo.total=total;
+                }
             },
             handleSizeChange(pageSize){
                 this.pageData.pageSize=pageSize;
             },
             handleCurrentChange(page){
                 this.pageData.page=page;
+            },
+            resetFormData(){
+              this.addModal=false;
+              this.textObj={content:'',locomotiveNumber:''}
+            },
+            addText(){
+                this.$refs.textForm.validate((valid) => {
+                    if(valid){
+                        addTextApi(this.textObj).then(({code})=>{
+                            if(code===200){
+                                this.$message.success('娣诲姞鎴愬姛');
+                                this.resetFormData();
+                                this.searchCar();
+                            }else{
+                                this.$message.warning('娣诲姞澶辫触')
+                            }
+                        });
+                    }
+                })
             }
-        },
-        mounted(){
-            this.searchCar();
         }
     }
 </script>

--
Gitblit v1.8.0