22

src/api/flashPower.js

@@ -0,0 +1,21 @@
+import request from "@/utils/request"
+// 获取变电站
+function getAllFlashPower(data) {
+    return request({
+        url: `/basic_area/list`,
+        method: "get",
+        params: data
+    })
+}
+//获取区域
+function getAllArea(data) {
+    return request({
+        url: `/area/tree`,
+        method: "get",
+        params: data
+    })
+}
+export default {
+    getAllFlashPower,
+    getAllArea,
+}

src/api/task.js

@@ -0,0 +1,12 @@
+import request from '@/utils/request'
+// 获取检测任务
+function getTask(data) {
+    return request({
+        url: `/task/list`,
+        method: "get",
+        params: data
+    })
+}
+export default {
+    getTask,
+}

src/pages/login/LoginNow.vue

@@ -17,7 +17,7 @@
                         <el-input class="loginInp" v-model="loginForm.username" placeholder="你的账号..." />
                     </el-form-item>
                     <el-form-item label="密码">
-                        <el-input class="loginInp" v-model="loginForm.userpass" placeholder="你的密码..." />
+                        <el-input class="loginInp" v-model="loginForm.userpass" type="password" show-password placeholder="你的密码..." />
                     </el-form-item>
                 </el-form>
                 <el-button class="loginBtn" type="primary" @click="sureLog">登录</el-button>
@@ -59,23 +59,28 @@ export default {
         }
         function sureLog() {
             let kis = encryptPassword(loginForm.value.userpass)
-            isLogin.value = true
-            localStorage.setItem("loginStatus",isLogin.value)
-            // login.LoginNow({
-            //     login_account: loginForm.value.username,
-            //     pwd: kis
-            // }).then(res => {
-            //     console.log(res, 'login');
-            //     if (res.returncode === 200) {
-            //         router.push('/home')
-            //     } else {
-            //         ElMessage({
-            //             message: res.msg,
-            //             type: "error"
-            //         })
-            //     }
-            // })
-            router.push('/home/mission')
+
+            login.LoginNow({
+                login_account: loginForm.value.username,
+                pwd: kis
+            }).then(res => {
+                console.log(res, 'login');
+                if (res.returncode === 200) {
+                    isLogin.value = true
+                    localStorage.setItem("loginStatus", isLogin.value)
+                    localStorage.setItem("userInfo",JSON.stringify(res.data))
+                    router.push('/home/mission')
+                    ElMessage({
+                        message: '登陆成功！',
+                        type: "success"
+                    })
+                } else {
+                    ElMessage({
+                        message: res.msg,
+                        type: "error"
+                    })
+                }
+            })
             // windowEx.Size(1920,1040)
         }
         onMounted(() => {
@@ -149,6 +154,7 @@ export default {
 .winBtn:nth-child(1):hover {
     border: 1px black solid;
 }
+
 .winBtn:nth-child(2):hover {
     background-color: red;
 }

src/pages/mission/MissionVue.vue

@@ -11,55 +11,11 @@
             <!-- 功能盒子 -->
             <div class="settingBox">
                 <!-- 无检测任务时显示的盒子 -->
-                <div class="noMisBox" v-if="btnSelect == 0">
-                    <img style="width: 220px;height: 220px;" src="../../assets/image/create.png" alt="">
-                    <p style="text-align: center;width: 240px;">当前没有需要检测的任务</p>
-                    <p class="createMisp" @click="createMis">
-                        <img style="width: 20px;height: 20px;" src="../../assets/icon/create_btn.png" alt="">
-                        <span>点击创建任务</span>
-                    </p>
-                </div>
+                <NoBox v-if="btnSelect == 0 && taskList.length == 0" :btnSelect="btnSelect" :taskList="taskList"
+                    @backToMission="backToMission"></NoBox>
                 <!-- 新建任务盒子 -->
-                <div class="createMisBox" v-if="btnSelect == 1">
-                    <div>
-                        <p>新建任务</p>
-                    </div>
-                    <div class="formBox">
-                        <el-form :inline="true" label-position="top" :model="newMission" class="demo-form-inline"
-                            style="width: 1200px;margin: 0 auto;" label-width="520px">
-                            <el-form-item label="检测任务名称">
-                                <el-input class="bestInput" v-model="newMission.misName" placeholder="Approved by"
-                                    clearable />
-                            </el-form-item>
-                            <el-form-item label="任务编号">
-                                <el-input class="bestInput" v-model="newMission.misNum" placeholder="Approved by"
-                                    clearable />
-                            </el-form-item>
-                            <el-form-item label="检测变电站">
-                                <el-select style="width: 512px;" v-model="newMission.flashId" placeholder="Activity zone"
-                                    clearable>
-                                    <el-option label="Zone one" value="shanghai" />
-                                    <el-option label="Zone two" value="beijing" />
-                                </el-select>
-                                <img style="width: 40px;height: 40px;" src="../../assets/icon/create_misBtn.png" alt="">
-                            </el-form-item>
-                            <el-form-item label="报告模板">
-                                <el-select class="bestInput" v-model="newMission.reportNow" placeholder="Activity zone"
-                                    clearable>
-                                    <el-option label="Zone one" value="shanghai" />
-                                    <el-option label="Zone two" value="beijing" />
-                                </el-select>
-                            </el-form-item>
-                            <el-form-item label="任务说明">
-                                <el-input style="width: 1136px;" v-model="newMission.misMes"></el-input>
-                            </el-form-item>
-                            <el-form-item label="SCD文件">
-                                <el-button style="width: 954px;">点击选择scd文件</el-button>
-                                <span>正在干嘛干嘛</span>
-                            </el-form-item>
-                        </el-form>
-                    </div>
-                </div>
+                <CreateNew v-if="btnSelect == 1" :btnSelect="btnSelect" :taskList="taskList"></CreateNew>
+          
             </div>
         </div>
     </div>
@@ -67,6 +23,9 @@
 
 <script>
 import { ref, onMounted } from 'vue';
+import NoBox from './components/NoMisBox'
+import CreateNew from './components/CreateMis'
+import task from '@/api/task';
 export default {
     setup() {
         let btnList = ref([
@@ -83,29 +42,40 @@ export default {
                 value: "3"
             }
         ])//按钮列表
-        let newMission = ref({
-            misName: "",
-            misNum: "",
-            flashId: "",
-            reportNow: "",
-            misMes: "",
-            scdFolder: "",
-
-        })
-        let btnSelect = ref(0)
+        let taskList = ref([])//任务表单
+        let btnSelect = ref(0)//选择的菜单
+        function searchAllTask() {
+            task.getTask({}).then(res => {
+                if (res.data) {
+                    taskList.value = res.data
+                }
+            })
+        }
         function misChange(row, num) {
             btnSelect.value = num
         }
         function createMis() {
             btnSelect.value = 1
         }
+        function backToMission(data) {
+            btnSelect.value = data
+        }
+        onMounted(() => {
+            searchAllTask()
+        })
         return {
             btnList,//按钮列表
             btnSelect,//按钮切换class
             misChange,//按钮切换点击事件
-            newMission,//创建时提交的表单
             createMis,//点击创建新任务
+            searchAllTask,//获取所有检测任务
+            taskList,//选择的菜单
+            backToMission,//返回的菜单数据
         }
+    },
+    components: {
+        NoBox,
+        CreateNew,
     }
 }
 </script>
@@ -114,14 +84,14 @@ export default {
 .bigBox {
     width: 99%;
     height: calc(100vh - 100px);
-    border: 1px solid salmon;
+    /* border: 1px solid salmon; */
     /* overflow: hidden; */
 }
 
 .btnBox {
     width: 99%;
     height: 50px;
-    border: 1px solid rebeccapurple;
+    /* border: 1px solid rebeccapurple; */
 }
 
 .settingBox {
@@ -177,24 +147,11 @@ export default {
     cursor: pointer;
 }
 
-.createMisBox {
-    width: 100%;
-    height: calc(100vh - 150px);
-    text-align: center;
-    margin-top: 20px;
-    /* line-height: calc(100vh - 150px); */
-}
-
-.formBox {
-    width: 1136px;
-    height: 339px;
-    margin: 0 auto;
-    border-bottom: 1px dashed #dbdbdb;
-}
 
 .bestInput {
     width: 550px;
     height: 40px;
     border-radius: 2px 2px 2px 2px;
 }
+
 </style>

src/pages/mission/components/CreateMis.vue

@@ -0,0 +1,167 @@
+<template>
+    <div>
+        <div class="createMisBox" v-if="selects == 1">
+            <div>
+                <p>新建检测任务</p>
+            </div>
+            <div class="formBox">
+                <el-form :inline="true" label-position="top" :model="newMission" class="demo-form-inline"
+                    style="width: 1200px;margin: 0 auto;" :rules="missionRules" require-asterisk-position="right"
+                    label-width="500px">
+                    <el-form-item label="检测任务名称" prop="misName">
+                        <el-input class="bestInput" v-model="newMission.misName" placeholder="Approved by" clearable />
+                    </el-form-item>
+                    <el-form-item label="任务编号" prop="misNum">
+                        <el-input class="bestInput" v-model="newMission.misNum" placeholder="Approved by" clearable />
+                    </el-form-item>
+                    <el-form-item label="检测变电站" prop="flashId">
+                        <el-select style="width: 512px;" v-model="newMission.flashId" placeholder="Activity zone" clearable>
+                            <el-option label="Zone one" value="shanghai" />
+                            <el-option label="Zone two" value="beijing" />
+                        </el-select>
+                        <img style="width: 40px;height: 40px;" src="../../../assets/icon/create_misBtn.png" alt="">
+                    </el-form-item>
+                    <el-form-item label="报告模板" prop="reportNow">
+                        <el-select class="bestInput" v-model="newMission.reportNow" placeholder="Activity zone" clearable>
+                            <el-option label="Zone one" value="shanghai" />
+                            <el-option label="Zone two" value="beijing" />
+                        </el-select>
+                    </el-form-item>
+                    <el-form-item label="任务说明" prop="misMes">
+                        <el-input style="width: 1136px;" v-model="newMission.misMes"></el-input>
+                    </el-form-item>
+                    <el-form-item label="SCD文件">
+                        <el-button style="width: 954px;">点击选择scd文件</el-button>
+                        <span>正在干嘛干嘛</span>
+                    </el-form-item>
+                </el-form>
+            </div>
+            <!-- 间隔、装置列表 -->
+            <div class="gapAndUnit">
+                <!-- 间隔列表 -->
+                <div class="gapBox">
+
+                </div>
+                <!-- 装置列表 -->
+                <div class="unitBox">
+
+                </div>
+            </div>
+            <div>
+                <el-button>返回</el-button>
+                <el-button>保存</el-button>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import { ref, onMounted, reactive } from 'vue';
+import flashPower from '../../../api/flashPower'
+export default {
+    props: {
+        btnSelect: {
+            type: Number,
+            require: true
+        },
+        taskList: {
+            type: Array,
+            require: true
+        }
+    },
+    setup(props, { emit }) {
+        let selects = props.btnSelect
+        let arrList = props.taskList
+        let newMission = ref({
+            misName: "",
+            misNum: "",
+            flashId: "",
+            reportNow: "",
+            misMes: "",
+            scdFolder: "",
+        })//创建任务提交表单
+        let missionRules = ref({
+            misName: [
+                { required: true, message: '请输入名称', trigger: 'blur' },
+            ],
+            // misNum:[
+            //     {required:true,message:""}
+            // ]
+            flashId: [
+                { required: true, message: "请选择变电站", trigger: "change" }
+            ],
+            reportNow: [
+                { required: true, message: "请选择模板", trigger: "change" }
+            ],
+            misMes: [
+                { required: true, message: "请输入说明", trigger: "blur" }
+            ]
+        })
+        function searchAllFlash() {
+            flashPower.getAllArea({}).then(res => {
+                console.log(res, 'area');
+                flashPower.getAllFlashPower({ pageindex: 1, pagesize: 10, pid: 0 }).then(res => {
+                    console.log(res, 'power');
+                })
+            })
+        }
+        onMounted(() => {
+            searchAllFlash()
+        })
+        return {
+            selects,
+            arrList,
+            newMission,
+            searchAllFlash,//获取变电站
+            missionRules,//表单验证
+        }
+    }
+}
+</script>
+
+<style scoped>
+.createMisBox {
+    width: 100%;
+    height: calc(100vh - 150px);
+    text-align: center;
+    margin-top: 20px;
+    /* line-height: calc(100vh - 150px); */
+}
+
+.formBox {
+    width: 1136px;
+    height: 339px;
+    margin: 0 auto;
+    border-bottom: 1px dashed #dbdbdb;
+}
+
+.bestInput {
+    width: 550px;
+    height: 40px;
+    border-radius: 2px 2px 2px 2px;
+}
+
+.gapAndUnit {
+    width: 1136px;
+    height: 150px;
+    /* border: 1px solid black; */
+    margin: 5px auto;
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+}
+
+.gapBox {
+    width: 288px;
+    height: 142px;
+    overflow-y: auto;
+    border: 1px solid #5779D7;
+}
+
+.unitBox {
+    width: 832px;
+    height: 142px;
+    overflow-y: auto;
+    border: 1px solid #5779D7;
+}
+</style>

src/pages/mission/components/NoMisBox.vue

@@ -0,0 +1,52 @@
+<template>
+    <div>
+        <div class="noMisBox" v-if="selects == 0 && arrList.length == 0">
+            <img style="width: 220px;height: 220px;" src="../../../assets/image/create.png" alt="">
+            <p style="text-align: center;width: 240px;">当前没有需要检测的任务</p>
+            <p class="createMisp" @click="createMis">
+                <img style="width: 20px;height: 20px;" src="../../../assets/icon/create_btn.png" alt="">
+                <span>点击创建任务</span>
+            </p>
+        </div>
+    </div>
+</template>
+
+<script>
+import { ref, onMounted } from 'vue';
+export default {
+    props: {
+        btnSelect: {
+            type: Number,
+            require: true
+        },
+        taskList: {
+            type: Array,
+            require: true
+        }
+    },
+    setup(props, { emit }) {
+        let selects = props.btnSelect
+        let arrList = props.taskList
+        function createMis() {
+            selects = 1
+            emit("backToMission", selects)
+        }
+
+        return {
+            createMis,
+            selects,
+            arrList,
+        }
+    }
+}
+</script>
+
+<style scoped>
+.noMisBox {
+    width: 200px;
+    height: 200px;
+    margin: 80px auto;
+    text-align: center;
+    line-height: 20px;
+}
+</style>

src/utils/request.js

@@ -76,7 +76,7 @@ service.interceptors.response.use(
                 message: "登陆已过期，请重新登录",
                 type: "error"
             })
-            router.push("login")
+            router.push("/login")
             localStorage.removeItem('userInfo')
             localStorage.removeItem('userToken')
         }