donghaolin
5 months ago
8 changed files with 411 additions and 424 deletions
-
2README.md
-
299package-lock.json
-
1package.json
-
1src/assets/logo.svg
-
5src/main.js
-
6src/router/index.js
-
131src/views/FrontView.vue
-
390src/views/backindex.vue
@ -1 +0,0 @@ |
|||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 261.76 226.69"><path d="M161.096.001l-30.225 52.351L100.647.001H-.005l130.877 226.688L261.749.001z" fill="#41b883"/><path d="M161.096.001l-30.225 52.351L100.647.001H52.346l78.526 136.01L209.398.001z" fill="#34495e"/></svg> |
|
||||
@ -0,0 +1,390 @@ |
|||||
|
<script setup> |
||||
|
import { ref } from "vue"; |
||||
|
import { ElMessage } from "element-plus"; |
||||
|
import { ElMessageBox } from "element-plus"; |
||||
|
import axios from "axios"; |
||||
|
import moment from "moment"; |
||||
|
|
||||
|
const titleEdit = ref(false); |
||||
|
const raiseEdit = ref(false); |
||||
|
const addInfo = ref(false); |
||||
|
const deleteInfo = ref(false); |
||||
|
|
||||
|
//这是查询的接口 |
||||
|
const info = ref({}); |
||||
|
const getInfo = async function () { |
||||
|
try { |
||||
|
const result = await axios.get("http://192.168.9.117:8092/page"); |
||||
|
info.value.title = result.data.data.title; |
||||
|
info.value.targetNumber = result.data.data.targetNumber; |
||||
|
} catch (error) { |
||||
|
console.log("请求失败", error); |
||||
|
} |
||||
|
}; |
||||
|
getInfo(); |
||||
|
|
||||
|
//这是修改标题的接口 |
||||
|
const titleNew = ref({}); |
||||
|
const putTitle = async function () { |
||||
|
try { |
||||
|
// 创建一个FormData对象 |
||||
|
const formData = new FormData(); |
||||
|
// 将titleNew中的数据添加到FormData对象中 |
||||
|
for (const key in titleNew.value) { |
||||
|
formData.append(key, titleNew.value[key]); |
||||
|
} |
||||
|
const result = await axios.put( |
||||
|
"http://192.168.9.117:8092/title", |
||||
|
formData, |
||||
|
{ |
||||
|
headers: { |
||||
|
"Content-Type": "multipart/form-data", |
||||
|
}, |
||||
|
} |
||||
|
); |
||||
|
if (result.data.code == 10000) { |
||||
|
ElMessage.success("修改成功"); |
||||
|
titleEdit.value = false; |
||||
|
titleNew.value = {}; |
||||
|
getInfo(); //刷新页面 |
||||
|
} |
||||
|
if (result.data.code == 10001) { |
||||
|
ElMessage.error(result.data.msg); |
||||
|
titleNew.value = {}; |
||||
|
titleEdit.value = false; |
||||
|
} |
||||
|
} catch (error) { |
||||
|
console.log("请求失败", error); |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
//这是修改众筹人数的接口 |
||||
|
const targetNumberNew = ref({}); |
||||
|
const putTargetNumber = async function () { |
||||
|
try { |
||||
|
// 创建一个FormData对象 |
||||
|
const formData = new FormData(); |
||||
|
// 将titleNew中的数据添加到FormData对象中 |
||||
|
for (const key in targetNumberNew.value) { |
||||
|
formData.append(key, targetNumberNew.value[key]); |
||||
|
} |
||||
|
const result = await axios.put( |
||||
|
"http://192.168.9.117:8092/target", |
||||
|
formData, |
||||
|
{ |
||||
|
headers: { |
||||
|
"Content-Type": "multipart/form-data", |
||||
|
}, |
||||
|
} |
||||
|
); |
||||
|
if (result.data.code == 10000) { |
||||
|
ElMessage.success("修改成功"); |
||||
|
raiseEdit.value = false; |
||||
|
targetNumberNew.value = {}; |
||||
|
getInfo(); //刷新页面 |
||||
|
} |
||||
|
if (result.data.code == 10001) { |
||||
|
ElMessage.error(result.data.msg); |
||||
|
targetNumberNew.value = {}; |
||||
|
raiseEdit.value = false; |
||||
|
} |
||||
|
} catch (error) { |
||||
|
console.log("请求失败", error); |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
//这是查询全部数据的接口 |
||||
|
const search = ref({ |
||||
|
jwcode: "", |
||||
|
identity: "", |
||||
|
}); |
||||
|
const tableData = ref([]); |
||||
|
const get = async function () { |
||||
|
try { |
||||
|
const result = await axios.post( |
||||
|
"http://192.168.9.117:8092/users", |
||||
|
search.value |
||||
|
); |
||||
|
tableData.value = result.data.data; |
||||
|
} catch (error) { |
||||
|
console.log("请求失败", error); |
||||
|
} |
||||
|
}; |
||||
|
get(); |
||||
|
|
||||
|
//这是添加的接口 |
||||
|
const add = ref({}); |
||||
|
const addUser = async function () { |
||||
|
try { |
||||
|
const result = await axios.post( |
||||
|
"http://192.168.9.117:8092/addUser", |
||||
|
add.value |
||||
|
); |
||||
|
if (result.data.code == 10000) { |
||||
|
ElMessage.success("修改成功"); |
||||
|
addInfo.value = false; |
||||
|
add.value = {}; |
||||
|
get(); //刷新页面 |
||||
|
} |
||||
|
if (result.data.code == 10001) { |
||||
|
ElMessage.error(result.data.msg); |
||||
|
addInfo.value = false; |
||||
|
add.value = {}; |
||||
|
} |
||||
|
} catch (error) { |
||||
|
console.log("请求失败", error); |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
// 这是删除的接口 |
||||
|
const idname = ref(""); |
||||
|
function deleteRow(value) { |
||||
|
deleteInfo.value = true; |
||||
|
console.log(value); |
||||
|
idname.value = value; |
||||
|
} |
||||
|
const tureDelete = async function () { |
||||
|
try { |
||||
|
const result = await axios.delete( |
||||
|
"http://192.168.9.117:8092/delUser/" + idname.value |
||||
|
); |
||||
|
if (result.data.code == 10000) { |
||||
|
ElMessage.success("修改成功"); |
||||
|
deleteInfo.value = false; |
||||
|
idname.value = {}; |
||||
|
get(); //刷新页面 |
||||
|
} |
||||
|
if (result.data.code == 10001) { |
||||
|
ElMessage.error(result.data.msg); |
||||
|
deleteInfo.value = false; |
||||
|
idname.value = {}; |
||||
|
} |
||||
|
} catch (error) { |
||||
|
console.log("请求失败", error); |
||||
|
} |
||||
|
}; |
||||
|
|
||||
|
// 这是条件查询的接口 |
||||
|
const searchBy = ref({ |
||||
|
jwcode: "", |
||||
|
identity: "", |
||||
|
}); |
||||
|
const searchByJwcodeAndIdentity = async function () { |
||||
|
try { |
||||
|
const result = await axios.post( |
||||
|
"http://192.168.9.117:8092/users", |
||||
|
searchBy.value |
||||
|
); |
||||
|
if (result.data.code == 10000) { |
||||
|
ElMessage.success("查询成功"); |
||||
|
searchBy.value = {}; |
||||
|
} |
||||
|
if (result.data.code == 10001) { |
||||
|
ElMessage.error(result.data.msg); |
||||
|
searchBy.value = {}; |
||||
|
} |
||||
|
tableData.value = result.data.data; |
||||
|
} catch (error) { |
||||
|
console.log("请求失败", error); |
||||
|
} |
||||
|
}; |
||||
|
function Nono() { |
||||
|
searchBy.value = {}; |
||||
|
get(); |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<template> |
||||
|
<el-container> |
||||
|
<el-main style="width: 100%"> |
||||
|
<el-card style="min-width: 70%; margin: 0 auto"> |
||||
|
<h2 style="margin-top: 0%">众筹活动界面后台</h2> |
||||
|
<h3>修改前台展示</h3> |
||||
|
<el-divider style="margin-top: 0%" /> |
||||
|
<div style="display: flex; align-items: center"> |
||||
|
<h4 style="margin: 0%">当前标题:</h4> |
||||
|
<span style="color: rgb(145, 145, 145); margin-left: 20px">{{ |
||||
|
info.title |
||||
|
}}</span> |
||||
|
<el-button |
||||
|
class="xiugai" |
||||
|
type="danger" |
||||
|
style=" |
||||
|
display: inline-block; |
||||
|
margin-left: 20px; |
||||
|
color: rgb(245, 62, 62); |
||||
|
" |
||||
|
@click="titleEdit = true" |
||||
|
>修改</el-button |
||||
|
> |
||||
|
</div> |
||||
|
<div style="display: flex; align-items: center"> |
||||
|
<h4 style="margin-bottom: 0px; margin-top: 30px">众筹目标:</h4> |
||||
|
<span |
||||
|
style=" |
||||
|
margin-bottom: 0px; |
||||
|
margin-top: 30px; |
||||
|
margin-left: 20px; |
||||
|
color: rgb(145, 145, 145); |
||||
|
" |
||||
|
>{{ info.targetNumber }}人</span |
||||
|
> |
||||
|
<el-button |
||||
|
class="xiugai" |
||||
|
type="danger" |
||||
|
style=" |
||||
|
display: inline-block; |
||||
|
margin-left: 20px; |
||||
|
margin-top: 30px; |
||||
|
color: rgb(245, 62, 62); |
||||
|
" |
||||
|
@click="raiseEdit = true" |
||||
|
>修改</el-button |
||||
|
> |
||||
|
</div> |
||||
|
</el-card> |
||||
|
<el-card style="min-width: 70%; margin: 0 auto; margin-top: 20px"> |
||||
|
<h3>众筹用户列表</h3> |
||||
|
<el-button type="danger" @click="addInfo = true">添加</el-button> |
||||
|
<el-input |
||||
|
v-model="searchBy.jwcode" |
||||
|
style="width: 150px; margin-left: 200px" |
||||
|
placeholder="精网号" |
||||
|
></el-input> |
||||
|
<el-select |
||||
|
v-model="searchBy.identity" |
||||
|
style="width: 100px; margin-left: 60px" |
||||
|
placeholder="身份" |
||||
|
> |
||||
|
<el-option label="真实" value="1"></el-option> |
||||
|
<el-option label="虚拟" value="0"></el-option> |
||||
|
</el-select> |
||||
|
|
||||
|
<el-button type="" @click="Nono()" style="margin-left: 40px" |
||||
|
>重置</el-button |
||||
|
> |
||||
|
<el-button type="danger" @click="searchByJwcodeAndIdentity()" |
||||
|
>查询</el-button |
||||
|
> |
||||
|
<el-table :data="tableData"> |
||||
|
<el-table-column |
||||
|
prop="id" |
||||
|
label="序号" |
||||
|
width="300px" |
||||
|
></el-table-column> |
||||
|
<el-table-column |
||||
|
prop="jwcode" |
||||
|
label="编号" |
||||
|
width="300px" |
||||
|
></el-table-column> |
||||
|
<el-table-column prop="identity" label="身份" width="300px"> |
||||
|
<!-- 模板内容 --> |
||||
|
<template #default="scope"> |
||||
|
<span v-if="scope.row.identity == 1"> |
||||
|
<span>真实</span> |
||||
|
</span> |
||||
|
<span v-if="scope.row.identity == 0"> |
||||
|
<span>虚拟</span> |
||||
|
</span> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="creatTime" label="参与时间" width="700px"> |
||||
|
<template #default="scope"> |
||||
|
{{ moment(scope.row.createTime).format("YYYY-MM-DD HH:mm:ss") }} |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="操作" width="px"> |
||||
|
<template #default="scope"> |
||||
|
<el-button |
||||
|
@click="deleteRow(scope.row.jwcode)" |
||||
|
type="text" |
||||
|
style="color: rgb(245, 62, 62)" |
||||
|
>删除</el-button |
||||
|
> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
</el-card> |
||||
|
</el-main> |
||||
|
</el-container> |
||||
|
|
||||
|
<!-- 这是添加的弹窗 --> |
||||
|
<el-dialog v-model="addInfo" width="500"> |
||||
|
<div> |
||||
|
<h3 style="display: inline-block; margin-right: 20px">精网号</h3> |
||||
|
<el-input |
||||
|
v-model="add.jwcode" |
||||
|
placeholder="请输入精网号" |
||||
|
style="width: 300px; display: inline-block" |
||||
|
/> |
||||
|
</div> |
||||
|
<div> |
||||
|
<h3 style="display: inline-block; margin-right: 20px">身份</h3> |
||||
|
<el-radio-group v-model="add.identity"> |
||||
|
<el-radio value="1" size="large">真实</el-radio> |
||||
|
<el-radio value="0" size="large">虚拟</el-radio> |
||||
|
</el-radio-group> |
||||
|
</div> |
||||
|
<el-button type="danger" @click="addUser()" style="margin-left: 400px" |
||||
|
>添加</el-button |
||||
|
> |
||||
|
</el-dialog> |
||||
|
|
||||
|
<!-- 这是修改表题的弹窗 --> |
||||
|
<el-dialog v-model="titleEdit" width="500"> |
||||
|
<div> |
||||
|
<h3 style="display: inline-block; margin-right: 20px">输入新标题</h3> |
||||
|
<el-input |
||||
|
v-model="titleNew.title" |
||||
|
placeholder="请输入新标题" |
||||
|
style="width: 300px; display: inline-block" |
||||
|
/> |
||||
|
</div> |
||||
|
<el-button type="danger" @click="putTitle()" style="margin-left: 400px" |
||||
|
>确定</el-button |
||||
|
> |
||||
|
</el-dialog> |
||||
|
|
||||
|
<!-- 这是修改众筹目标的弹窗 --> |
||||
|
<el-dialog v-model="raiseEdit" width="500"> |
||||
|
<div> |
||||
|
<h3 style="display: inline-block; margin-right: 20px"> |
||||
|
输入新众筹目标为 |
||||
|
</h3> |
||||
|
<el-input |
||||
|
v-model="targetNumberNew.targetNumber" |
||||
|
placeholder="请输入阿拉伯数字" |
||||
|
style="width: 300px; display: inline-block" |
||||
|
/> |
||||
|
</div> |
||||
|
<el-button |
||||
|
type="danger" |
||||
|
@click="putTargetNumber()" |
||||
|
style="margin-left: 400px" |
||||
|
>确定</el-button |
||||
|
> |
||||
|
</el-dialog> |
||||
|
|
||||
|
<!-- 这是删除的弹窗 --> |
||||
|
<el-dialog v-model="deleteInfo" width="500"> |
||||
|
<div> |
||||
|
<h3 style="display: inline-block; margin-right: 20px"> |
||||
|
确认删除该条信息 |
||||
|
</h3> |
||||
|
</div> |
||||
|
<el-button type="danger" @click="tureDelete()" style="margin-left: 400px" |
||||
|
>确定</el-button |
||||
|
> |
||||
|
</el-dialog> |
||||
|
</template> |
||||
|
|
||||
|
<style scoped> |
||||
|
/* 移除 el-button 的默认样式 */ |
||||
|
.xiugai { |
||||
|
border: none; |
||||
|
background-color: transparent; |
||||
|
color: #409eff; /* Element Plus 默认的主题色 */ |
||||
|
padding: 0; |
||||
|
font-size: inherit; /* 继承父元素的字体大小 */ |
||||
|
} |
||||
|
</style> |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue