Skip to content

G
GaoQuYingJiH5-ASD
Commit ffd017f1 authored by xinzhedeai's avatar xinzhedeai
Browse files
Options

add：演练页面接口对接

parent b2912008
Show whitespace changes
Inline Side-by-side
Showing with 210 additions and 200 deletions
src/_peixun_yanlian_detail-anquan.css
View file @ ffd017f1
......@@ -320,12 +320,14 @@ body {
font-size: 0.3rem;
border: 1px solid #d7d7d7;
background-color: #fff;
}
input:disabled {
}
input:disabled {
background-color: #fff;
color:#9b9fab;
}
select:disabled {
color: #9b9fab;
}
select:disabled {
border: none;
/* 移除默认箭头 */
-webkit-appearance: none;
......@@ -337,20 +339,20 @@ body {
/* 可选：统一背景色 */
background-color: white;
}
}
.form-label-div {
.form-label-div {
height: 50px;
line-height: 50px;
padding: 0 12px;
font-size: .28rem;
font-weight: 500;
margin-bottom: -.3rem;
}
}
.img-wrapper {
.img-wrapper {
display: flex;
gap: .16rem;
margin-top: 0.25rem;
margin-bottom: 0.15rem;
}
\ No newline at end of file
}
\ No newline at end of file
src/_peixun_yanlian_detail-anquan.html
View file @ ffd017f1
......@@ -28,7 +28,8 @@
<span class="form-label title_require">培训演练类别</span>
<div class="form-input-wrap">
<select class="selector" v-model="formData.safetyTrainingType" :disabled="flag=='XQ'">
<option v-for="(item, i) in tabList4lv2" v-if="item.dictValue!='0'" :key="i" :label="item.dictLabel" :value="item.dictValue">
<option v-for="(item, i) in tabList4lv2" v-if="item.dictValue!='0'" :key="i"
:label="item.dictLabel" :value="item.dictValue">
</option>
</select>
</div>
......@@ -63,17 +64,6 @@
@confirm="onDateConfirm" @cancel="showDatePicker = false" />
</van-popup>
<!-- <div>
<h5 class="imager-item-title title_require">
<span style="font-weight: 500;font-size: 0.28rem;color: #333;">请上传图片（最多6张）</span>
<span></span>
</h5>
<div>
<van-uploader v-model="formData.photos" :max-count="6" multiple
:after-read="handleFileUpload" class="uploader-wrapper" />
</div>
</div> -->
<!-- 详情模式 -->
<div class="form-label form-label-div">培训照片</div>
<div class="img-wrapper">
<div style="position: relative;" v-for="(imgItem, index) in formData.images">
......@@ -85,8 +75,7 @@
</div>
<div v-if="formData.images.length<6 && flag=='ADD' ">
<van-uploader :before-read="beforeRead" :after-read="(file) => afterRead(file, 'floorPlan')"
class="uploader-wrapper" :deletable="false" :preview-image="false"
>
class="uploader-wrapper" :deletable="false" :preview-image="false">
<img src="../image/code/upload.png" style="width:1.6rem;height: 1.6rem;" alt=""
srcset="">
</van-uploader>
......
src/_peixun_yanlian_detail-anquan.js
View file @ ffd017f1
......@@ -4,7 +4,7 @@
* description: 商户首页
*/
var VUE = null
window.addEventListener("load", function () {
window.addEventListener("load", function() {
VUE = new Vue({
el: '#app',
data() {
......@@ -15,7 +15,7 @@ window.addEventListener("load", function () {
showDatePicker: false, // 控制日期选择器显示
minDate: new Date(gemhoUtil.getTargetDateYMD()), // 最小可选日期
maxDate: new Date(2099, 11, 31), // 最大可选日期
tabList4lv2:[],
tabList4lv2: [],
// 日期选择的最小范围，这里设置为当前日期的前 10 年
// maxDate: new Date(new Date().getFullYear() + 10, 11),
// 新增以下数据
......@@ -36,10 +36,10 @@ window.addEventListener("load", function () {
},
mounted() {
this.id = gemhoUtil.getParameter('id')
if(this.id){ // 详情
if (this.id) { // 详情
this.flag = 'XQ'
this.detail() // 获取商户信息
}else{
} else {
this.flag = 'ADD'
}
this.getDict4tab2()
......@@ -82,7 +82,7 @@ window.addEventListener("load", function () {
this.formData.images.splice(index, 1);
},
beforeRead(file) {
if(!['image/png','image/jpeg','image/jpg'].includes(file.type)){
if (!['image/png', 'image/jpeg', 'image/jpg'].includes(file.type)) {
vant.Dialog.alert({
title: '信息提示',
message: '文件格式不正确'
......@@ -125,13 +125,13 @@ window.addEventListener("load", function () {
})
.then(value => {
console.log(value, 'value图片上********'); // 处理后端返回的数据
if(value){ // 返回信息不为空，则进行解密操作
if (value) { // 返回信息不为空，则进行解密操作
this.formData.images.push(value.fileName)
// 可根据后端返回的数据做进一步处理，如显示上传成功信息等
setTimeout(() => {
vant.Toast.clear()
}, 0);
}else{
} else {
this.afterRead(file)
}
})
......@@ -139,14 +139,14 @@ window.addEventListener("load", function () {
// console.error('There has been a problem with your fetch operation:', error);
});
},
showDatePickerModal(){
if(this.flag=='XQ'){
showDatePickerModal() {
if (this.flag == 'XQ') {
return
}
this.showDatePicker = true
},
showImage(list, index) {
const images = list.map((item)=>{
const images = list.map((item) => {
return this.previewUrl + item
})
console.log(images, 'images')
......@@ -197,7 +197,7 @@ window.addEventListener("load", function () {
}
if (!this.formData.responsiblePerson) {
vant.Dialog.alert({
message: '培训人不可为空',
message: '负责人不可为空',
})
return;
}
......@@ -222,7 +222,7 @@ window.addEventListener("load", function () {
http3.post('/gaoqu/exercise', reqParam).then((res) => {
console.log('添加结果', res)
vant.Toast({
message: res.code === 200 ? '操作成功': '操作失败',
message: res.code === 200 ? '操作成功' : '操作失败',
})
location.reload()
})
......@@ -235,8 +235,7 @@ window.addEventListener("load", function () {
loadingType: 'spinner',
})
setTimeout(() => {
http2.post(
{
http2.post({
serviceId: API_KEY_MAP['no-page']['id'],
interfacePublicKey: API_KEY_MAP['no-page']['publicKey'],
interfacePrivateKey: API_KEY_MAP['no-page']['privateKey'],
......@@ -262,8 +261,9 @@ window.addEventListener("load", function () {
var result = JSON.parse(res)
// 图片数据结构处理
let tempData = result.data
if(tempData['images']){
tempData['images'] = tempData['images'] ? tempData['images'].split(',') : []
if (tempData['images']) {
tempData['images'] = tempData['images'] ? tempData[
'images'].split(',') : []
}
this.formData = tempData
......
src/_peixun_yanlian_detail-yingji.css
View file @ ffd017f1
......@@ -314,6 +314,33 @@ body {
transform: translateY(-50%);
}
.selector {
width: 4rem;
height: 0.6rem;
font-size: 0.3rem;
border: 1px solid #d7d7d7;
background-color: #fff;
}
input:disabled {
background-color: #fff;
color: #9b9fab;
}
select:disabled {
border: none;
/* 移除默认箭头 */
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
/* 调整右侧内边距，防止文字溢出 */
padding-right: 25px;
/* 可选：统一背景色 */
background-color: white;
}
.form-label-div {
height: 50px;
line-height: 50px;
......
src/_peixun_yanlian_detail-yingji.html
View file @ ffd017f1
......@@ -19,21 +19,22 @@
<div class="form-item">
<span class="form-label title_require">演练标题</span>
<div class="form-input-wrap">
<input type="text" v-model="formData.contactName" :disabled="flag=='XQ'" class="form-input"
<input type="text" v-model="formData.title" :disabled="flag=='XQ'" class="form-input"
placeholder="">
</div>
</div>
<div class="form-item">
<span class="form-label title_require">演练人数(人)</span>
<div class="form-input-wrap">
<input type="text" v-model="formData.contactDetails" :disabled="flag=='XQ'"
<input type="text" v-model="formData.participantsNum" :disabled="flag=='XQ'"
class="form-input" placeholder="">
</div>
</div>
<div class="form-item">
<span class="form-label title_require">负责人</span>
<div class="form-input-wrap">
<input type="text" v-model="formData.contactDetails" :disabled="flag=='XQ'"
<input type="text" v-model="formData.responsiblePerson" :disabled="flag=='XQ'"
class="form-input" placeholder="">
</div>
</div>
......@@ -43,7 +44,7 @@
<span class="form-label title_require">演练日期</span>
<div class="form-input-wrap">
<van-field readonly v-model="formData.date" :disabled="flag=='XQ'" placeholder=""
<van-field readonly v-model="formData.exerciseDate" :disabled="flag=='XQ'" placeholder=""
class="form-input" @click="showDatePickerModal" />
</div>
......@@ -53,33 +54,29 @@
@confirm="onDateConfirm" @cancel="showDatePicker = false" />
</van-popup>
<!-- 详情模式 -->
<div class="form-label form-label-div">演练照片</div>
<div class="img-wrapper">
<div style="position: relative;" v-for="(imgItem, index) in formData.floorPlanPhotos">
<div style="position: relative;" v-for="(imgItem, index) in formData.images">
<img :src="previewUrl + imgItem" style="width: 1.6rem; height: 1.6rem;"
@click="showImage(formData.floorPlanPhotos, index)" />
@click="showImage(formData.images, index)" />
<div v-if="flag=='XG'" class="van-uploader__preview-delete"
@click="handleDeleteFloorPlan(index, 'floorPlan')"><i
class="van-icon van-icon-cross van-uploader__preview-delete-icon"></i></div>
</div>
<div v-if="formData.floorPlanPhotos.length<6 && flag=='ADD' ">
<div v-if="formData.images.length<6 && flag=='ADD' ">
<van-uploader :before-read="beforeRead" :after-read="(file) => afterRead(file, 'floorPlan')"
class="uploader-wrapper" :deletable="false" :preview-image="false"
>
class="uploader-wrapper" :deletable="false" :preview-image="false">
<img src="../image/code/upload.png" style="width:1.6rem;height: 1.6rem;" alt=""
srcset="">
</van-uploader>
</div>
</div>
<!-- form结束 -->
<button class="save-btn" style="margin-left: 50%; transform: translateX(-50%);"
<button class="save-btn" style="margin-left: 50%; transform: translateX(-50%);" v-if="!formData.id"
@click="submitForm">提交</button>
</div>
</div>
</div>
</body>
......
src/_peixun_yanlian_detail-yingji.js
View file @ ffd017f1
......@@ -4,22 +4,23 @@
* description: 商户首页
*/
var VUE = null
window.addEventListener("load", function () {
window.addEventListener("load", function() {
VUE = new Vue({
el: '#app',
data() {
return {
previewUrl: BASE_URL,
previewUrl: axios.defaults.baseURL,
flag: 'XQ',
flag: 'ADD',
showDatePicker: false, // 控制日期选择器显示
minDate: new Date(gemhoUtil.getTargetDateYMD()), // 最小可选日期
maxDate: new Date(2099, 11, 31), // 最大可选日期
tabList4lv2: [],
// 日期选择的最小范围，这里设置为当前日期的前 10 年
// maxDate: new Date(new Date().getFullYear() + 10, 11),
// 新增以下数据
formData: {
floorPlanPhotos: '',
images: [],
submitDate: gemhoUtil.getTargetDateYMD(),
createDate: gemhoUtil.getTargetDateYMD(),
date: gemhoUtil.getTargetDateYMD(),
......@@ -35,28 +36,20 @@ window.addEventListener("load", function () {
},
mounted() {
this.id = gemhoUtil.getParameter('id')
if(this.id){ // 详情
if (this.id) { // 详情
this.flag = 'XQ'
this.detail() // 获取商户信息
}else{
} else {
this.flag = 'ADD'
}
},
// watch: {
// 'formData.date': {
// handler(newVal) {
// console.log('date 属性变化:', newVal);
// },
// deep: true // 深度监听对象属性
// }
// },
methods: {
// 处理平面图删除
handleDeleteFloorPlan(index, type) {
this.formData.floorPlanPhotos.splice(index, 1);
this.formData.images.splice(index, 1);
},
beforeRead(file) {
if(!['image/png','image/jpeg','image/jpg'].includes(file.type)){
if (!['image/png', 'image/jpeg', 'image/jpg'].includes(file.type)) {
vant.Dialog.alert({
title: '信息提示',
message: '文件格式不正确'
......@@ -84,11 +77,11 @@ window.addEventListener("load", function () {
// formData.append('biz_content',SM.encrypt('dangerjob', API_KEY_MAP["upload"]["publicKey"]));
// 发送HTTP POST请求
fetch(BASE_URL + '/common/upload', {
fetch(axios.defaults.baseURL + '/common/upload', {
method: 'POST',
body: formData,
headers: {
'Authorization': gemhoUtil.getCookie('token'),
'Authorization': axios.defaults.headers.common['Authorization'],
}
})
.then(response => {
......@@ -99,13 +92,13 @@ window.addEventListener("load", function () {
})
.then(value => {
console.log(value, 'value图片上********'); // 处理后端返回的数据
if(value){ // 返回信息不为空，则进行解密操作
this.formData.floorPlanPhotos.push(value.fileName)
if (value) { // 返回信息不为空，则进行解密操作
this.formData.images.push(value.fileName)
// 可根据后端返回的数据做进一步处理，如显示上传成功信息等
setTimeout(() => {
vant.Toast.clear()
}, 0);
}else{
} else {
this.afterRead(file)
}
})
......@@ -113,14 +106,14 @@ window.addEventListener("load", function () {
// console.error('There has been a problem with your fetch operation:', error);
});
},
showDatePickerModal(){
if(this.flag=='XQ'){
showDatePickerModal() {
if (this.flag == 'XQ') {
return
}
this.showDatePicker = true
},
showImage(list, index) {
const images = list.map((item)=>{
const images = list.map((item) => {
return this.previewUrl + item
})
console.log(images, 'images')
......@@ -140,7 +133,7 @@ window.addEventListener("load", function () {
const year = date.getFullYear();
const month = String(date.getMonth() + 1).padStart(2, '0');
const day = String(date.getDate()).padStart(2, '0');
this.formData.date = `${year}-${month}-${day}`;
this.formData.exerciseDate = `${year}-${month}-${day}`;
this.showDatePicker = false;
},
......@@ -151,31 +144,25 @@ window.addEventListener("load", function () {
},
submitForm() {
if (!this.formData.content) {
if (!this.formData.title) {
vant.Dialog.alert({
message: '培训标题不可为空',
message: '演练标题不可为空',
})
return;
}
if (!this.formData.content) {
if (!this.formData.participantsNum) {
vant.Dialog.alert({
message: '培训演练类别不可为空',
message: '负责人数不可为空',
})
return;
}
if (!this.formData.content) {
if (!this.formData.responsiblePerson) {
vant.Dialog.alert({
message: '培训人数不可为空',
message: '负责人不可为空',
})
return;
}
if (!this.formData.content) {
vant.Dialog.alert({
message: '培训人不可为空',
})
return;
}
if (!this.formData.content) {
if (!this.formData.images.length) {
vant.Dialog.alert({
message: '图片不可为空',
})
......@@ -187,15 +174,16 @@ window.addEventListener("load", function () {
loadingType: 'spinner',
});
var reqParam = {
merId: this.merId,
merId: gemhoUtil.getParameter('merId'),
exerciseType: '1', // 安全演练
...this.formData,
}
// var url = "/gq/checkRecord/safeCheckRecord"
reqParam.images = this.formData.images.join(',')
http3.post('/gq/consumer', reqParam).then((res) => {
http3.post('/gaoqu/exercise', reqParam).then((res) => {
console.log('添加结果', res)
vant.Toast({
message: '操作成功',
message: res.code === 200 ? '操作成功' : '操作失败',
})
location.reload()
})
......@@ -208,20 +196,20 @@ window.addEventListener("load", function () {
loadingType: 'spinner',
})
setTimeout(() => {
http2.post(
{
http2.post({
serviceId: API_KEY_MAP['no-page']['id'],
interfacePublicKey: API_KEY_MAP['no-page']['publicKey'],
interfacePrivateKey: API_KEY_MAP['no-page']['privateKey'],
reqParams: {
sign: 11,
sign: 31,
pageNum: this.page++, // 每次请求增加下一页
pageSize: this.size,
merId: this.merId,
exerciseId: this.id,
sort: 'lawId,desc',
},
},
(res) => {
console.log('res', JSON.parse(res))
if (!res) {
// 中台返回为undefined 重新请求
vant.Toast.clear()
......@@ -232,7 +220,14 @@ window.addEventListener("load", function () {
}
if (res) {
var result = JSON.parse(res)
this.formData = { ...this.formData, ...result.data }
// 图片数据结构处理
let tempData = result.data
if (tempData['images']) {
tempData['images'] = tempData['images'] ? tempData[
'images'].split(',') : []
}
this.formData = tempData
}
}
)
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment