需要学习async和await

main
RogerWork 11 months ago
parent 2f27556b61
commit d39e5d5e3b
  1. 9
      src/apis/update.js
  2. 5
      src/request/config.js
  3. 172
      src/request/index.js
  4. 90
      src/views/update/index.vue

@ -0,0 +1,9 @@
import request from "@/request/index.js";
export const cinema_list = () => {
// console.log('cinema_list')
return request({
url: '/update/cinema/',
method: 'get'
})
}

@ -1,8 +1,9 @@
export default {
method: 'get',
baseURL: 'http://localhost:8001',
baseURL: 'http://127.0.0.1:8000',
headers: {
'Content-Type': 'application/json;charset=UTF-8'
'Content-Type': 'application/json;charset=UTF-8',
'Authorization': 'token 4e63b8854974c1fdac9deb891fd74dc145b53f85'
},
timeout: 10000,
withCredentials: true,

@ -1,111 +1,73 @@
import axios from "axios";
import config from "@/request/config.js";
import router from "@/router";
import { ElMessage } from 'element-plus';
// import {ElMessage} from "element-plus";
// import {rejects} from "node:assert";
// import router from "@/router";
export default function request(options) {
return new Promise((resolve, reject) => {
const instance = axios.create({...config});
// 请求拦截器
instance.interceptors.request.use(
(config) => {
let token = localStorage.getItem('pm_token');
if (token) {
config.headers.token = token;
} else {
router.push('/update')
}
return config;
},
(error) => {
console.log("request:", error);
if (error.code === "ECONNABORTED" && error.message.indexOf("timeout") !== -1) {
ElMessage({message: "请求超时", type: "error", showClose: true});
}
return Promise.reject(error)
}
);
// 响应拦截器
instance.interceptors.response.use(
(response) => {
return response.data;
},
(err) => {
if (err && err.response) {
switch (err.response.status) {
case 400:
err.message = "请求错误";
break
case 401:
err.message = "未授权";
break
case 403:
err.message = "拒绝访问";
break
case 404:
err.message = `请求地址出错:${err.response.config.url}`;
break
case 408:
err.message = "请求超时";
break;
case 500:
err.message = "服务器内部错误";
break;
case 501:
err.message = "服务未实现";
break;
case 502:
err.message = "网关错误";
break;
case 503:
err.message = "服务不可用";
break;
case 504:
err.message = "网关超时";
break;
case 505:
err.message = "HTTP版本不受支持";
break;
default:
}
}
console.log(err);
if (err.message) {
ElMessage({message: err.message, type: 'error', showClose: true});
}
return Promise.reject(err);
}
);
//请求处理
instance(options).then(
/**
* response 统一格式
* {
* code: 200,
* msg: '消息[String]',
* data: '返回数据[Any]'
* }
* code说明
* 200 成功
* -1 失败可能网络不通可能后台服务异常或其它异常
* -2 登录失效跳回登录
*/
(res) => {
if (res.code === 200) {
resolve(res);
}else{
if (res.code === -2) {
router.push("/login");
}
ElMessage({message: res.msg || "操作失败", type: "error", showClose: true});
reject(res);
}
}
).catch(
(error) => {
reject(error);
}
)
// const config = {
// method: 'get',
// baseURL: 'http://127.0.0.1:8000',
// headers: {
// 'Content-Type': 'application/json;charset=UTF-8',
// 'Authorization': 'token 4e63b8854974c1fdac9deb891fd74dc145b53f85'
// },
// timeout: 10000,
// withCredentials: true,
// responseType: 'json',
// }
console.log('axios')
function request(options) {
const instance = axios.create({...config})
options = {...options, instance} // 使用创建的实例
// 请求拦截器
instance.interceptors.request.use(
config => {
// 处理请求前的逻辑...
return config
},
error => {
// 请求错误处理
return Promise.reject(error)
}
)
// 响应拦截器
instance.interceptors.response.use(
response => {
// 处理响应数据
return response
},
error => {
// 处理响应错误
return Promise.reject(error)
}
)
return new Promise((resolve, reject) => {
instance(options)
.then(res => {
resolve(res.data)
// console.log(res.data)
})
.catch(err => {
reject(err)
})
})
}
// request({
// url: '/update/cinema/'
// }).then(res => {
// console.log(res)
// })
export default request

@ -1,5 +1,7 @@
<script setup>
import {ref, reactive, unref} from 'vue';
import {ref, reactive, unref, onMounted, onBeforeMount} from 'vue';
import {cinema_list} from "@/apis/update.js";
//
const cinemaSearch = reactive({
@ -12,7 +14,7 @@ const cinemaSearchRef = ref()
//
const ip_validate = (rule, value, callback) => {
const regex = new RegExp('((2(5[0-5]|[0-4]\\d))|[0-1]?\\d{1,2})(\\.((2(5[0-5]|[0-4]\\d))|[0-1]?\\d{1,2})){3}');
if (value === ''){
if (value === '') {
callback()
}
if (!regex.test(value)) {
@ -34,13 +36,13 @@ const submitSearch = (formEl) => {
console.log(ip, version)
if (!formEl) return
formEl.validate((valid) => {
if (valid) {
console.log('提交数据')
} else {
console.log('提交失败')
return false
}
})
if (valid) {
console.log('提交数据')
} else {
console.log('提交失败')
return false
}
})
}
const resetSearch = (formEl) => {
@ -50,22 +52,66 @@ const resetSearch = (formEl) => {
formEl.resetFields()
}
// const get_table_data = {
// async
// }
//
const tableData = reactive(
[
{
'update_time': '2023-12-13 16:16:18',
'name': '鼎新测试环境3.112',
'ip': '172.16.3.112',
'zz_num': '14105121',
'inner_id': '2105',
'db_user': 'test',
'db_pwd': 'cine123456',
'sys_ver': '2.0.33.0337ZZ',
'client_ver': '2.033.0337.8894'
// const tableData = cinema_list().then(res => {
//
// if (res.code === 200) {
// console.log(res)
// return res.data
// }
// })
// // console.log(tableData)
//
const get_table_data = async () => {
await cinema_list().then(res => {
if (res.length > 0) {
console.log(res)
return reactive([...res])
// console.log(tableData)
} else {
console.log('else')
return reactive([]);
}
}).catch(err => {
console.log('err')
console.log(err)
return reactive([]);
}
]
)
}
//
// let tableData = reactive(
// [
// {
// 'update_time': '2023-12-13 16:16:18',
// 'name': '3.112',
// 'ip': '172.16.3.112',
// 'zz_num': '14105121',
// 'inner_id': '2105',
// 'db_user': 'test',
// 'db_pwd': 'cine123456',
// 'sys_ver': '2.0.33.0337ZZ',
// 'client_ver': '2.033.0337.8894'
// }
// ]
// )
// console.log(tableData)
//
onMounted(
async () => {
console.log('onMounted1')
const tableData = await get_table_data();
console.log('onMounted2')
}
)
</script>
<template>

Loading…
Cancel
Save