设备工况物联系统任务计划列表页面
This commit is contained in:
123@123.com
parent
296e42f621
commit
ef69e8fa27
BIN
src/assets/indexImg/MicroExhibitionTable.png
Normal file
BIN
src/assets/indexImg/MicroExhibitionTable.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 123 KiB |
@ -10,4 +10,13 @@ export function getFiveList(){
|
||||
}
|
||||
export function getTopDevice(){
|
||||
return get('/cisma/getTopDevice')
|
||||
}
|
||||
// 任务计划列表
|
||||
export function getPlanProduction(){
|
||||
return get('/cisma/getPlanProduction')
|
||||
}
|
||||
// 任务计划列表保存
|
||||
export function insertPlanProduction(data){
|
||||
|
||||
return post('/cisma/insertPlanProduction',data)
|
||||
}
|
||||
@ -1,5 +1,5 @@
|
||||
/*
|
||||
* @FilePath: \wwwd:\code\screenFront\src\router\index.ts
|
||||
* @FilePath: index.ts
|
||||
* @Author: 王路平
|
||||
* @文件版本: V1.0.0
|
||||
* @Date: 2023-01-29 15:16:36
|
||||
@ -285,6 +285,11 @@ const routes: Array<RouteRecordRaw> = [
|
||||
|
||||
|
||||
},
|
||||
{
|
||||
path: "/MicroExhibitionTable",
|
||||
name: "MicroExhibitionTable",
|
||||
component: () => import("../views/MicroExhibition/table.vue"),
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
@ -17,14 +17,14 @@ let url = process.env.VUE_APP_BASE_API
|
||||
|
||||
// 3.创建自定义axios 限制响应时间
|
||||
axios.create({
|
||||
|
||||
|
||||
// baseURL: url,
|
||||
timeout: 3000,
|
||||
})
|
||||
|
||||
|
||||
//请求拦截器
|
||||
axios.interceptors.request.use( (config:AxiosRequestConfig|any) => {
|
||||
axios.interceptors.request.use((config: AxiosRequestConfig | any) => {
|
||||
// console.group("本次请求地址为", config) //请求提示
|
||||
// 在发送请求之前做些什么，例如加入token
|
||||
// if (config.data) {
|
||||
@ -39,14 +39,14 @@ axios.interceptors.request.use( (config:AxiosRequestConfig|any) => {
|
||||
});
|
||||
|
||||
//响应拦截器
|
||||
axios.interceptors.response.use(function (response:AxiosResponse) {
|
||||
axios.interceptors.response.use(function (response: AxiosResponse) {
|
||||
// 在接收响应做些什么，例如跳转到登录页
|
||||
// console.log(response, "我是响应拦截器")
|
||||
const router = Router; //路由全局对象
|
||||
|
||||
let status = response.status;
|
||||
// console.log(response,"sssssssfafafafafaaaf");
|
||||
|
||||
|
||||
// if (status === 200) {
|
||||
// let code = response.data.Code;
|
||||
|
||||
@ -92,7 +92,7 @@ export function get(staurl: string, data: any = '') {
|
||||
// strSign = MD5(strSign);
|
||||
// let strData = 'code=' + code + '&sign=' + strSign + '¶=' + strPara;
|
||||
|
||||
let _url = url+staurl //"?" + strData;
|
||||
let _url = url + staurl //"?" + strData;
|
||||
|
||||
return new Promise((resolve, rejects) => {
|
||||
let header = { //请求头设置
|
||||
@ -101,7 +101,7 @@ export function get(staurl: string, data: any = '') {
|
||||
axios({
|
||||
url: _url,//在线跨域请求
|
||||
method: "get",//默认是get请求
|
||||
headers:header,
|
||||
headers: header,
|
||||
params: data
|
||||
}).then(function (val) {
|
||||
// console.log(val) // axios会对我们请求来的结果进行再一次的封装（ 让安全性提高 ）
|
||||
@ -125,7 +125,7 @@ export function put(staurl: string, data: any = '') {
|
||||
// strSign = MD5(strSign);
|
||||
// let strData = 'code=' + code + '&sign=' + strSign + '¶=' + strPara;
|
||||
|
||||
let _url = url+staurl //"?" + strData;
|
||||
let _url = url + staurl //"?" + strData;
|
||||
|
||||
return new Promise((resolve, rejects) => {
|
||||
let header = { //请求头设置
|
||||
@ -134,7 +134,7 @@ export function put(staurl: string, data: any = '') {
|
||||
axios({
|
||||
url: _url,//在线跨域请求
|
||||
method: "put",//默认是get请求
|
||||
headers:header,
|
||||
headers: header,
|
||||
params: data
|
||||
}).then(function (val) {
|
||||
// console.log(val) // axios会对我们请求来的结果进行再一次的封装（ 让安全性提高 ）
|
||||
@ -148,90 +148,18 @@ export function put(staurl: string, data: any = '') {
|
||||
}
|
||||
|
||||
|
||||
export function post(code: string, data: any = "", method: string = "POST", isFile: boolean = false, file: File) {
|
||||
let strTime = (<any>new Date()).Format("yyyyMMddhhmmss")
|
||||
let flag = sessionStorage.getItem("Order_management_Office") || false
|
||||
if (!flag) {
|
||||
open4("禁止非法post跳转")
|
||||
Router.push('/login') //路由全局对象 如果没有 内存存的sessionStorage那么默认是非法跳转直接弹回登录页
|
||||
return
|
||||
}
|
||||
export function post(staurl: string, data: any = "", method: string = "POST") {
|
||||
|
||||
let userId = JSON.parse(sessionStorage.getItem("Order_management_Office")!).UserID
|
||||
let Token = JSON.parse(sessionStorage.getItem("Order_management_Office")!).Token
|
||||
|
||||
let strPara = '';
|
||||
if (data == '') {
|
||||
strPara = '{"datetime":"' + strTime + '","userid":"' + userId + '","token":"' + Token + '"}';
|
||||
} else {
|
||||
strPara = '{"datetime":"' + strTime + '","userid":"' + userId + '","token":"' + Token + '",' + data + '}';
|
||||
}
|
||||
// console.log(strPara);
|
||||
let password = "RicardPwd";
|
||||
let strSign = password + strPara + password;
|
||||
// console.log(strSign);
|
||||
// strSign = MD5(strSign);
|
||||
// console.log(strSign);
|
||||
|
||||
// let tmpPara = (method == "POST") ? '' : strPara //post url后para为空
|
||||
let newUrl = url
|
||||
// strData = 'code=' + code + '&sign=' + strSign + '¶=' + tmpPara;
|
||||
// console.log(strData);
|
||||
let _url = newUrl //+ "?" + strData;
|
||||
let _url = url + staurl //+ "?" + strData;
|
||||
let METHOD = method || "POST"
|
||||
|
||||
|
||||
|
||||
|
||||
return new Promise((resolve, rejects) => {
|
||||
if (userId == "" || Token == "" || userId == undefined || Token == undefined) {
|
||||
let tip = "登录失效，请重新登录!"
|
||||
console.log("*************我进来了2*******************")
|
||||
rejects(tip)
|
||||
open4("禁止非法post跳转")
|
||||
Router.push('/Login') //路由全局对象 如果没有 内存存的cooike那么默认是非法跳转直接弹回登录页
|
||||
return
|
||||
}
|
||||
let header = { //请求头设置
|
||||
"Content-Type": "application/x-www-form-urlencoded",
|
||||
"Access-Control-Allow-Origin": "*"
|
||||
}
|
||||
let params:any = {}
|
||||
if (!isFile) {
|
||||
params = { //此处是传参
|
||||
code,
|
||||
sign: strSign,
|
||||
para: strPara
|
||||
}
|
||||
// 对数据进行序列化操作
|
||||
data = qs.stringify(params)
|
||||
}
|
||||
let params: any = {}
|
||||
// 处理表单结果中文件的操作
|
||||
if (isFile) { //如果包含文件得传参方式
|
||||
|
||||
params = { //此处是传参
|
||||
code,
|
||||
sign: strSign,
|
||||
para: strPara,
|
||||
file
|
||||
}
|
||||
|
||||
// 设置请求头
|
||||
header = {
|
||||
"Content-Type": "multipart/form-data",
|
||||
"Access-Control-Allow-Origin": "*"
|
||||
}
|
||||
// 对数据进行序列化操作
|
||||
data = new FormData();
|
||||
for (let i in params) {
|
||||
data.append(i, params[i])
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
axios({
|
||||
url: _url,
|
||||
headers: header,
|
||||
method: METHOD,
|
||||
data: data
|
||||
}).then(function (res) {
|
||||
|
||||
138
src/views/MicroExhibition/table.vue
Normal file
138
src/views/MicroExhibition/table.vue
Normal file
@ -0,0 +1,138 @@
|
||||
<!--
|
||||
* @FilePath: table.vue
|
||||
* @Author: 张宇琼
|
||||
* @Date: 2023-09-08 16:35:24
|
||||
* @LastEditors: Please set LastEditors
|
||||
* @LastEditTime: 2023-09-11 16:51:36
|
||||
* @Descripttion:
|
||||
-->
|
||||
<template>
|
||||
<div class="container">
|
||||
<div class="header">
|
||||
<div class="title">
|
||||
<header2 ref="headerref" :width="'100%'" :height="'100px'" :title="'设备工况物联系统'" :titleTip="[]"
|
||||
:typeFun="['time']" :alarmType="[]"></header2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-container">
|
||||
<el-table :data="tableData" style="width: 100%" :header-cell-style="{
|
||||
'text-align': 'center',
|
||||
'font-size': '20px',
|
||||
'background': '#162556 !important',
|
||||
'color': '#ffffff',
|
||||
'border': 'none !important'
|
||||
}">
|
||||
<el-table-column prop="order" label="序号" width="80" align="center"></el-table-column>
|
||||
<el-table-column align="center" prop="name" label="设备名称"></el-table-column>
|
||||
<el-table-column prop="label" label="设备编号" align="center"></el-table-column>
|
||||
<el-table-column prop="planProduction" label="计划任务" align="center">
|
||||
<template #default="{ row }">
|
||||
<div class="centered-input">
|
||||
<el-input v-model="row.planProduction" placeholder="请输入" clearable />
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div>
|
||||
<el-button @click="saveData" type="success" style="background-color: #00B38B;">保存</el-button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import header2 from '@/components/headerBox/header2.vue'
|
||||
import { ref, onMounted } from 'vue';
|
||||
import { ElTable, ElTableColumn, ElInput, ElButton, ElMessage,ElMessageBox } from 'element-plus';
|
||||
import { getPlanProduction, insertPlanProduction } from '@/http/cisma';
|
||||
const tableData = ref([]);
|
||||
onMounted(() => {
|
||||
// 获取数据
|
||||
fetchPlanProduction();
|
||||
|
||||
})
|
||||
async function fetchPlanProduction(): Promise<any> {
|
||||
try {
|
||||
const res = await getPlanProduction() as any;
|
||||
if (res.code === 200) {
|
||||
// console.log(res);
|
||||
tableData.value = res.data
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Failed to fetch plan production:', error);
|
||||
// 处理错误情况
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
async function saveData() {
|
||||
let list = tableData.value.map(item => {
|
||||
|
||||
// 检查planProduction是否为空值
|
||||
if (!item.planProduction) {
|
||||
ElMessageBox.alert('任务计划列存在空值，无法保存', '提示'); // 使用弹窗组件显示提示信息
|
||||
throw new Error('存在空值,无法保存'); // 抛出异常，停止保存操作
|
||||
}
|
||||
return {
|
||||
planProduction: item.planProduction,
|
||||
label: item.label
|
||||
}
|
||||
})
|
||||
try {
|
||||
const res = await insertPlanProduction(list) as any;
|
||||
if (res.code === 200) {
|
||||
ElMessage.success('保存成功');
|
||||
} else {
|
||||
ElMessage.error('保存失败');
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Failed to save plan production:', error);
|
||||
// 处理错误情况
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<style scoped>
|
||||
.container {
|
||||
height: 1080px;
|
||||
width: 1920px;
|
||||
color: #FFFFFF;
|
||||
background-color: #0E0E0E;
|
||||
position: relative;
|
||||
/* text-align: center; */
|
||||
|
||||
}
|
||||
|
||||
:deep(.el-table tr) {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
:deep(.el-table__inner-wrapper::before) {
|
||||
background-color: #173d91;
|
||||
}
|
||||
|
||||
.centered-input ::v-deep .el-input__inner {
|
||||
text-align: center;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.el-input {
|
||||
width: 50%;
|
||||
border: none;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.table-container {
|
||||
width: 70%;
|
||||
margin-left: 15%;
|
||||
margin-top: 20px;
|
||||
|
||||
}
|
||||
|
||||
.el-button {
|
||||
margin-left: 65%;
|
||||
margin-top: 10px;
|
||||
}
|
||||
</style>
|
||||
@ -1,5 +1,5 @@
|
||||
<!--
|
||||
* @FilePath: \code\gitscreenFront\src\views\index.vue
|
||||
* @FilePath: index.vue
|
||||
* @Author: 王路平
|
||||
* @文件版本: V1.0.0
|
||||
* @Date: 2023-01-29 15:34:48
|
||||
@ -222,6 +222,12 @@ let routerList = [
|
||||
title: '设备大屏展示系统',
|
||||
url: require("../assets/indexImg/microExhibition.jpg"),
|
||||
},
|
||||
{
|
||||
id: 33,
|
||||
path: "/MicroExhibitionTable",
|
||||
title: '设备物联工况系统列表',
|
||||
url: require("../assets/indexImg/MicroExhibitionTable.png"),
|
||||
},
|
||||
|
||||
{
|
||||
id: 7,
|
||||
|
||||
Loading…
Reference in New Issue
Block a user