提交

src/api/authorization.js

@@ -0,0 +1,21 @@
+import ajax from "@/utils/request.js";
+
+// export function getBannerAndVideo(data) {
+//   return ajax({
+//     url: "https://cxzx.smcic.net/operate/worldCup.json?" + Date.now(),
+//     method: "get",
+//     urlType: "default",
+//     data,
+//   });
+// }
+
+// 登录idass
+export function loginIdass(data) {
+  return ajax({
+    url: "v1/capcut/login",
+    method: "POST",
+    urlType: "authorization",
+    next: true,
+    data,
+  });
+}

src/config/index.js

@@ -2,6 +2,7 @@ export default {
   base: {
     ajax: "https://topic.smcic.net/operate/world-cup/",
 	slikRoad: "https://topic.smcic.net/operate/",
+    authorization: "https://bytedance.sxtvs.net/",
     default: ""
   },
 };

src/utils/request.js

@@ -67,7 +67,7 @@ export default function (ori) {
         console.error(err);
         reject(err);
       }
-      if (data.code === 0) resolve(data.data);
+      if (data.code === 0 || ori.next) resolve(data.data);
       else reject(data);
     };
   });

src/view/authorization/index.vue

@@ -24,34 +24,75 @@
     </div>
     <div class="rightCol">
       <div class="model">
-        <el-form :model="form" label-width="120px">
-          <el-form-item>
-            <el-input v-model="form.name" placeholder="请输入用户名"/>
+        <div class="header">账号登录</div>
+        <el-form ref="formRef" size="large" :model="form" label-width="0">
+          <el-form-item
+            prop="name"
+            :rules="[{ required: true, message: '请输入用户名' }]"
+          >
+            <el-input v-model="form.name" placeholder="请输入用户名" />
+          </el-form-item>
+          <el-form-item
+            prop="pwd"
+            :rules="[{ required: true, message: '请输入密码' }]"
+          >
+            <el-input
+              v-model="form.pwd"
+              show-password
+              placeholder="请输入密码"
+              type="password"
+            />
           </el-form-item>
         </el-form>
+        <el-form-item>
+          <el-button
+            size="large"
+            style="width: 100%; display: block"
+            @click="submitForm(formRef)"
+            type="primary"
+            >登 录</el-button
+          >
+        </el-form-item>
       </div>
     </div>
   </div>
 </template>
 <script setup>
-import { onMounted, reactive } from "vue";
-// import { form as el, ElCarousel } from "element-plus";
-// import "element-plus/theme-chalk/base.css";
-// import "element-plus/theme-chalk/el-carousel.css";
-// import "element-plus/theme-chalk/el-carousel-item.css";
+import { onMounted, reactive, ref } from "vue";
+import { ElForm, ElFormItem, ElInput, ElButton } from "element-plus";
+import "element-plus/theme-chalk/base.css";
+import "element-plus/theme-chalk/el-form.css";
+import "element-plus/theme-chalk/el-form-item.css";
+import "element-plus/theme-chalk/el-input.css";
+import "element-plus/theme-chalk/el-button.css";
+import { loginIdass } from "@/api/authorization.js";
 // import { isIpad, isIpod, isIphone } from "../../utils/isTerminal";
 /**
  * window.$originData.orginParames.title 页面标题
  * window.$originData.orginParames.parameters 固定参数值
  * window.$originData.urlParames url参数
  */
+const formRef = ref();
 console.log(window.$originData);
 const form = reactive({
-    name: ""
-})
-onMounted(()=>{
-
-})
+  name: "",
+  pwd: "",
+});
+onMounted(() => {});
+const submitForm = formEl => {
+  if (!formEl) return;
+  formEl.validate(valid => {
+    if (!valid) return false;
+    console.log("submit!", form);
+    loginIdass({
+      username: form.name,
+      password: form.pwd,
+    }).then(res => {
+      console.log(res);
+      location.href = res.url || "";
+    });
+  });
+};
 </script>
 <style lang="scss">
 .authorization {
@@ -70,7 +111,7 @@ onMounted(()=>{
     vertical-align: top;
   }
   .leftCol {
-    width: 70vw;
+    width: 60vw;
     background-color: #dde3f3;
     header {
       width: 100%;
@@ -99,7 +140,7 @@ onMounted(()=>{
       text-align: center;
       position: relative;
       .content {
-        width: 420px;
+        max-width: 420px;
         position: relative;
         top: 50%;
         left: 50%;
@@ -119,13 +160,22 @@ onMounted(()=>{
     }
   }
   .rightCol {
-    width: 30vw;
+    width: 40vw;
     position: relative;
     .model {
+      padding: 0 3em;
+      width: 100%;
+      max-width: 720px;
       position: absolute;
       top: 50%;
       left: 50%;
       transform: translate(-50%, -50%);
+      .header {
+        font-size: 18px;
+        font-weight: 600;
+        height: 2em;
+        line-height: 2em
+      }
     }
   }
 }