将cshtml换成html文件, 整理文件结构
This commit is contained in:
范露尧
@@ -0,0 +1,591 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>
|
||||
宁波既有建筑外墙脱落问卷调查
|
||||
</title>
|
||||
<script src="../../lib/vue/vue.global.prod.min.js"></script>
|
||||
<link href="../../lib/element-plus/index.min.css" rel="stylesheet" />
|
||||
<script src="../../lib/element-plus/index.full.min.js"></script>
|
||||
<script src="../../lib/element-plus/locale/zh-cn.min.js"></script>
|
||||
<script src="../../lib/element-plus-icons-vue/global.iife.min.js"></script>
|
||||
<script src="../../lib/xe-utils/dist/xe-utils.umd.min.js"></script>
|
||||
<script src="../../lib/axios/axios.min.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app">
|
||||
<h3 style="text-align:center;">宁波既有建筑外墙脱落问卷调查</h3>
|
||||
<el-form ref="formRef" :model="pageData.form" label-position="left" require-asterisk-position="right" label-width="160px" style="margin-top:15px;">
|
||||
<el-form-item label="1.社区/小区名：" prop="communityId" :rules="[{ required: true, trigger: 'blur', message: '请选择社区/小区' }]">
|
||||
<el-select v-model="pageData.communityItem" filterable clearable placeholder="请选择" @change="(v,v2)=>funHandles.onChangeSelectCommunity(v,pageData)" style="width:100%">
|
||||
<el-option v-for="item in pageData.communitys" :key="item.id" :label="item.name" :value="JSON.stringify(item)">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="2.小区交付年份：" prop="deliveryear" :rules="[{ required: false, trigger: 'blur', message: '请输入交付年份' }]">
|
||||
<el-date-picker v-model="pageData.form.deliveryear" type="date" value-format="YYYY-MM-DD" style="width:100%" />
|
||||
</el-form-item>
|
||||
<!--@*<el-form-item label="物业单位：" prop="hangye">
|
||||
<el-input v-model="form.hangye"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="开发商：" prop="hangye">
|
||||
<el-input v-model="form.hangye"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="施工单位：" prop="hangye">
|
||||
<el-input v-model="form.hangye"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="设计单位：" prop="hangye">
|
||||
<el-input v-model="form.hangye"></el-input>
|
||||
</el-form-item>*@-->
|
||||
<el-form-item label="3.外墙结构：" prop="outsidewallstructurefiles">
|
||||
<el-upload class="upload-demo" drag multiple
|
||||
action="/gb/yjb/api/outsidewall/sysFileInfo/upload"
|
||||
auto-upload
|
||||
list-type="picture-card"
|
||||
v-model:file-list="pageData.fileList"
|
||||
:on-preview="(file)=>funHandles.filePreview(file,pageData.fileList)"
|
||||
:on-remove="(file, fileList)=>{return funHandles.fileRemove(file, fileList)}"
|
||||
:on-success="(response, file, fileList)=>{return funHandles.fileChange(response, file, fileList)}">
|
||||
<!--<i class="el-icon-upload"></i>-->
|
||||
<div class="el-upload__text"><em>上传外墙照片</em></div>
|
||||
<div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<el-form-item label="4.楼栋数：" prop="buildcount">
|
||||
<el-input-number v-model="pageData.form.buildcount"></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="5.住户总数：" prop="householdcount" :rules="[{ required: false, trigger: 'blur', message: '请输入住户总数' }]">
|
||||
<el-input-number v-model="pageData.form.householdcount"></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="6.总建筑面积：" prop="totalfloorage" :rules="[{ required: true, trigger: 'blur', message: '请输入总建筑面积' }]">
|
||||
<el-input-number v-model="pageData.form.totalfloorage" :precision="2" :step="1"></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="7.是否存在外墙问题：" prop="isExistProblem" :rules="[{ required: true, trigger: 'blur', message: '请选择是否' }]">
|
||||
<el-radio-group v-model="pageData.form.isExistProblem">
|
||||
<el-radio-button label="1" border>是</el-radio-button>
|
||||
<el-radio-button label="0" border>否</el-radio-button>
|
||||
</el-radio-group>
|
||||
<span style="margin-left: 20px; color: #909399">例如：漏水、开裂、脱落</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="8.楼栋信息：" v-show="pageData?.form?.isExistProblem=='1'">
|
||||
<el-select v-model="pageData.buildingItemId" filterable clearable placeholder="请选择" style="width:100%">
|
||||
<el-option v-for="item in pageData.buildings" :key="item.id" :label="item.buildingName" :value="item.id">
|
||||
<span style="float: left">{{ item.buildingName }}</span>
|
||||
<span style="float: right;color: var(--el-text-color-secondary);font-size: 11px;">{{ item.address }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
<div v-for="buildingItem in pageData.form.buildings" v-show="buildingItem?.id==pageData.buildingItemId">
|
||||
<el-space wrap alignment="start" style="margin:20px 0">
|
||||
<div style="width:350px"><label style="color: #606266; display:inline-block;width: 80px">地址：</label>{{ XEUtils.find(pageData.buildings, item => item.id === pageData.buildingItemId)?.address }}</div>
|
||||
<div style="width:350px"><label style="color: #606266; display:inline-block;width:80px">幢名称：</label>{{ XEUtils.find(pageData.buildings, item => item.id === pageData.buildingItemId)?.buildingName }}</div>
|
||||
<div style="width:350px"><label style="color: #606266; display:inline-block;width:80px">层数：</label>{{ XEUtils.find(pageData.buildings, item => item.id === pageData.buildingItemId)?.levelCount }}</div>
|
||||
<div style="width:350px"><label style="color: #606266; display:inline-block;width:80px">总户数：</label>{{ XEUtils.find(pageData.buildings, item => item.id === pageData.buildingItemId)?.houseHolds }}</div>
|
||||
<div style="width:350px"><label style="color: #606266; display:inline-block;width:80px">建设单位：</label>{{ XEUtils.find(pageData.buildings, item => item.id === pageData.buildingItemId)?.buildingUnit }}</div>
|
||||
<div style="width:350px"><label style="color: #606266; display:inline-block;width:80px">设计单位：</label>{{ XEUtils.find(pageData.buildings, item => item.id === pageData.buildingItemId)?.desingerUnit }}</div>
|
||||
<div style="width:350px"><label style="color: #606266; display:inline-block;width:80px">施工单位：</label>{{ XEUtils.find(pageData.buildings, item => item.id === pageData.buildingItemId)?.constructionUnit }}</div>
|
||||
<div style="width:350px"><label style="color: #606266; display:inline-block;width:80px">监理单位：</label>{{ XEUtils.find(pageData.buildings, item => item.id === pageData.buildingItemId)?.monitorUnit }}</div>
|
||||
<div style="width:350px"><label style="color: #606266; display:inline-block;width:80px">物业单位：</label>{{ XEUtils.find(pageData.buildings, item => item.id === pageData.buildingItemId)?.wuYeUnit }}</div>
|
||||
</el-space>
|
||||
<el-form ref="childFormRef" :model="buildingItem" label-position="top" inline-message>
|
||||
<el-form-item prop="curwallproblems" label="8.1 墙体问题的类型是" :rules="[{ required: true, trigger: ['change', 'blur'], message: '请选择墙体问题' }]">
|
||||
<el-checkbox-group v-model="buildingItem.curwallproblems">
|
||||
<el-checkbox v-for="w in staticData.wallproblems" :label="w" :key="w">{{w}}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
<el-input type="textarea" autosize placeholder="请输入其他问题" v-model="buildingItem.curwallproblemother" v-if="XEUtils.indexOf(buildingItem.curwallproblems, '其他问题')!=-1"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="8.2 哪个问题最先开始出现？" v-if="buildingItem?.curwallproblems?.length>1">
|
||||
<el-radio-group v-model="buildingItem.wallproblemsfirst">
|
||||
<el-radio v-for="w in staticData.wallproblems" :label="w">{{w}}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item prop="firstproblemdate" label="8.3 第一次出现墙体问题是建成后____年？" :rules="[{ required: true, trigger: ['change', 'blur'], message: '请选择第一次出现墙体问题时间' }]">
|
||||
<el-radio-group v-model="buildingItem.firstproblemdate">
|
||||
<el-radio label="建成后0-5年">建成后0-5年</el-radio>
|
||||
<el-radio label="建成后6-10年">建成后6-10年</el-radio>
|
||||
<el-radio label="建成后11-15年">建成后11-15年</el-radio>
|
||||
<el-radio label="建成后15年以上">建成后15年以上</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item prop="problemfrequency" label="8.4 墙体脱落发生频率如何？" :rules="[{ required: true, trigger: ['change', 'blur'], message: '请选择墙体脱落发生频率' }]">
|
||||
<el-radio-group v-model="buildingItem.problemfrequency">
|
||||
<el-radio label="1年1-2次">1年1-2次</el-radio>
|
||||
<el-radio label="1年3-5次">1年3-5次</el-radio>
|
||||
<el-radio label="1年5次以上">1年5次以上</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item prop="problemseason" label="8.5 问题多发生在哪个季节？" :rules="[{ required: true, trigger: ['change', 'blur'], message: '请选择问题发生季节' }]">
|
||||
<el-checkbox-group v-model="buildingItem.problemseason">
|
||||
<el-checkbox label="春" key="春">春</el-checkbox>
|
||||
<el-checkbox label="夏" key="夏">夏</el-checkbox>
|
||||
<el-checkbox label="秋" key="秋">秋</el-checkbox>
|
||||
<el-checkbox label="冬" key="冬">冬</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<el-form-item prop="wallproblemtoward" label="8.6 墙体问题发生的朝向是哪面？" :rules="[{ required: true, trigger: ['change', 'blur'], message: '请选择问题发生朝向' }]">
|
||||
<el-checkbox-group v-model="buildingItem.wallproblemtoward">
|
||||
<el-checkbox label="东" key="东">东</el-checkbox>
|
||||
<el-checkbox label="西" key="西">西</el-checkbox>
|
||||
<el-checkbox label="南" key="南">南</el-checkbox>
|
||||
<el-checkbox label="北" key="北">北</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="8.7 问题照片：">
|
||||
<el-upload class="upload-demo" drag multiple
|
||||
action="/gb/yjb/api/outsidewall/sysFileInfo/upload"
|
||||
auto-upload
|
||||
list-type="picture-card"
|
||||
v-model:file-list="pageData.childFileList1"
|
||||
:on-preview="(file)=>funHandles.filePreview(file,pageData.childFileList1)"
|
||||
:on-remove="(file, fileList)=>funHandles.fileChildRemove(file, fileList,buildingItem)"
|
||||
:on-success="(response, file, fileList)=>funHandles.fileChildChange(response, file, fileList, buildingItem,'东')"
|
||||
style="width:100%">
|
||||
<!--<i class="el-icon-upload"></i>-->
|
||||
<div class="el-upload__text"><em>上传东面照片</em></div>
|
||||
<div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
</el-upload>
|
||||
|
||||
<el-upload class="upload-demo" drag multiple
|
||||
action="/gb/yjb/api/outsidewall/sysFileInfo/upload"
|
||||
auto-upload
|
||||
list-type="picture-card"
|
||||
v-model:file-list="pageData.childFileList2"
|
||||
:on-preview="(file)=> funHandles.filePreview(file,pageData.childFileList2)"
|
||||
:on-remove="(file, fileList)=>funHandles.fileChildRemove(file, fileList,buildingItem)"
|
||||
:on-success="(response, file, fileList)=>funHandles.fileChildChange(response, file, fileList, buildingItem,'西')"
|
||||
style="width:100%">
|
||||
<!--<i class="el-icon-upload"></i>-->
|
||||
<div class="el-upload__text"><em>上传西面照片</em></div>
|
||||
<div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
</el-upload>
|
||||
<el-upload class="upload-demo" drag multiple
|
||||
action="/gb/yjb/api/outsidewall/sysFileInfo/upload"
|
||||
auto-upload
|
||||
list-type="picture-card"
|
||||
v-model:file-list="pageData.childFileList3"
|
||||
:on-preview="(file)=> funHandles.filePreview(file,pageData.childFileList3)"
|
||||
:on-remove="(file, fileList)=>funHandles.fileChildRemove(file, fileList,buildingItem)"
|
||||
:on-success="(response, file, fileList)=>funHandles.fileChildChange(response, file, fileList, buildingItem,'南')"
|
||||
style="width:100%">
|
||||
<i class="el-icon-upload"></i>
|
||||
<div class="el-upload__text"><em>上传南面照片</em></div>
|
||||
<div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
</el-upload>
|
||||
<el-upload class="upload-demo" drag multiple
|
||||
action="/gb/yjb/api/outsidewall/sysFileInfo/upload"
|
||||
auto-upload
|
||||
list-type="picture-card"
|
||||
v-model:file-list="pageData.childFileList4"
|
||||
:on-preview="(file)=>funHandles.filePreview(file,pageData.childFileList4)"
|
||||
:on-remove="(file, fileList)=>funHandles.fileChildRemove(file, fileList,buildingItem)"
|
||||
:on-success="(response, file, fileList)=>funHandles.fileChildChange(response, file, fileList, buildingItem,'北')"
|
||||
style="width:100%">
|
||||
<i class="el-icon-upload"></i>
|
||||
<div class="el-upload__text"><em>上传北面照片</em></div>
|
||||
<div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<el-form-item prop="problemfanwei" label="8.8 发生外墙问题的范围有多大？" :rules="[{ required: true, trigger: ['change', 'blur'], message: '请选择外墙问题的范围' }]">
|
||||
<el-radio-group v-model="buildingItem.problemfanwei">
|
||||
<el-radio label="＜外墙面积的25%"></el-radio>
|
||||
<el-radio label="外墙面积的25-50%"></el-radio>
|
||||
<el-radio label="外墙面积的50-75%"></el-radio>
|
||||
<el-radio label="外墙面积的75-100%"></el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item prop="problemheight" label="8.9 外墙问题发生在哪个高度？" :rules="[{ required: true, trigger: ['change', 'blur'], message: '请选择外墙问题发生的高度' }]">
|
||||
<el-checkbox-group v-model="buildingItem.problemheight">
|
||||
<el-checkbox label="底层（楼高1/3以下）"></el-checkbox>
|
||||
<el-checkbox label="中层"></el-checkbox>
|
||||
<el-checkbox label="高层（屋顶往下1/3）"></el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<el-form-item prop="diaoluowu" label="8.10 掉落物是什么？" :rules="[{ required: true, trigger: ['change', 'blur'], message: '请选择掉落物' }]">
|
||||
<el-checkbox-group v-model="buildingItem.diaoluowu">
|
||||
<el-checkbox label="墙皮材料"></el-checkbox>
|
||||
<el-checkbox label="保温材料"></el-checkbox>
|
||||
<el-checkbox label="混凝土块"></el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item prop="problemismodify" label="14.问题发生后是否请人修复了？" v-if="pageData?.form?.isExistProblem=='1'" :rules="[{ required: true, trigger: ['blur'], message: '请选择问题发生后是否请人修复' }]">
|
||||
<el-radio-group v-model="pageData.form.problemismodify">
|
||||
<el-radio label="1">是</el-radio>
|
||||
<el-radio label="0">否</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="15.请提供修复单位的名称:" v-if="pageData.form?.problemismodify=='1'">
|
||||
<el-input type="textarea" autosize placeholder="请提供修复单位的名称。" v-model="pageData.form.problemmodifyunitname">
|
||||
rm
|
||||
</el-form-item>
|
||||
<el-form-item label="16.修复后的部位是否再次发生问题？" v-if="pageData.form?.problemismodify=='1'">
|
||||
<el-radio-group v-model="pageData.form.problemmodifyisagain">
|
||||
<el-radio label="1">有再发生</el-radio>
|
||||
<el-radio label="0">没有</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="">
|
||||
20.若您愿意接受我们的现场调查，请惠赐您的联系方式。谢谢！
|
||||
<el-input type="textarea" autosize placeholder="" v-model="pageData.form.contract">
|
||||
</el-form-item>
|
||||
<!--@*<el-form-item label="手机号码：" prop="phone" :rules="[{ validator: checkPhone, required: true, trigger: 'blur' }]">
|
||||
<el-input v-model="form.phone"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="验证码" prop="code" v-if="!isshowmyinfo" :rules="[{ validator: checkCode, required: true, trigger: 'blur' }]">
|
||||
<el-input type="text" maxlength="4" placeholder="验证码" v-model="form.code">
|
||||
<template slot="append">
|
||||
<el-button :disabled="disabled" @click="getCode">{{ valiBtn }}</el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
</el-form-item>*@-->
|
||||
<el-form-item v-if="!isshowmyinfo">
|
||||
<el-button type="primary" @click.prevent="funHandles.onSubmit(formRef,childFormRef,pageData)"> 提 交 </el-button>
|
||||
<!--<el-button @click.prevent="showinfo()">我的报名</el-button>-->
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-image-viewer v-if="pageData.dialogImageUrl"
|
||||
:zIndex="8000"
|
||||
@close="() => { pageData.dialogImageUrl='' }"
|
||||
:url-list="pageData.dialogImageUrls"
|
||||
:initial-index="XEUtils.indexOf(pageData.dialogImageUrls, pageData.dialogImageUrl)"></el-image-viewer>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript">
|
||||
const { createApp, onMounted, watch, computed, ref } = Vue
|
||||
const { ElMessageBox, ElNotification, ElLoading } = ElementPlus;
|
||||
|
||||
const app = createApp({
|
||||
setup() {
|
||||
const formRef = ref();
|
||||
const childFormRef = ref();
|
||||
|
||||
const pageData = ref({
|
||||
form: {},
|
||||
//communitys: [],
|
||||
//buildings: [],
|
||||
//buildingItemId: ''
|
||||
});
|
||||
|
||||
const rulesCheckData = {
|
||||
checkPhone: (rule, value, callback) => {
|
||||
const regMobile = /^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{8}$/;
|
||||
if (regMobile.test(value)) {
|
||||
callback()
|
||||
}
|
||||
callback(new Error("请输入正确的手机号码"))
|
||||
},
|
||||
checkCode: (rule, value, callback) => {
|
||||
if (value === "") {
|
||||
callback(new Error("请输入验证码"))
|
||||
} else if (!/^[0-9]+$/.test(value) || !/^\d{4}$/.test(value)) {
|
||||
callback(new Error("请输入4位数字的验证码"))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
checkNumber: (rule, value, callback) => {
|
||||
if (value === "") {
|
||||
callback(new Error("不能为空"))
|
||||
} else if (!/^[0-9]+$/.test(value)) {
|
||||
callback(new Error("必需为数字"))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
checkCardNo: (rule, value, callback) => {
|
||||
const regMobile = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
|
||||
if (regMobile.test(value)) {
|
||||
callback()
|
||||
}
|
||||
callback(new Error("请输入正确的身份证号码"))
|
||||
}
|
||||
};
|
||||
const staticData = { wallproblems: ['漏水', '开裂', '脱落', '空鼓', '其他问题'] };
|
||||
const funHandles = {
|
||||
init: async (data) => {
|
||||
do {
|
||||
data.key = await funHandles.verifyKey();
|
||||
} while (!data.key);
|
||||
|
||||
data.communitys = await funHandles.getCommunitys();
|
||||
},
|
||||
verifyKey: async () => {
|
||||
const key = await ElMessageBox.prompt('请输入授权码', {
|
||||
title: '授权',
|
||||
inputPlaceholder: '授权码',
|
||||
draggable: true,
|
||||
showClose: false,
|
||||
showCancelButton: false,
|
||||
closeOnClickModal: false,
|
||||
closeOnPressEscape: false,
|
||||
inputErrorMessage: '请输入授权码',
|
||||
})
|
||||
try {
|
||||
window.loadingInstance = ElLoading.service({ lock: true, text: '处理中' });
|
||||
const response = await axios({
|
||||
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
|
||||
method: 'post',
|
||||
url: `/gb/yjb/api/outsidewall/VerifyKey?key=${key?.value ?? ''}`,
|
||||
responseType: "json",
|
||||
});
|
||||
window.loadingInstance?.close();
|
||||
if (response.data.data)
|
||||
return key?.value;
|
||||
else {
|
||||
await ElMessageBox.alert("授权码错误,授权失败", '授权', { type: 'error' });
|
||||
}
|
||||
} catch (error) {
|
||||
window.loadingInstance?.close();
|
||||
console.log(error)
|
||||
await ElMessageBox.alert(error.message, '异常', { type: 'error' });
|
||||
window.location.reload();//刷新当前页面
|
||||
}
|
||||
},
|
||||
getCommunitys: async (queryString) => {
|
||||
try {
|
||||
window.loadingInstance = ElLoading.service({ lock: true, text: '加载中' });
|
||||
|
||||
const response = await axios({
|
||||
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
|
||||
method: 'get',
|
||||
url: `/gb/yjb/api/outsidewall/Communitys?searchkey=${queryString ?? ''}`,
|
||||
responseType: "json",
|
||||
});
|
||||
window.loadingInstance?.close();
|
||||
return response.data.data;
|
||||
} catch (error) {
|
||||
window.loadingInstance?.close();
|
||||
console.log(error)
|
||||
ElMessageBox.alert(error.message, '异常', { type: 'error' });
|
||||
}
|
||||
},
|
||||
onChangeSelectCommunity: async (v, data) => {
|
||||
//debugger;
|
||||
if (v) {
|
||||
const { name, id } = JSON.parse(v)
|
||||
try {
|
||||
window.loadingInstance = ElLoading.service({ lock: true, text: '加载中' });
|
||||
|
||||
const response = (window.cacheCommunitysData && window.cacheCommunitysData[id]) ?? await axios({
|
||||
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
|
||||
method: 'get',
|
||||
url: '/gb/yjb/api/outsidewall/Community/' + id,
|
||||
responseType: "json",
|
||||
});
|
||||
window.loadingInstance?.close();
|
||||
|
||||
if (!window.cacheCommunitysData) window.cacheCommunitysData = [];
|
||||
if (!window.cacheCommunitysData[id]) window.cacheCommunitysData[id] = response;
|
||||
|
||||
data.buildings = response.data.data;
|
||||
if (!data.form) data.form = {};
|
||||
data.form.communityId = id;
|
||||
data.form.communityName = name;
|
||||
data.form.buildings = response.data.data?.map(x => (
|
||||
{
|
||||
id: x.id,
|
||||
address: x.address,
|
||||
buildingName: x.buildingName,
|
||||
levelCount: x.levelCount,
|
||||
houseHolds: x.houseHolds,
|
||||
buildingUnit: x.buildingUnit,
|
||||
desingerUnit: x.desingerUnit,
|
||||
constructionUnit: x.constructionUnit,
|
||||
monitorUnit: x.monitorUnit,
|
||||
wuYeUnit: x.wuYeUnit,
|
||||
}
|
||||
)) ?? [];
|
||||
data.form.buildcount = data.buildings.length;//楼栋数
|
||||
data.form.householdcount = data.buildings.reduce((a, key) => { return a + key.houseHolds }, 0);//住户总数
|
||||
data.form.totalfloorage = data.buildings.reduce((a, key) => { return a + key.areaCount }, 0);//总建筑面积
|
||||
} catch (error) {
|
||||
window.loadingInstance?.close();
|
||||
console.log(error)
|
||||
ElMessageBox.alert(error.message, '异常', { type: 'error' });
|
||||
}
|
||||
} else {
|
||||
data.buildings = [];
|
||||
data.form = {}
|
||||
}
|
||||
},
|
||||
onSubmit: (formEl, childFormEl, data) => {
|
||||
console.log('submit!');
|
||||
formEl.validate(async (valid) => {
|
||||
if (valid) {
|
||||
let isAllChildValid = false;
|
||||
if (data?.form?.isExistProblem == '0') { isAllChildValid = true; }
|
||||
else {
|
||||
const fromMerges = childFormEl.map((x, ii) => ({ formEl: x, building: data.form.buildings[ii] }));
|
||||
|
||||
const validateFroms = [].concat(fromMerges.filter(x => x.building.id == data.buildingItemId), fromMerges.filter(x => x.building.curwallproblems?.length > 0));
|
||||
|
||||
if (validateFroms.length > 0) {
|
||||
for (let ii = 0; ii < validateFroms.length; ii++) {
|
||||
const isValid = await validateFroms[ii].formEl.validate(valid => {
|
||||
if (!valid) {
|
||||
data.buildingItemId = validateFroms[ii].building.id;
|
||||
}
|
||||
});
|
||||
if (!isValid) {
|
||||
ElMessageBox.alert('幢信息问卷未填写完整', '提示', { type: 'warning' });
|
||||
return;
|
||||
}
|
||||
}
|
||||
isAllChildValid = true;
|
||||
}
|
||||
else {
|
||||
ElMessageBox.alert('存在问题请展开幢信息进行问卷填写', '提示', { type: 'warning' });
|
||||
}
|
||||
}
|
||||
|
||||
if (isAllChildValid) {
|
||||
ElMessageBox.confirm('确定提交吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(async () => {
|
||||
|
||||
window.loadingInstance = ElLoading.service({ lock: true, text: '提交中...请稍候' });
|
||||
try {
|
||||
const response = await axios({
|
||||
headers: { 'Content-Type': 'multipart/form-data' },
|
||||
method: 'post',
|
||||
url: `/gb/yjb/api/outsidewall/submit?key=${data.key ?? ''}`,
|
||||
data: data.form,
|
||||
responseType: "json",
|
||||
});
|
||||
window.loadingInstance?.close();
|
||||
|
||||
//debugger;
|
||||
if (response.data?.success == true) {
|
||||
await ElMessageBox.alert('提交成功', '成功', { type: 'success' });
|
||||
window.location.reload();//刷新当前页面
|
||||
} else {
|
||||
ElMessageBox.alert(response.data.message, '异常', { type: 'error' });
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
window.loadingInstance?.close();
|
||||
ElMessageBox.alert(error.message, '异常', { type: 'error' });
|
||||
}
|
||||
}).catch(() => { });
|
||||
}
|
||||
}
|
||||
else {
|
||||
ElMessageBox.alert("社区信息问卷未填写完整", '提示', { type: 'warning' });
|
||||
}
|
||||
});
|
||||
},
|
||||
fileChange: (response, file, fileList) => {
|
||||
if (response.success == false) {
|
||||
ElMessageBox.alert('上传失败,请稍候重试', '异常', { type: 'error' });
|
||||
return;
|
||||
}
|
||||
if (file.response) {
|
||||
if (!pageData.value.form.fileList) pageData.value.form.fileList = [];
|
||||
pageData.value.form.fileList.push(file.response.data);
|
||||
}
|
||||
},
|
||||
fileRemove: async (file, fileList) => {
|
||||
console.log(file, fileList);
|
||||
window.loadingInstance = ElLoading.service({ lock: true, text: '处理中' });
|
||||
try {
|
||||
const response = await axios({
|
||||
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
|
||||
method: 'get',
|
||||
url: '/gb/yjb/api/outsidewall/sysFileInfo/delete/' + file.response.data,
|
||||
responseType: "json",
|
||||
});
|
||||
|
||||
if (file.response && pageData.value.form.fileList) {
|
||||
pageData.value.form.fileList = pageData.value.form.fileList.filter((a) => { return a != file.response.data });
|
||||
}
|
||||
//}
|
||||
|
||||
window.loadingInstance?.close();
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
window.loadingInstance?.close();
|
||||
}
|
||||
},
|
||||
fileChildChange: (response, file, fileList, scope, toward) => {
|
||||
if (response.success == false) {
|
||||
ElMessageBox.alert('上传失败,请稍候重试', '异常', { type: 'error' });
|
||||
return;
|
||||
}
|
||||
|
||||
if (file.response) {
|
||||
var _pf = {
|
||||
file: file.response.data,
|
||||
toward: toward
|
||||
}
|
||||
if (!scope.problemfiles) scope.problemfiles = [];
|
||||
scope.problemfiles.push(_pf)
|
||||
}
|
||||
},
|
||||
fileChildRemove: async (file, fileList, scope) => {
|
||||
console.log(file, fileList);
|
||||
window.loadingInstance = ElLoading.service({ lock: true, text: '处理中' });
|
||||
try {
|
||||
const response = await axios({
|
||||
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
|
||||
method: 'get',
|
||||
url: '/gb/yjb/api/outsidewall/sysFileInfo/delete/' + file.response.data,
|
||||
responseType: "json",
|
||||
});
|
||||
|
||||
if (file.response && scope.problemfiles) {
|
||||
scope.problemfiles = scope.problemfiles.filter((a) => { return a.file != file.response.data });
|
||||
}
|
||||
|
||||
window.loadingInstance?.close();
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
window.loadingInstance?.close();
|
||||
}
|
||||
},
|
||||
filePreview: (file, fileList) => {
|
||||
pageData.value.dialogImageUrl = window.location.protocol + "//" + window.location.host + "/gb/yjb/api/outsidewall/sysFileInfo/preview/" + file.response.data;
|
||||
pageData.value.dialogImageUrls = fileList.map(a => window.location.protocol + "//" + window.location.host + "/gb/yjb/api/outsidewall/sysFileInfo/preview/" + a.response.data);
|
||||
},
|
||||
}
|
||||
|
||||
|
||||
onMounted(async () => {
|
||||
await funHandles.init(pageData.value);
|
||||
});
|
||||
|
||||
return {
|
||||
XEUtils,
|
||||
formRef,
|
||||
childFormRef,
|
||||
rulesCheckData,
|
||||
pageData,
|
||||
staticData,
|
||||
funHandles
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
app.use(ElementPlus, { locale: ElementPlusLocaleZhCn });
|
||||
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
|
||||
app.component(key, component)
|
||||
}
|
||||
app.mount("#app");
|
||||
</script>
|
||||
<style>
|
||||
.upload-demo .el-upload-dragger {
|
||||
height: 100%;
|
||||
border-width: 0;
|
||||
padding: 20px var(--el-upload-dragger-padding-vertical);
|
||||
}
|
||||
</style>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,953 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css" />
|
||||
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
|
||||
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
|
||||
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
|
||||
<script src="http://lib.baomitu.com/qs/6.10.3/qs.min.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app" v-loading="loading">
|
||||
<h3 style="text-align:center;">宁波既有建筑外墙脱落问卷调查</h3>
|
||||
<el-form label-position="left" ref="form" :model="form" :rules="rules" label-width="160px" style="margin-top:15px;">
|
||||
<el-form-item label="1.社区/小区名：" prop="communityId">
|
||||
<el-select v-model="form.communityId" filterable placeholder="请选择" @change="selectCommunity">
|
||||
<el-option v-for="item in communitys" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="2.小区交付年份：" prop="deliveryear">
|
||||
<el-input v-model="form.deliveryear"></el-input>
|
||||
</el-form-item>
|
||||
<!--@*<el-form-item label="物业单位：" prop="hangye">
|
||||
<el-input v-model="form.hangye"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="开发商：" prop="hangye">
|
||||
<el-input v-model="form.hangye"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="施工单位：" prop="hangye">
|
||||
<el-input v-model="form.hangye"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="设计单位：" prop="hangye">
|
||||
<el-input v-model="form.hangye"></el-input>
|
||||
</el-form-item>*@-->
|
||||
<el-form-item label="3.外墙结构：" prop="outsidewallstructurefiles">
|
||||
<!--@*:on-change="fileChange" multiple *@-->
|
||||
<el-upload class="upload-demo" drag action="/gb/yjb/api/outsidewall/sysFileInfo/upload" :auto-upload="true" :on-preview="handlePreview" :on-remove="(file, fileList)=>{return handleRemove(file, fileList)}" :file-list="fileList" :on-success="(response, file, fileList)=>{return fileChange(response, file, fileList)}">
|
||||
<i class="el-icon-upload"></i>
|
||||
<div class="el-upload__text"><em>上传外墙照片</em></div>
|
||||
<div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
</el-upload>
|
||||
<!--@*this.$refs.upload.submit();*@
|
||||
@* <el-upload class="upload-demo" ref="upload"
|
||||
action="https://jsonplaceholder.typicode.com/posts/"
|
||||
:on-preview="handlePreview"
|
||||
:on-remove="handleRemove"
|
||||
:file-list="fileList"
|
||||
:on-change="fileChange"
|
||||
list-type="picture" :auto-upload="false">
|
||||
<el-button size="small" type="primary">点击上传</el-button>
|
||||
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
</el-upload>*@-->
|
||||
</el-form-item>
|
||||
<el-form-item label="4.楼栋数：" prop="buildcount">
|
||||
<el-input-number v-model="form.buildcount"></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="5.住户总数：" prop="householdcount">
|
||||
<el-input-number v-model="form.householdcount"></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="6.总建筑面积：" prop="totalfloorage">
|
||||
<el-input-number v-model="form.totalfloorage" :precision="2" :step="1"></el-input-number>
|
||||
</el-form-item>
|
||||
<el-form-item label="7.是否存在外墙问题：" prop="isExistProblem">
|
||||
<el-radio-group v-model="form.isExistProblem" size="small">
|
||||
<el-radio-button label="1" border>是</el-radio-button>
|
||||
<el-radio-button label="0" border>否</el-radio-button>
|
||||
</el-radio-group>
|
||||
<span>例如：漏水、开裂、脱落</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="8.楼栋信息：">
|
||||
<el-table :data="form.buildings" style="width: 100%" ref="table" tooltip-effect="dark" @selection-change="handleSelectionChange" row-key="id"
|
||||
:expand-row-keys="expands" @row-click="clickRowHandle">
|
||||
<!--@* <el-table-column type="selection" width="55">
|
||||
</el-table-column>*@-->
|
||||
<el-table-column type="expand">
|
||||
<template slot-scope="props">
|
||||
<el-form label-position="left" class="demo-table-expand" :rules="rules" ref="childForm" :model="props.row">
|
||||
<el-form-item label="幢名称：">
|
||||
<span>{{ props.row.buildingName }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="地址：">
|
||||
<span>{{ props.row.address }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="层数：">
|
||||
<span>{{ props.row.levelCount }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="总户数：">
|
||||
<span>{{ props.row.houseHolds }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="建设单位：">
|
||||
<span>{{ props.row.buildingUnit }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="设计单位：">
|
||||
<span>{{ props.row.desingerUnit }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="施工单位：">
|
||||
<span>{{ props.row.constructionUnit }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="监理单位：">
|
||||
<span>{{ props.row.monitorUnit }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="物业单位：">
|
||||
<span>{{ props.row.wuYeUnit }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item prop="curwallproblems">
|
||||
8.1 墙体问题的类型是
|
||||
<el-checkbox-group v-model="props.row.curwallproblems">
|
||||
<el-checkbox v-for="w in wallproblems" :label="w" :key="w">{{w}}</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
<el-input type="textarea" autosize placeholder="请输入其他问题" v-model="props.row.curwallproblemother">
|
||||
<!--@*<el-select v-model="curwallproblems" multiple filterable allow-create default-first-option placeholder="请选择问题类型">
|
||||
<el-option v-for="item in wallproblems" :key="item" :label="item" :value="item">
|
||||
</el-option>
|
||||
</el-select>*@-->
|
||||
</el-form-item>
|
||||
<el-form-item label="" v-if="props.row.curwallproblems?.length>1">
|
||||
8.2 哪个问题最先开始出现？
|
||||
<el-radio-group v-model="props.row.wallproblemsfirst">
|
||||
<el-radio v-for="w in wallproblems" :label="w">{{w}}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item prop="firstproblemdate">
|
||||
8.3 第一次出现墙体问题是建成后____年？
|
||||
<el-radio-group v-model="props.row.firstproblemdate">
|
||||
<el-radio label="建成后0-5年">建成后0-5年</el-radio>
|
||||
<el-radio label="建成后6-10年">建成后6-10年</el-radio>
|
||||
<el-radio label="建成后11-15年">建成后11-15年</el-radio>
|
||||
<el-radio label="建成后15年以上">建成后15年以上</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item prop="problemfrequency">
|
||||
8.4 墙体脱落发生频率如何？
|
||||
<el-radio-group v-model="props.row.problemfrequency">
|
||||
<el-radio label="1年1-2次">1年1-2次</el-radio>
|
||||
<el-radio label="1年3-5次">1年3-5次</el-radio>
|
||||
<el-radio label="1年5次以上">1年5次以上</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item prop="problemseason">
|
||||
8.5 问题多发生在哪个季节？
|
||||
<el-checkbox-group v-model="props.row.problemseason">
|
||||
<el-checkbox label="春" key="春">春</el-checkbox>
|
||||
<el-checkbox label="夏" key="夏">夏</el-checkbox>
|
||||
<el-checkbox label="秋" key="秋">秋</el-checkbox>
|
||||
<el-checkbox label="冬" key="冬">冬</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<el-form-item prop="wallproblemtoward">
|
||||
8.6 墙体问题发生的朝向是哪面？
|
||||
<el-checkbox-group v-model="props.row.wallproblemtoward">
|
||||
<el-checkbox label="东" key="东">东</el-checkbox>
|
||||
<el-checkbox label="西" key="西">西</el-checkbox>
|
||||
<el-checkbox label="南" key="南">南</el-checkbox>
|
||||
<el-checkbox label="北" key="北">北</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
8.7 问题照片：<!--@* :on-change="fileChange1"*@-->
|
||||
<el-upload class="upload-demo" drag action="/gb/yjb/api/outsidewall/sysFileInfo/upload" :auto-upload="true" :on-preview="(file)=>{return handlePreview(file,props,1)}" :on-remove="(file, fileList)=>{return handleRemove(file, fileList,props)}" :file-list="childFileList[props.$index].filelist1" :on-success="(response, file, fileList)=>{return fileChange(response, file, fileList, props,1,'东')}">
|
||||
<i class="el-icon-upload"></i>
|
||||
<div class="el-upload__text"><em>上传东面照片</em></div>
|
||||
<div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
</el-upload>
|
||||
<el-upload class="upload-demo" drag action="/gb/yjb/api/outsidewall/sysFileInfo/upload" :auto-upload="true" :on-preview="(file)=>{return handlePreview(file,props,2)}" :on-remove="(file, fileList)=>{return handleRemove(file, fileList,props)}" :file-list="childFileList[props.$index].filelist2" :on-success="(response, file, fileList)=>{return fileChange(response, file, fileList, props,2,'西')}">
|
||||
<i class="el-icon-upload"></i>
|
||||
<div class="el-upload__text"><em>上传西面照片</em></div>
|
||||
<div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
</el-upload>
|
||||
<el-upload class="upload-demo" drag action="/gb/yjb/api/outsidewall/sysFileInfo/upload" :auto-upload="true" :on-preview="(file)=>{return handlePreview(file,props,3)}" :on-remove="(file, fileList)=>{return handleRemove(file, fileList,props)}" :file-list="childFileList[props.$index].filelist3" :on-success="(response, file, fileList)=>{return fileChange(response, file, fileList, props,3,'南')}">
|
||||
<i class="el-icon-upload"></i>
|
||||
<div class="el-upload__text"><em>上传南面照片</em></div>
|
||||
<div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
</el-upload>
|
||||
<el-upload class="upload-demo" drag action="/gb/yjb/api/outsidewall/sysFileInfo/upload" :auto-upload="true" :on-preview="(file)=>{return handlePreview(file,props,4)}" :on-remove="(file, fileList)=>{return handleRemove(file, fileList,props)}" :file-list="childFileList[props.$index].filelist4" :on-success="(response, file, fileList)=>{return fileChange(response, file, fileList, props,4,'北')}">
|
||||
<i class="el-icon-upload"></i>
|
||||
<div class="el-upload__text"><em>上传北面照片</em></div>
|
||||
<div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>
|
||||
</el-upload>
|
||||
</el-form-item>
|
||||
<el-form-item prop="problemfanwei">
|
||||
8.8 发生外墙问题的范围有多大？
|
||||
<el-radio-group v-model="props.row.problemfanwei">
|
||||
<el-radio label="＜外墙面积的25%"></el-radio>
|
||||
<el-radio label="外墙面积的25-50%"></el-radio>
|
||||
<el-radio label="外墙面积的50-75%"></el-radio>
|
||||
<el-radio label="外墙面积的75-100%"></el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item prop="problemheight">
|
||||
8.9 外墙问题发生在哪个高度？
|
||||
<el-checkbox-group v-model="props.row.problemheight">
|
||||
<el-checkbox label="底层（楼高1/3以下）"></el-checkbox>
|
||||
<el-checkbox label="中层"></el-checkbox>
|
||||
<el-checkbox label="高层（屋顶往下1/3）"></el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<el-form-item prop="diaoluowu">
|
||||
8.10 掉落物是什么？
|
||||
<el-checkbox-group v-model="props.row.diaoluowu">
|
||||
<el-checkbox label="墙皮材料"></el-checkbox>
|
||||
<el-checkbox label="保温材料"></el-checkbox>
|
||||
<el-checkbox label="混凝土块"></el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<!--@*<el-form-item>
|
||||
<el-button type="primary" plain @click.prevent="tempSave(props.row)">暂存</el-button>
|
||||
</el-form-item>*@-->
|
||||
</el-form>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="幢名称" prop="buildingName">
|
||||
</el-table-column>
|
||||
<el-table-column label="地址" prop="address">
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-form-item>
|
||||
<el-form-item prop="problemismodify" v-if="form.isExistProblem=='1'">
|
||||
14.问题发生后是否请人修复了？
|
||||
<el-radio-group v-model="form.problemismodify">
|
||||
<el-radio label="1">是</el-radio>
|
||||
<el-radio label="0">否</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item v-if="form.problemismodify=='1'">
|
||||
15.请提供修复单位的名称:
|
||||
<el-input type="textarea" autosize placeholder="请提供修复单位的名称。" v-model="form.problemmodifyunitname">
|
||||
</el-form-item>
|
||||
<el-form-item v-if="form.problemismodify=='1'">
|
||||
16.修复后的部位是否再次发生问题？
|
||||
<el-radio-group v-model="form.problemmodifyisagain">
|
||||
<el-radio label="1">有再发生</el-radio>
|
||||
<el-radio label="0">没有</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
20.若您愿意接受我们的现场调查，请惠赐您的联系方式。谢谢！
|
||||
<el-input type="textarea" autosize placeholder="" v-model="form.contract">
|
||||
</el-form-item>
|
||||
<!--@*<el-form-item label="手机号码：" prop="phone">
|
||||
<el-input v-model="form.phone"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="验证码" prop="code" v-if="!isshowmyinfo">
|
||||
<el-input type="text" maxlength="4" placeholder="验证码" v-model="form.code">
|
||||
<template slot="append">
|
||||
<el-button :disabled="disabled" @click="getCode">{{ valiBtn }}</el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
</el-form-item>*@-->
|
||||
<el-form-item v-if="!isshowmyinfo">
|
||||
<el-button type="primary" @click.prevent="onSubmit('form','childForm')"> 提 交 </el-button>
|
||||
<el-button @click.prevent="showinfo()">我的报名</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-image ref="myImg" class="my-img" :src="dialogImageUrl"
|
||||
:preview-src-list="dialogImageUrls">
|
||||
</el-image>
|
||||
</div>
|
||||
</body>
|
||||
<script>
|
||||
new Vue({
|
||||
el: '#app',
|
||||
data: function () {
|
||||
var checkPhone = (rule, value, callback) => {
|
||||
const regMobile = /^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{8}$/;
|
||||
if (regMobile.test(value)) {
|
||||
callback()
|
||||
}
|
||||
callback(new Error("请输入正确的手机号码"))
|
||||
};
|
||||
var checkCode = (rule, value, callback) => {
|
||||
if (value === "") {
|
||||
callback(new Error("请输入验证码"))
|
||||
} else if (!/^[0-9]+$/.test(value) || !/^\d{4}$/.test(value)) {
|
||||
callback(new Error("请输入4位数字的验证码"))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
};
|
||||
var checkNumber = (rule, value, callback) => {
|
||||
if (value === "") {
|
||||
callback(new Error("不能为空"))
|
||||
} else if (!/^[0-9]+$/.test(value)) {
|
||||
callback(new Error("必需为数字"))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
};
|
||||
var checkCardNo = (rule, value, callback) => {
|
||||
const regMobile = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
|
||||
if (regMobile.test(value)) {
|
||||
callback()
|
||||
}
|
||||
callback(new Error("请输入正确的身份证号码"))
|
||||
};
|
||||
return {
|
||||
form: {
|
||||
communityName: '',
|
||||
communityId: '',
|
||||
deliveryear: '',
|
||||
buildcount: '',
|
||||
totalfloorage: 0,
|
||||
address: '',
|
||||
date: '',
|
||||
code: '',
|
||||
fileList: [],
|
||||
}, rules: {
|
||||
communityId: [{ required: true, trigger: 'blur', message: '请选择社区/小区' }],
|
||||
phone: [{ validator: checkPhone, required: true, trigger: 'blur' }],
|
||||
code: [{ validator: checkCode, required: true, trigger: 'blur' }],
|
||||
deliveryear: [{ required: false, trigger: 'blur', message: '请输入交付年份' }],
|
||||
buildcount1: [{ validator: checkCardNo, required: false, trigger: 'blur' }],
|
||||
householdcount: [{ required: false, trigger: 'blur', message: '请输入住户总数' }],
|
||||
date: [{ required: true, trigger: 'blur', message: '请选择参加时间' }],
|
||||
line: [{ required: true, trigger: 'blur', message: '请选择线路' }],
|
||||
totalfloorage: [{ required: true, trigger: 'blur', message: '请输入总建筑面积' }],//, { validator: checkNumber, message: '总建筑面积必须为数字值' }
|
||||
isExistProblem: [{ required: true, trigger: 'blur', message: '请选择是否' }],
|
||||
curwallproblems: [{ required: true, trigger: ['change', 'blur'], message: '请选择墙体问题' }],
|
||||
firstproblemdate: [{ required: true, trigger: ['change', 'blur'], message: '请选择第一次出现墙体问题时间' }],
|
||||
problemfrequency: [{ required: true, trigger: ['change', 'blur'], message: '请选择墙体脱落发生频率' }],
|
||||
problemseason: [{ required: true, trigger: ['change', 'blur'], message: '请选择问题发生季节' }],
|
||||
wallproblemtoward: [{ required: true, trigger: ['change', 'blur'], message: '请选择问题发生朝向' }],
|
||||
problemfanwei: [{ required: true, trigger: ['change', 'blur'], message: '请选择外墙问题的范围' }],
|
||||
problemheight: [{ required: true, trigger: ['change', 'blur'], message: '请选择外墙问题发生的高度' }],
|
||||
diaoluowu: [{ required: true, trigger: ['change', 'blur'], message: '请选择掉落物' }],
|
||||
problemismodify: [{ required: true, trigger: ['blur'], message: '请选择问题发生后是否请人修复' }],
|
||||
},
|
||||
valiBtn: '获取验证码',
|
||||
disabled: false,
|
||||
datePersonNumber: '',
|
||||
go_disabled: false,
|
||||
pageline: '',
|
||||
lineTxt: '',
|
||||
isshowmyinfo: false,
|
||||
fileList: [],
|
||||
dialogImageUrl: '',
|
||||
dialogImageUrls: [],
|
||||
dialogVisible: false,
|
||||
disabled: false,
|
||||
multipleSelection: [],
|
||||
wallproblems: ['漏水', '开裂', '脱落', '空鼓', '其他问题'],
|
||||
problemismodify: '',
|
||||
problemmodifyunitname: '',
|
||||
problemmodifyisagain: '',
|
||||
contract: '',
|
||||
// 获取row的key值
|
||||
getRowKeys(row) {
|
||||
return row.id;
|
||||
},
|
||||
// 要展开的行，数值的元素是row的key值
|
||||
expands: [],
|
||||
communitys: [],
|
||||
childFileList: []
|
||||
}
|
||||
},
|
||||
created: function () {
|
||||
this.loading = true;
|
||||
this.loading_false();
|
||||
this.form.token = localStorage.getItem("_token");
|
||||
if (this.getQueryString("valid") == "1" || this.form.token)
|
||||
this.showinfo();
|
||||
this.GetCommunitys('');
|
||||
},
|
||||
methods: {
|
||||
GetCommunitys(queryString) {
|
||||
let _this = this;
|
||||
axios({
|
||||
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
|
||||
method: 'get',
|
||||
url: '/gb/yjb/api/outsidewall/Communitys?searchkey=' + queryString,
|
||||
responseType: "json",
|
||||
}).then(async response => {
|
||||
_this.communitys = response.data.data
|
||||
_this.loading = false;
|
||||
}).catch(async error => {
|
||||
console.log(error)
|
||||
_this.$message({
|
||||
type: 'error',
|
||||
message: error.message
|
||||
})
|
||||
_this.loading = false;
|
||||
})
|
||||
},
|
||||
getLabel(arrays, id) {
|
||||
let opt = {};
|
||||
opt = arrays.find((item) => {
|
||||
return item.id === id;
|
||||
});
|
||||
console.log(opt.name);
|
||||
return opt.name;
|
||||
},
|
||||
selectCommunity(v) {
|
||||
this.form.communityName = this.getLabel(this.communitys, v);
|
||||
|
||||
this.loading = true;
|
||||
let _this = this;
|
||||
axios({
|
||||
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
|
||||
method: 'get',
|
||||
url: '/gb/yjb/api/outsidewall/Community/' + v,
|
||||
responseType: "json",
|
||||
}).then(async response => {
|
||||
_this.form.buildings = response.data.data
|
||||
_this.form.buildcount = _this.form.buildings.length
|
||||
_this.form.householdcount = _this.form.buildings.reduce((a, key) => { return a + key.houseHolds }, 0)
|
||||
_this.form.totalfloorage = _this.form.buildings.reduce((a, key) => { return a + key.areaCount }, 0)
|
||||
_this.childFileList = [];
|
||||
//_this.form.buildings.forEach((a) => { _this.childFileList.push({ towards: [{ toward: '东', filelist: [] }, { toward: '西', filelist: [] }, { toward: '南', filelist: [] }, { toward: '北', filelist: [] }] }) })
|
||||
_this.form.buildings.forEach((a) => {
|
||||
_this.childFileList.push({ filelist1: [], filelist2: [], filelist3: [], filelist4: [] })
|
||||
});
|
||||
_this.loading = false;
|
||||
}).catch(async error => {
|
||||
console.log(error)
|
||||
_this.$message({
|
||||
type: 'error',
|
||||
message: error.message
|
||||
})
|
||||
_this.loading = false;
|
||||
})
|
||||
},
|
||||
handleValidates(formName) {
|
||||
const list = []
|
||||
const validas = []
|
||||
this.$refs[formName].forEach((item, index) => {
|
||||
list.push(new Promise(resolve => {
|
||||
item.validate(valida => {
|
||||
validas.push(valida)
|
||||
resolve()
|
||||
})
|
||||
})
|
||||
)
|
||||
})
|
||||
Promise.all([...list]).then(() => {
|
||||
const res = !validas.some(item => item === false)
|
||||
return res
|
||||
}).catch(() => {
|
||||
return false
|
||||
})
|
||||
},
|
||||
handleValidate(formName) {
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
//alert('submit!');
|
||||
return true;
|
||||
} else {
|
||||
console.log('error submit!!');
|
||||
return false;
|
||||
}
|
||||
});
|
||||
},
|
||||
tempSave(row) {
|
||||
debugger
|
||||
if (this.handleValidate('childForm')) {
|
||||
|
||||
}
|
||||
},
|
||||
clickRowHandle(row, column, event) {
|
||||
if (this.expands.includes(row.id)) {
|
||||
//return;
|
||||
this.expands = this.expands.filter(val => val !== row.id);
|
||||
} else {
|
||||
this.expands = [];
|
||||
this.expands.push(row.id);
|
||||
}
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
debugger;
|
||||
this.multipleSelection = val;
|
||||
},
|
||||
fileChange(response, file, fileList, scope, flistidx, toward) {
|
||||
debugger;
|
||||
if (response.success == false) {
|
||||
this.$message.error('上传失败,请稍候重试');
|
||||
return;
|
||||
}
|
||||
this.loading = true;
|
||||
if (scope) {
|
||||
eval("this.childFileList[scope.$index].filelist" + flistidx + "=fileList")
|
||||
//if (this.childFileList[scope.$index].towards.filter(a => a.toward == toward).length == 0)
|
||||
// this.childFileList[scope.$index].towards.push({ toward: toward, filelist: [] });
|
||||
//this.childFileList[scope.$index].towards.filter(a => a.toward == toward)[0].filelist.push(file)
|
||||
if (file.response)
|
||||
this.form.buildings.forEach(a => {
|
||||
if (a.id == this.expands[0]) {
|
||||
var _pf = {
|
||||
file: file.response.data,
|
||||
toward: toward
|
||||
}
|
||||
a.problemfiles.push(_pf)
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.fileList = fileList;
|
||||
if (file.response)
|
||||
this.form.fileList.push(file.response.data);
|
||||
}
|
||||
this.loading = false;
|
||||
},
|
||||
//handleRemove1(file, fileList) {
|
||||
// let _this = this;
|
||||
// this.removeFile(file, fileList, function () {
|
||||
// _this.childFileList1 = _this.childFileList1.filter((a) => { return a.uid != file.uid })
|
||||
// if (file.response)
|
||||
// _this.form.buildings.forEach(a => {
|
||||
// if (a.id == _this.expands[0]) {
|
||||
// a.problemfiles = a.problemfiles.filter((x) => { return x.file != file.response.data })
|
||||
// }
|
||||
// })
|
||||
// _this.loading = false;
|
||||
// }, function () { });
|
||||
//},
|
||||
//handleRemove2(file, fileList) {
|
||||
// let _this = this;
|
||||
// this.removeFile(file, fileList, function () {
|
||||
// _this.childFileList2 = _this.childFileList2.filter((a) => { return a.uid != file.uid })
|
||||
// if (file.response)
|
||||
// _this.form.buildings.forEach(a => {
|
||||
// if (a.id == _this.expands[0]) {
|
||||
// a.problemfiles = a.problemfiles.filter((x) => { return x.file != file.response.data })
|
||||
// }
|
||||
// })
|
||||
// _this.loading = false;
|
||||
// }, function () { });
|
||||
//},
|
||||
//handleRemove3(file, fileList) {
|
||||
// let _this = this;
|
||||
// this.removeFile(file, fileList, function () {
|
||||
// _this.childFileList3 = _this.childFileList3.filter((a) => { return a.uid != file.uid })
|
||||
// if (file.response)
|
||||
// _this.form.buildings.forEach(a => {
|
||||
// if (a.id == _this.expands[0]) {
|
||||
// a.problemfiles = a.problemfiles.filter((x) => { return x.file != file.response.data })
|
||||
// }
|
||||
// })
|
||||
// _this.loading = false;
|
||||
// }, function () { });
|
||||
//},
|
||||
//handleRemove4(file, fileList) {
|
||||
// let _this = this;
|
||||
// this.removeFile(file, fileList, function () {
|
||||
// _this.childFileList4 = _this.childFileList4.filter((a) => { return a.uid != file.uid })
|
||||
// if (file.response)
|
||||
// _this.form.buildings.forEach(a => {
|
||||
// if (a.id == _this.expands[0]) {
|
||||
// a.problemfiles = a.problemfiles.filter((x) => { return x.file != file.response.data })
|
||||
// }
|
||||
// })
|
||||
// _this.loading = false;
|
||||
// }, function () { });
|
||||
//},
|
||||
//handleRemove(file, fileList, scope) {
|
||||
// let _this = this;
|
||||
// this.removeFile(file, fileList, function () {
|
||||
// _this.fileList = _this.fileList.filter((a) => { return a.uid != file.uid })
|
||||
// if (file.response)
|
||||
// _this.form.fileList = _this.form.fileList.filter((a) => { return a != file.response.data })
|
||||
// _this.loading = false;
|
||||
// }, function () { });
|
||||
//},
|
||||
handleRemove(file, fileList, scope) {
|
||||
let _this = this;
|
||||
_this.loading = true;
|
||||
console.log(file, fileList);
|
||||
axios({
|
||||
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
|
||||
method: 'get',
|
||||
url: '/gb/yjb/api/outsidewall/sysFileInfo/delete/' + file.response.data,
|
||||
responseType: "json",
|
||||
}).then(async response => {
|
||||
if (scope) {
|
||||
this.childFileList[scope.$index].towards = this.childFileList[scope.$index].towards.filter((a) => { return a.uid != file.uid })
|
||||
|
||||
if (file.response)
|
||||
_this.form.buildings.forEach(a => {
|
||||
if (a.id == _this.expands[0]) {
|
||||
a.problemfiles = a.problemfiles.filter((x) => { return x.file != file.response.data })
|
||||
}
|
||||
})
|
||||
} else {
|
||||
_this.fileList = _this.fileList.filter((a) => { return a.uid != file.uid })
|
||||
if (file.response)
|
||||
_this.form.fileList = _this.form.fileList.filter((a) => { return a != file.response.data });
|
||||
}
|
||||
_this.loading = false;
|
||||
}).catch(async error => {
|
||||
console.log(error)
|
||||
})
|
||||
},
|
||||
filePreview(file, fileList) {
|
||||
debugger
|
||||
this.loading = true;
|
||||
console.log(file);
|
||||
this.dialogImageUrl = window.location.protocol + "//" + window.location.host + "/gb/yjb/api/outsidewall/sysFileInfo/preview/" + file.response.data;
|
||||
this.dialogImageUrls = fileList.map(a => window.location.protocol + "//" + window.location.host + "/gb/yjb/api/outsidewall/sysFileInfo/preview/" + a.response.data);
|
||||
this.$refs.myImg.showViewer = true
|
||||
const m = (e) => { e.preventDefault() };
|
||||
document.body.style.overflow = 'hidden';
|
||||
document.addEventListener("touchmove", m, false); // 禁止页面滑动
|
||||
this.loading = false;
|
||||
},
|
||||
handlePreview(file, scope, toward) {
|
||||
debugger
|
||||
if (scope) {
|
||||
eval("this.filePreview(file, this.childFileList[scope.$index].filelist" + toward + ")")
|
||||
//this.filePreview(file, this.childFileList[scope.$index].towards.filter(a => a.toward == toward).filelist)
|
||||
}
|
||||
else
|
||||
this.filePreview(file, this.fileList)
|
||||
},
|
||||
handlePreview1(file, scope) {
|
||||
this.filePreview(file, this.childFileList1)
|
||||
},
|
||||
handlePreview2(file, scope) {
|
||||
this.filePreview(file, this.childFileList2)
|
||||
},
|
||||
handlePreview3(file, scope) {
|
||||
this.filePreview(file, this.childFileList3)
|
||||
},
|
||||
handlePreview4(file, scope) {
|
||||
this.filePreview(file, this.childFileList4)
|
||||
},
|
||||
getQueryString(communityId) {
|
||||
var reg = new RegExp("(^|&)" + communityId + "=([^&]*)(&|$)", "i");
|
||||
var r = window.location.search.substr(1).match(reg);
|
||||
if (r != null) return unescape(r[2]); return null;
|
||||
},
|
||||
getCode() {
|
||||
this.$refs['form'].validateField('phone', (err) => {
|
||||
if (err) {
|
||||
console.log('未通过')
|
||||
return;
|
||||
} else {
|
||||
console.log('已通过')
|
||||
console.log(this.form.phone)
|
||||
let _this = this;
|
||||
//this.$alert("成功", "提示")
|
||||
axios({
|
||||
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
|
||||
method: 'post',
|
||||
url: '/gb/yjb/api/ningbozhichun/sendcode',
|
||||
data: _this.form,
|
||||
responseType: "json",
|
||||
}).then(async response => {
|
||||
if (response.data.data != true) {
|
||||
_this.$alert(`<div>` + response.data.message + `</div>`, '错误', {
|
||||
confirmButtonText: '确定', dangerouslyUseHTMLString: true, center: true, closeOnClickModal: true
|
||||
}).then(a => { }).catch(err => { console.log(err) });
|
||||
} else {
|
||||
_this.tackBtn(); //验证码倒数60秒
|
||||
}
|
||||
_this.loading = false;
|
||||
}).catch(async error => {
|
||||
console.log(error)
|
||||
_this.$message({
|
||||
type: 'error',
|
||||
message: error.message
|
||||
})
|
||||
_this.loading = false;
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
tackBtn() { //验证码倒数60秒
|
||||
let time = 60;
|
||||
let timer = setInterval(() => {
|
||||
if (time == 0) {
|
||||
clearInterval(timer);
|
||||
this.valiBtn = '获取验证码';
|
||||
this.disabled = false;
|
||||
} else {
|
||||
this.disabled = true;
|
||||
this.valiBtn = time + '秒后重试';
|
||||
time--;
|
||||
}
|
||||
}, 1000);
|
||||
},
|
||||
onSubmit(formName, formNameChild) {
|
||||
console.log('submit!');
|
||||
let _this = this;
|
||||
this.$refs[formName].validate((valid) => {
|
||||
if (valid) {
|
||||
if (_this.form.isExistProblem == '0') {
|
||||
this.$confirm('确定提交吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
_this.submit2();
|
||||
}).catch(() => {
|
||||
|
||||
});
|
||||
} else {
|
||||
if (this.$refs[formNameChild]) {
|
||||
this.$refs[formNameChild].validate((valid) => {
|
||||
if (valid) {
|
||||
debugger
|
||||
this.$confirm('确定提交吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
_this.submit2();
|
||||
}).catch(() => {
|
||||
|
||||
});
|
||||
} else {
|
||||
this.$message({
|
||||
message: '幢信息问卷未填写完整',
|
||||
type: 'warning'
|
||||
});
|
||||
}
|
||||
});
|
||||
} else {
|
||||
this.$message({
|
||||
message: '存在问题请展开幢信息进行问卷填写',
|
||||
type: 'warning'
|
||||
});
|
||||
}
|
||||
}
|
||||
} else {
|
||||
this.$message({
|
||||
message: '社区信息问卷未填写完整',
|
||||
type: 'warning'
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
submit2() {
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: '提交中...请稍候',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
});
|
||||
let _this = this;
|
||||
axios({
|
||||
headers: { 'Content-Type': 'multipart/form-data' },
|
||||
method: 'post',
|
||||
url: '/gb/yjb/api/outsidewall/submit',
|
||||
data: _this.form,
|
||||
responseType: "json",
|
||||
}).then(async response => {
|
||||
debugger;
|
||||
if (response.data?.success == true) {
|
||||
_this.$alert(`<div>提交成功,您的提交码是:` + response.data?.data + `<br/>请牢记提交码。</div>`, '提交成功', {
|
||||
confirmButtonText: '确定', dangerouslyUseHTMLString: true, center: true, closeOnClickModal: true
|
||||
}).then(a => { }).catch(err => { console.log(err) });
|
||||
} else {
|
||||
_this.$alert(`<div>` + response.data.message + `</div>`, '错误', {
|
||||
confirmButtonText: '确定', dangerouslyUseHTMLString: true, center: true, closeOnClickModal: true
|
||||
}).then(a => { }).catch(err => { console.log(err) });
|
||||
}
|
||||
loading.close();
|
||||
}).catch(async error => {
|
||||
console.log(error)
|
||||
_this.$message({
|
||||
type: 'error',
|
||||
message: error.message
|
||||
})
|
||||
loading.close();
|
||||
})
|
||||
},
|
||||
getFormData(object) {
|
||||
const formData = new FormData()
|
||||
Object.keys(object).forEach(key => {
|
||||
const value = object[key]
|
||||
if (Array.isArray(value)) {
|
||||
value.forEach((subValue, i) =>
|
||||
formData.append(key + `[${i}]`, subValue)
|
||||
)
|
||||
} else {
|
||||
formData.append(key, object[key])
|
||||
}
|
||||
})
|
||||
return formData
|
||||
},
|
||||
loading_false() { this.loading = false },
|
||||
showinfo() {
|
||||
let _this = this;
|
||||
_this.form.token = localStorage.getItem("_token");
|
||||
if (!_this.form.token) {
|
||||
window.location.href = '/gb/yjb/ningbozhichun/myvalid'
|
||||
} else {
|
||||
axios({
|
||||
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
|
||||
method: 'post',
|
||||
url: '/gb/yjb/api/ningbozhichun/getmyinfo',
|
||||
data: _this.form,
|
||||
responseType: "json",
|
||||
}).then(async response => {
|
||||
if (response.data?.data?.success == true) {
|
||||
if (!response.data?.data.entity) {
|
||||
localStorage.removeItem("_token");
|
||||
_this.$alert(`<div>您还没有报名呢</div>`, '错误', {
|
||||
confirmButtonText: '确定', dangerouslyUseHTMLString: true, center: true, closeOnClickModal: true
|
||||
}).then(a => { }).catch(err => { console.log(err) });
|
||||
} else {
|
||||
_this.form = response.data?.data.entity;
|
||||
let token = response.data.data.token;
|
||||
localStorage.setItem("_token", token);
|
||||
_this.isshowmyinfo = true;
|
||||
if (_this.form.line != _this.pageline) {
|
||||
if (_this.form.line == "慈溪")
|
||||
window.location = '/gb/yjb/ningbozhichun/index?line=a&valid=1'
|
||||
else if (_this.form.line == "奉化")
|
||||
window.location = '/gb/yjb/ningbozhichun/index?line=b&valid=1'
|
||||
else
|
||||
window.location = '/gb/yjb/ningbozhichun/index?line=c&valid=1'
|
||||
}
|
||||
}
|
||||
} else {
|
||||
_this.$alert(`<div>` + response.data.message + `，请再次验证手机号码后继续</div>`, '错误', {
|
||||
confirmButtonText: '确定', dangerouslyUseHTMLString: true, center: true, closeOnClickModal: true
|
||||
}).then(a => { }).catch(err => { console.log(err) });
|
||||
}
|
||||
_this.loading = false;
|
||||
}).catch(async error => {
|
||||
console.log(error)
|
||||
_this.$message({
|
||||
type: 'error',
|
||||
message: error.message
|
||||
})
|
||||
_this.loading = false;
|
||||
})
|
||||
}
|
||||
},
|
||||
getNumber() {
|
||||
let _this = this;
|
||||
axios({
|
||||
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
|
||||
method: 'post',
|
||||
url: '/gb/yjb/api/ningbozhichun/getnumber',
|
||||
data: _this.form,
|
||||
responseType: "json",
|
||||
}).then(async response => {
|
||||
if (response.data?.data?.success == true) {
|
||||
_this.datePersonNumber = _this.form.date + ` 还剩余 ` + response.data?.data?.n + ` 个名额`
|
||||
} else {
|
||||
_this.$alert(`<div>` + response.data.message + `</div>`, '错误', {
|
||||
confirmButtonText: '确定', dangerouslyUseHTMLString: true, center: true, closeOnClickModal: true
|
||||
}).then(a => { }).catch(err => { console.log(err) });
|
||||
}
|
||||
_this.loading = false;
|
||||
}).catch(async error => {
|
||||
console.log(error)
|
||||
_this.$message({
|
||||
type: 'error',
|
||||
message: error.message
|
||||
})
|
||||
_this.loading = false;
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<style lang="less">
|
||||
.my-img {
|
||||
display: none;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
</style>
|
||||
<style scoped>
|
||||
.el-upload-list__item:first-child {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
.el-upload-list__item {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
.upload-demo {
|
||||
margin-bottom: 20px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 4px;
|
||||
padding: 5px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
|
||||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.el-upload-dragger {
|
||||
width: 200px !important;
|
||||
height: 50px !important;
|
||||
}
|
||||
|
||||
.el-upload-dragger .el-icon-upload {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.el-upload-dragger .el-upload__text {
|
||||
line-height: 50px !important;
|
||||
}
|
||||
|
||||
.el-upload__tip {
|
||||
margin-top: -23px !important;
|
||||
}
|
||||
|
||||
.demo-table-expand {
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
.demo-table-expand label {
|
||||
/* width: 90px;*/
|
||||
color: #99a9bf;
|
||||
}
|
||||
|
||||
.demo-table-expand .el-form-item {
|
||||
margin-right: 0;
|
||||
margin-bottom: 5px;
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
.buhuanhang {
|
||||
white-space: nowrap;
|
||||
width: 21%;
|
||||
}
|
||||
|
||||
.text {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.item {
|
||||
padding: 18px 0;
|
||||
}
|
||||
|
||||
.box-card {
|
||||
width: 98%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.el-card__body {
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
.el-card__body p {
|
||||
margin: 0px;
|
||||
margin-bottom: 5px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.el-radio.is-bordered {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.el-radio-button--small .el-radio-button__inner {
|
||||
border-left: 1px solid #DCDFE6;
|
||||
}
|
||||
</style>
|
||||
</html>
|
||||
@@ -0,0 +1,652 @@
|
||||
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<!--<script src="../../lib/vue/vue.global.prod.min.js"></script>
|
||||
<link href="../../lib/element-plus/index.min.css" rel="stylesheet" />
|
||||
<script src="../../lib/element-plus/index.full.min.js"></script>
|
||||
<script src="../../lib/element-plus/locale/zh-cn.min.js"></script>
|
||||
<script src="../../lib/element-plus-icons-vue/global.iife.min.js"></script>
|
||||
<script src="../../lib/xe-utils/dist/xe-utils.umd.min.js"></script>
|
||||
<script src="../../lib/axios/axios.min.js"></script>-->
|
||||
|
||||
<link rel="stylesheet" href="../Contents/index.css">
|
||||
<script src="../Contents/vue.min.js"></script>
|
||||
<script src="../Contents/index.js"></script>
|
||||
<script src="../Contents/axios.min.js"></script>
|
||||
<script src="../Contents/qs.min.js"></script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app" v-loading="loading">
|
||||
<h3 style="text-align:center;">宁波既有建筑外墙脱落问卷调查结果</h3>
|
||||
<el-form label-position="left" ref="form" :model="form" label-width="120px" style="margin-top:15px;">
|
||||
<el-form-item label="社区/小区：" prop="name">
|
||||
<el-select v-model="form.communityId" filterable clearable placeholder="请选择" @@change="selectCommunity">
|
||||
<el-option v-for="item in communitys" :key="item.id" :label="item.name" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="提交码：" prop="name">
|
||||
<el-input v-model="form.submitCode" style="width:300px"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @@click.prevent="onSubmit('form')">查询</el-button>
|
||||
<el-button @@click.prevent="reset('form')">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-table :data="tableData" style="width: 100%" tooltip-effect="dark" @@selection-change="handleSelectionChange" row-key="id"
|
||||
:expand-row-keys="expands" @@row-click="clickRowHandle">
|
||||
<el-table-column type="expand">
|
||||
<template slot-scope="props">
|
||||
|
||||
<el-table :data="tableDataBuilding" style="width: 90%;margin:0 auto;" tooltip-effect="dark" @@selection-change="handleSelectionChange" row-key="id"
|
||||
:expand-row-keys="expandChilds" @@row-click="clickRowHandleBuilding">
|
||||
<el-table-column type="expand">
|
||||
<template slot-scope="props">
|
||||
<el-form label-position="left" class="demo-table-expand" :model="props.row">
|
||||
<el-form-item label="幢名称：">
|
||||
<span style="font-weight:bold;">{{ props.row.buildingName }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="地址：">
|
||||
<span style="font-weight:bold;">{{ props.row.address }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="层数：">
|
||||
<span style="font-weight:bold;">{{ props.row.levelCount }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="总户数：">
|
||||
<span style="font-weight:bold;">{{ props.row.households }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="建设单位：">
|
||||
<span style="font-weight:bold;">{{ props.row.buildingUnit }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="设计单位：">
|
||||
<span style="font-weight:bold;">{{ props.row.desingerUnit }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="施工单位：">
|
||||
<span style="font-weight:bold;">{{ props.row.constructionUnit }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="监理单位：">
|
||||
<span style="font-weight:bold;">{{ props.row.monitorUnit }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="物业单位：">
|
||||
<span style="font-weight:bold;">{{ props.row.wuYeUnit }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item prop="curwallproblems">
|
||||
8.1 墙体问题的类型是：<span style="font-weight:bold;">{{ props.row.curwallproblems }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item prop="curwallproblemother">
|
||||
8.1 其他：<span style="font-weight:bold;">{{ props.row.curwallproblemother }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="" v-if="props.row.curwallproblems?.length>1">
|
||||
8.2 哪个问题最先开始出现？
|
||||
<span style="font-weight:bold;">{{ props.row.wallproblemsfirst }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item prop="firstproblemdate">
|
||||
8.3 第一次出现墙体问题是建成后____年？
|
||||
<span style="font-weight:bold;">{{ props.row.firstproblemdate }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item prop="problemfrequency">
|
||||
8.4 墙体脱落发生频率如何？
|
||||
<span style="font-weight:bold;">{{ props.row.problemfrequency }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item prop="problemseason">
|
||||
8.5 问题多发生在哪个季节？
|
||||
<span style="font-weight:bold;">{{ props.row.problemseason }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item prop="wallproblemtoward">
|
||||
8.6 墙体问题发生的朝向是哪面？
|
||||
<span style="font-weight:bold;">{{ props.row.wallproblemtoward }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
8.7 问题照片：
|
||||
<div class="blocks">
|
||||
<div class="block" v-for="fit in props.row.outside_wall_building_photos" :key="fit" @@click="handlePreview(fit,props.row.outside_wall_building_photos)">
|
||||
<span class="title">{{ fit.toward }}</span>
|
||||
<el-avatar shape="square" :size="100" fit="fill" :src="fit.preview"></el-avatar>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item prop="problemfanwei">
|
||||
8.8 发生外墙问题的范围有多大？
|
||||
<span style="font-weight:bold;">{{ props.row.problemfanwei }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item prop="problemheight">
|
||||
8.9 外墙问题发生在哪个高度？
|
||||
<span style="font-weight:bold;">{{ props.row.problemheight }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item prop="diaoluowu">
|
||||
8.10 掉落物是什么？
|
||||
<span style="font-weight:bold;">{{ props.row.diaoluowu }}</span>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="幢名称">
|
||||
<template slot-scope="props">
|
||||
{{ props.row.buildingName}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="地址">
|
||||
<template slot-scope="props">
|
||||
{{ props.row.address}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="提交码">
|
||||
<template slot-scope="props">
|
||||
{{ props.row.submitCode}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="社区/小区名称">
|
||||
<template slot-scope="props">
|
||||
{{ props.row.communityName}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="提交日期">
|
||||
<template slot-scope="props">
|
||||
{{ dateFormat("mm-dd", props.row.createtime )}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="交付年份">
|
||||
<template slot-scope="props">
|
||||
{{ props.row.deliveryear}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="楼栋数">
|
||||
<template slot-scope="props">
|
||||
{{ props.row.buildcount}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="住户总数">
|
||||
<template slot-scope="props">
|
||||
{{ props.row.householdcount}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="总建筑面积">
|
||||
<template slot-scope="props">
|
||||
{{ props.row.totalfloorage}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="存在外墙问题">
|
||||
<template slot-scope="props">
|
||||
{{ props.row.isExistProblem==1?'是':'否' }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="请人修复">
|
||||
<template slot-scope="props">
|
||||
{{ props.row.problemismodify==1?'是':'否'}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="修复单位">
|
||||
<template slot-scope="props">
|
||||
{{ props.row.problemmodifyunitname}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="是否再次发生问题">
|
||||
<template slot-scope="props">
|
||||
{{ props.row.problemmodifyisagain==1?'是':'否'}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="联系方式">
|
||||
<template slot-scope="props">
|
||||
{{ props.row.contract}}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="外墙照片">
|
||||
<template slot-scope="props">
|
||||
<el-button @@click.native.stop="lookphoto(props.row.outside_wall_photos)">点我查看</el-button>
|
||||
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<h3 style="text-align:center;">
|
||||
<el-button @@click="toBuildPage">查看幢统计</el-button>
|
||||
@*<el-button type="primary" @@click="export_excel" :loading="loading">导出Excel</el-button>*@
|
||||
</h3>
|
||||
<el-image ref="myImg" class="my-img" :src="dialogImageUrl" :preview-src-list="dialogImageUrls">
|
||||
</el-image>
|
||||
<el-dialog title="图片预览" :visible.sync="dialogTableVisible">
|
||||
<div class="blocks">
|
||||
<div class="block" v-for="fit in outside_wall_photos" :key="fit" @@click="handlePreview(fit,outside_wall_photos)">
|
||||
<span class="title">{{ fit.toward }}</span>
|
||||
<el-avatar shape="square" :size="100" fit="fill" :src="fit.preview"></el-avatar>
|
||||
</div>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</body>
|
||||
<script>
|
||||
new Vue({
|
||||
el: '#app',
|
||||
data: function () {
|
||||
return {
|
||||
form: {
|
||||
|
||||
},
|
||||
tableData: [],
|
||||
tableDataBuilding: [],
|
||||
loading: false,
|
||||
token: '',
|
||||
communitys: [],
|
||||
communityId: '',
|
||||
// 获取row的key值
|
||||
getRowKeys(row) {
|
||||
return row.id;
|
||||
},
|
||||
// 要展开的行，数值的元素是row的key值
|
||||
expands: [],
|
||||
expandChilds: [],
|
||||
childFileList: [],
|
||||
dialogImageUrl: '',
|
||||
dialogImageUrls: [],
|
||||
outside_wall_photos: [],
|
||||
dialogTableVisible: false,
|
||||
}
|
||||
},
|
||||
created: function () {
|
||||
this.check_login()
|
||||
this.loading = true;
|
||||
this.GetCommunitys('');
|
||||
|
||||
},
|
||||
methods: {
|
||||
lookphoto(outside_wall_photos) {
|
||||
debugger;
|
||||
this.outside_wall_photos = outside_wall_photos
|
||||
this.dialogTableVisible = true
|
||||
},
|
||||
handlePreview(src, srcs) {
|
||||
debugger
|
||||
this.loading = true;
|
||||
console.log(src);
|
||||
this.dialogImageUrl = src.preview;
|
||||
this.dialogImageUrls = srcs.map(a => { return a.preview })
|
||||
this.$refs.myImg.showViewer = true
|
||||
const m = (e) => { e.preventDefault() };
|
||||
document.body.style.overflow = 'hidden';
|
||||
document.addEventListener("touchmove", m, false); // 禁止页面滑动
|
||||
this.loading = false;
|
||||
},
|
||||
clickRowHandleBuilding(row, column, event) {
|
||||
if (this.expandChilds.includes(row.id)) {
|
||||
//return;
|
||||
this.expandChilds = this.expandChilds.filter(val => val !== row.id);
|
||||
} else {
|
||||
this.expandChilds = [];
|
||||
this.expandChilds.push(row.id);
|
||||
}
|
||||
},
|
||||
clickRowHandle(row, column, event) {
|
||||
if (this.expands.includes(row.id)) {
|
||||
//return;
|
||||
this.expands = this.expands.filter(val => val !== row.id);
|
||||
//收缩
|
||||
this.tableDataBuilding = [];
|
||||
} else {
|
||||
let _this = this;
|
||||
const loading = this.$loading({
|
||||
lock: true,
|
||||
text: '加载中...请稍候',
|
||||
spinner: 'el-icon-loading',
|
||||
background: 'rgba(0, 0, 0, 0.7)'
|
||||
});
|
||||
axios({
|
||||
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
|
||||
method: 'post',
|
||||
url: '/gb/yjb/api/outsidewall/querybuilding',
|
||||
data: { wallId: row.id },
|
||||
responseType: "json",
|
||||
headers: {
|
||||
Authorization: 'Bearer ' + _this.token
|
||||
}
|
||||
}).then(async response => {
|
||||
this.expands = [];
|
||||
this.expands.push(row.id);
|
||||
if (response.data.success == true) {
|
||||
_this.tableDataBuilding = response.data.data;
|
||||
//_this.childFileList = [];
|
||||
//_this.tableDataBuilding.forEach((a) => {
|
||||
// _this.childFileList.push({ filelist1: a.outside_wall_building_photo1, filelist2: a.outside_wall_building_photo2, filelist3: outside_wall_building_photo3, filelist4: outside_wall_building_photo4 })
|
||||
//});
|
||||
} else {
|
||||
_this.$alert(`<div>` + response.data.message + `</div>`, '错误', {
|
||||
confirmButtonText: '确定', dangerouslyUseHTMLString: true, center: true, closeOnClickModal: true
|
||||
}).then(a => { }).catch(err => { console.log(err) });
|
||||
}
|
||||
loading.close();
|
||||
}).catch(async error => {
|
||||
console.log(error)
|
||||
_this.$message({
|
||||
type: 'error',
|
||||
message: error.message
|
||||
});
|
||||
loading.close();
|
||||
})
|
||||
}
|
||||
},
|
||||
handleSelectionChange(val) {
|
||||
this.multipleSelection = val;
|
||||
},
|
||||
GetCommunitys(queryString) {
|
||||
let _this = this;
|
||||
axios({
|
||||
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
|
||||
method: 'get',
|
||||
url: '/gb/yjb/api/outsidewall/Communitys?searchkey=' + queryString,
|
||||
responseType: "json",
|
||||
}).then(async response => {
|
||||
_this.communitys = response.data.data
|
||||
_this.loading = false;
|
||||
}).catch(async error => {
|
||||
console.log(error)
|
||||
_this.$message({
|
||||
type: 'error',
|
||||
message: error.message
|
||||
})
|
||||
_this.loading = false;
|
||||
})
|
||||
},
|
||||
selectCommunity(v) {
|
||||
//this.form.communityName = this.getLabel(this.communitys, v);
|
||||
this.communityId = v
|
||||
},
|
||||
onSubmit(formName) {
|
||||
console.log('submit!');
|
||||
let _this = this;
|
||||
this.$refs[formName].validate((valid) => { // 为表单绑定验证功能
|
||||
if (valid) {
|
||||
//this.$alert("成功", "提示")
|
||||
axios({
|
||||
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
|
||||
method: 'post',
|
||||
url: '/gb/yjb/api/outsidewall/query',
|
||||
data: _this.form,
|
||||
responseType: "json",
|
||||
headers: {
|
||||
Authorization: 'Bearer ' + _this.token
|
||||
}
|
||||
}).then(async response => {
|
||||
if (response.data.success == true) {
|
||||
_this.tableData = response.data.data;
|
||||
} else {
|
||||
_this.$alert(`<div>` + response.data.message + `</div>`, '错误', {
|
||||
confirmButtonText: '确定', dangerouslyUseHTMLString: true, center: true, closeOnClickModal: true
|
||||
}).then(a => { }).catch(err => { console.log(err) });
|
||||
}
|
||||
_this.loading = false;
|
||||
}).catch(async error => {
|
||||
console.log(error)
|
||||
_this.$message({
|
||||
type: 'error',
|
||||
message: error.message
|
||||
})
|
||||
_this.loading = false;
|
||||
})
|
||||
|
||||
}
|
||||
});
|
||||
}, reset(formName) {
|
||||
this.form = {}
|
||||
},
|
||||
export_excel() {
|
||||
this.loading = true;
|
||||
this.download('/gb/yjb/api/ningbozhichun/export_excel', this.dateFormat("YYYYmmddHHMMSS", new Date()) + "-共赴宁波之春.xlsx", this.loading_false);
|
||||
},
|
||||
check_login() {
|
||||
this.token = window.sessionStorage.getItem('__TOKEN');
|
||||
if (!this.token)
|
||||
location = '/gb/yjb/manage/login'
|
||||
},
|
||||
|
||||
toBuildPage() {
|
||||
location = '/gb/yjb/OutsideWall/BuildingResult'
|
||||
},
|
||||
loading_false() { this.loading = false },
|
||||
|
||||
download(url, filename, callback) {
|
||||
let _this = this;
|
||||
axios({
|
||||
headers: { 'Content-Type': 'application/json;charset=UTF-8' },
|
||||
method: 'post',
|
||||
url: url,
|
||||
data: {},
|
||||
responseType: "blob",
|
||||
headers: {
|
||||
Authorization: 'Bearer ' + _this.token
|
||||
}
|
||||
}).then(function (response) {
|
||||
console.log(response);
|
||||
//解析文件充blod中解析
|
||||
const url = window.URL.createObjectURL(
|
||||
new Blob([response.data], { type: "application/vnd.ms-excel" })
|
||||
);
|
||||
const link = document.createElement("a");
|
||||
link.style.display = "none";
|
||||
link.href = url;
|
||||
link.setAttribute("download", filename);
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
callback();
|
||||
}).catch(function (error) {
|
||||
callback();
|
||||
console.log(error)
|
||||
_this.$message({
|
||||
type: 'error',
|
||||
message: error.message
|
||||
})
|
||||
})
|
||||
},
|
||||
getMonthWeek(now) {
|
||||
var a = now.getYear();
|
||||
var b = now.getMonth() + 1;
|
||||
var c = now.getDate();
|
||||
/*
|
||||
a = d = 当前日期
|
||||
b = 6 - w = 当前周的还有几天过完(不算今天)
|
||||
a + b 的和在除以7 就是当天是当前月份的第几周
|
||||
*/
|
||||
var date = new Date(a, parseInt(b) - 1, c), w = date.getDay(), d = date.getDate();
|
||||
return Math.ceil(
|
||||
(d + 6 - w) / 7
|
||||
);
|
||||
},
|
||||
dateFormat(fmt, d) {
|
||||
const date = new Date(d);
|
||||
let ret;
|
||||
const opt = {
|
||||
"Y+": date.getFullYear().toString(), // 年
|
||||
"m+": (date.getMonth() + 1).toString(), // 月
|
||||
"d+": date.getDate().toString(), // 日
|
||||
"H+": date.getHours().toString(), // 时
|
||||
"M+": date.getMinutes().toString(), // 分
|
||||
"S+": date.getSeconds().toString() // 秒
|
||||
// 有其他格式化字符需求可以继续添加，必须转化成字符串
|
||||
};
|
||||
for (let k in opt) {
|
||||
ret = new RegExp("(" + k + ")").exec(fmt);
|
||||
if (ret) {
|
||||
fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0")))
|
||||
};
|
||||
};
|
||||
return fmt;
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<style lang="less">
|
||||
.my-img {
|
||||
display: none;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
</style>
|
||||
<style scoped>
|
||||
.demo-table-expand .el-form-item {
|
||||
border-bottom: 1px solid rgb(204, 204, 204);
|
||||
}
|
||||
|
||||
.blocks {
|
||||
display: flex;
|
||||
text-align: center;
|
||||
justify-content: space-between;
|
||||
flex-wrap: wrap;
|
||||
max-width: 1000px;
|
||||
}
|
||||
|
||||
.block {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-grow: 0;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.block .title {
|
||||
margin-bottom: 10px;
|
||||
font-size: 14px;
|
||||
color: #8492a6;
|
||||
}
|
||||
|
||||
.el-avatar {
|
||||
background: none !important;
|
||||
}
|
||||
|
||||
.el-avatar img {
|
||||
margin: 0 auto;
|
||||
width: inherit;
|
||||
height: auto !important;
|
||||
}
|
||||
|
||||
.el-upload-list__item:first-child {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
.el-upload-list__item {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
.upload-demo {
|
||||
margin-bottom: 20px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 4px;
|
||||
padding: 5px;
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
|
||||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.el-upload-dragger {
|
||||
width: 200px !important;
|
||||
height: 50px !important;
|
||||
}
|
||||
|
||||
.el-upload-dragger .el-icon-upload {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.el-upload-dragger .el-upload__text {
|
||||
line-height: 50px !important;
|
||||
}
|
||||
|
||||
.el-upload__tip {
|
||||
margin-top: -23px !important;
|
||||
}
|
||||
|
||||
.demo-table-expand {
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
.demo-table-expand label {
|
||||
/* width: 90px;*/
|
||||
color: #99a9bf;
|
||||
}
|
||||
|
||||
.demo-table-expand .el-form-item {
|
||||
margin-right: 0;
|
||||
margin-bottom: 5px;
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
.buhuanhang {
|
||||
white-space: nowrap;
|
||||
width: 21%;
|
||||
}
|
||||
|
||||
.text {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.item {
|
||||
padding: 18px 0;
|
||||
}
|
||||
|
||||
.box-card {
|
||||
width: 98%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.el-card__body {
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
.el-card__body p {
|
||||
margin: 0px;
|
||||
margin-bottom: 5px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.el-radio.is-bordered {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.el-radio-button--small .el-radio-button__inner {
|
||||
border-left: 1px solid #DCDFE6;
|
||||
}
|
||||
</style>
|
||||
<style scoped>
|
||||
.buhuanhang {
|
||||
white-space: nowrap;
|
||||
width: 21%;
|
||||
}
|
||||
|
||||
.text {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.item {
|
||||
padding: 18px 0;
|
||||
}
|
||||
|
||||
.box-card {
|
||||
width: 98%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.el-card__body {
|
||||
padding: 12px;
|
||||
}
|
||||
|
||||
.el-card__body p {
|
||||
margin: 0px;
|
||||
margin-bottom: 5px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.el-radio.is-bordered {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.el-radio-button--small .el-radio-button__inner {
|
||||
border-left: 1px solid #DCDFE6;
|
||||
}
|
||||
</style>
|
||||
|
||||
</html>
|
||||
Reference in New Issue
Block a user