feat 彩虹图修改

src/api/xjc-integratedmachine/wakeup/rainbow.js

@@ -64,3 +64,12 @@ export function finish(data) {
     data : data
   })
 }
+
+export function sendRainbowMail(data) {
+  console.log("dddd",data)
+  return request({
+    url: '/integratedmachine/wakeup/rainbow/sendMail',
+    method: 'post',
+    data : data
+  })
+}

src/layout/index.vue

@@ -1,41 +1,42 @@
 <template>
     <div class="main home-login-page">
         <div class="page-left">
-          <div class="page-left-style"></div>
-          <div class="page-left-text">数字化生涯学习一体机</div>
-          <div class="page-left-text-box">
-            <p>数字资源智能交互</p>
-            <p>唤醒学生生涯意识</p>
-            <p>一体融合深入互动</p>
-            <p>认知自我明晰路径</p>
-            <p>体验平台加强探索</p>
-            <p>助力学业稳步成功</p>
-            <p>全程辅导精准决策</p>
-            <p>规划行动促进成长</p>
-          </div>
+            <div class="page-left-style"></div>
+            <div class="page-left-text">数字化生涯学习一体机</div>
+            <div class="page-left-text-box">
+                <p>数字资源智能交互</p>
+                <p>唤醒学生生涯意识</p>
+                <p>一体融合深入互动</p>
+                <p>认知自我明晰路径</p>
+                <p>体验平台加强探索</p>
+                <p>助力学业稳步成功</p>
+                <p>全程辅导精准决策</p>
+                <p>规划行动促进成长</p>
+            </div>
         </div>
         <div class="page-right">
-          <div class="img-box">
-            <img src="@/assets/images/login/wakeup.png" @click="indexJump('/xjc-integratedmachine/wakeup/index')">
-          </div>
-          <div class="img-box">
-            <img src="@/assets/images/login/cognize.png" @click="indexJump('/xjc-integratedmachine/cognize/index')">
-          </div>
-          <div class="img-box">
-            <img src="@/assets/images/login/environment.png" @click="indexJump('/xjc-integratedmachine/environment/index')">
-          </div>
-          <div class="img-box">
-            <img src="@/assets/images/login/decision.png" @click="indexJump('/xjc-integratedmachine/decision/index')">
-          </div>
-          <div class="img-box">
-            <img src="@/assets/images/login/plan.png"  @click="indexJump('/xjc-integratedmachine/plan/index')">
-          </div>
+            <div class="img-box">
+                <img src="@/assets/images/login/wakeup.png" @click="indexJump('/xjc-integratedmachine/wakeup/index')">
+            </div>
+            <div class="img-box">
+                <img src="@/assets/images/login/cognize.png" @click="indexJump('/xjc-integratedmachine/cognize/index')">
+            </div>
+            <div class="img-box">
+                <img src="@/assets/images/login/environment.png"
+                     @click="indexJump('/xjc-integratedmachine/environment/index')">
+            </div>
+            <div class="img-box">
+                <img src="@/assets/images/login/decision.png"
+                     @click="indexJump('/xjc-integratedmachine/decision/index')">
+            </div>
+            <div class="img-box">
+                <img src="@/assets/images/login/plan.png" @click="indexJump('/xjc-integratedmachine/plan/index')">
+            </div>
         </div>
     </div>
 </template>
 
 <script setup>
-
     import {getBaseInfo} from '@/api/xjc-platform/xjc_index'
 
     const router = useRouter()
@@ -43,12 +44,15 @@
     function indexJump(path) {
 
         getBaseInfo().then(resp => {
+
+            localStorage.setItem("userBaseInfo", JSON.stringify(resp))
+
             if (resp.loginUser.userName == 'xjc_customer') {
                 //访客身份，直接去登录
                 router.push({
                     path: '/xjc-integratedmachine/login/login_index',
-                    query:{
-                        modulePath : path
+                    query: {
+                        modulePath: path
                     }
                 })
             } else {
@@ -62,78 +66,89 @@
 
 <style lang="scss" scoped>
 
-    body,html{
-      margin: 0;
-      padding: 0;
+    body, html {
+        margin: 0;
+        padding: 0;
     }
-    .home-login-page{
-      width: 1920px;
-      height: 1080px;
-      background: url('@/assets/images/login/login-home-background.png') no-repeat;
-      background-size: 100%;
-      display: flex;
-      .page-left{
-        background: url('@/assets/images/login/home-login-left-background.png') no-repeat;
-        background-size: 100%;
-        width: 483px;
+
+    .home-login-page {
+        width: 1920px;
         height: 1080px;
+        background: url('@/assets/images/login/login-home-background.png') no-repeat;
+        background-size: 100%;
         display: flex;
-        justify-items: center;
-        align-items: center;
-        position: relative;
-        .page-left-style{
-          width: 24px;
-          height: 596px;
-          background: rgba(61,92,255,0.3);
-          border-radius: 60px 60px 60px 60px;
-          margin-left: 29px;
-        }
-        .page-left-text{
-          font-weight: bold;
-          width: 48px;
-          font-size: 45px;
-          color: #060606;
-          letter-spacing: 4px;
-          text-align: left;
-          position: relative;
-          left: -15px;
-        }
-      }
-      .page-left-text-box{
-        margin-left: 30px;
-        p{
-          font-weight: 400;
-          font-size: 32px;
-          color: #333333;
-          letter-spacing: 3px;
-          margin: 0;
-          padding: 0;
-          line-height: 52px;
-        }
-      }
-      .page-right{
-        margin-left: 30px;
-        width: 70%;
-        display: flex;
-        justify-content:space-around;
-        align-items: center;
-        flex-wrap: wrap;
-        .img-box{
-          width: 330px;
-          height: 400px;
-          margin-left: 35px;
-          margin-right: 35px;
-          img{
-            width: 330px;
-            height: 400px;
-          }
+
+        .page-left {
+            background: url('@/assets/images/login/home-login-left-background.png') no-repeat;
+            background-size: 100%;
+            width: 483px;
+            height: 1080px;
+            display: flex;
+            justify-items: center;
+            align-items: center;
+            position: relative;
+
+            .page-left-style {
+                width: 24px;
+                height: 596px;
+                background: rgba(61, 92, 255, 0.3);
+                border-radius: 60px 60px 60px 60px;
+                margin-left: 29px;
+            }
+
+            .page-left-text {
+                font-weight: bold;
+                width: 48px;
+                font-size: 45px;
+                color: #060606;
+                letter-spacing: 4px;
+                text-align: left;
+                position: relative;
+                left: -15px;
+            }
         }
-        .img-box:nth-child(4){
-           margin-left: 210px;
+
+        .page-left-text-box {
+            margin-left: 30px;
+
+            p {
+                font-weight: 400;
+                font-size: 32px;
+                color: #333333;
+                letter-spacing: 3px;
+                margin: 0;
+                padding: 0;
+                line-height: 52px;
+            }
         }
-        .img-box:nth-child(5){
-          margin-right: 210px;
+
+        .page-right {
+            margin-left: 30px;
+            width: 70%;
+            display: flex;
+            justify-content: space-around;
+            align-items: center;
+            flex-wrap: wrap;
+
+            .img-box {
+                width: 330px;
+                height: 400px;
+                margin-left: 35px;
+                margin-right: 35px;
+
+                img {
+                    width: 330px;
+                    height: 400px;
+                }
+            }
+
+            .img-box:nth-child(4) {
+                margin-left: 210px;
+            }
+
+            .img-box:nth-child(5) {
+                margin-right: 210px;
+            }
         }
-      }
     }
 </style>

src/views/xjc-integratedmachine/wakeup/rainbow/index.vue

@@ -16,7 +16,7 @@
         <div class="rainbow_xpc_bg" @click="changePaintState"></div>
         <div class="rainbow_qk" @click="clear"></div>
         <div class="rainbow_hzwc" @click="finishRepaint('new')"></div>
-        <div class="rainbow_yx"></div>
+        <div class="rainbow_yx" @click="showMail"></div>
         <div class="rainbow_bc" @click="save(null)"></div>
 
         <div class="sf_zv"></div>
@@ -31,14 +31,25 @@
         <div class="sf_gzz_font">工作者身份</div>
         <div class="sf_cjz"></div>
         <div class="sf_cjz_font">持家身份</div>
+
+
+        <el-dialog v-model="mailForm.showFlag">
+            <p>
+                用户邮箱 ： <el-input v-model="mailForm.email"></el-input>
+            </p>
+            <p>
+                <el-button @click="sendMail">发送</el-button>
+                <el-button @click="closeMail">取消</el-button>
+            </p>
+        </el-dialog>
     </div>
 
 </template>
 
 <script setup>
     import headComponent from '@/views/xjc-integratedmachine/components/head_component.vue'
-    import {newRainbow, saveRainbow, finish} from '@/api/xjc-integratedmachine/wakeup/rainbow.js'
-
+    import {newRainbow, saveRainbow, finish,sendRainbowMail} from '@/api/xjc-integratedmachine/wakeup/rainbow.js'
+    import Cookies from "js-cookie"
     const loading = ref(true)
     const headinfo = ref({})
 
@@ -46,7 +57,6 @@
     import * as echarts from "echarts";
     import html2canvas from 'html2canvas';
     import {ElMessage} from 'element-plus'
-
     const backgroundImage = new Image();
     // backgroundImage.src = 'http://192.168.3.100/screenshot.png'; // 替换为你的背景图片路径
 
@@ -289,9 +299,9 @@
             calcPaintCircleFlag(17)
         }
         if (data.startAngle == 0) {
-            alert("起点角度记录不完整")
+            ElMessage.warning("起点角度记录不完整")
         } else if (data.angle == '') {
-            alert("起点轨道记录不完整")
+            ElMessage.warning("起点轨道记录不完整")
         } else {
             form.value.picData.push(data)
         }
@@ -690,7 +700,7 @@
                 const formData = new FormData();
                 formData.append('file', blob, 'screenshot.png');
                 await uploadFile('/file/upload', formData).then(resp => {
-                    form.value.picUrl = resp.url
+                    form.value.picUrl = resp.shortUrl
                     saveAllData(type)
                 })
             })
@@ -703,6 +713,7 @@
         loading.value = true
         newRainbow(rFrom).then(resp => {
             form.value.id = resp.id
+            form.value.picUrl = resp.picUrl
             if (resp.picData != null && resp.picData != '') {
                 form.value.picData = JSON.parse(resp.picData);
             } else {
@@ -802,6 +813,29 @@
         save(type)
     }
 
+    const mailForm = ref({
+        showFlag : false,
+        email : ''
+    })
+
+    function showMail(){
+        if(form.value.picUrl == null || form.value.picUrl == undefined || form.value.picUrl == ''){
+            ElMessage.warning("请向保存绘制后再发送邮件")
+        }else{
+            let userBaseInfo = localStorage.getItem("userBaseInfo")
+            mailForm.value.showFlag = true
+        }
+
+    }
+    function sendMail(){
+        sendRainbowMail(mailForm.value).then(res =>{
+
+        })
+    }
+    function closeMail(){
+        mailForm.value.showFlag = false
+    }
+
     onMounted(() => {
         init();
         changes();