943 lines
48 KiB
Plaintext
943 lines
48 KiB
Plaintext
@*
|
||
For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
|
||
*@
|
||
@{
|
||
}
|
||
|
||
<!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/dist/vue.min.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"*@
|
||
<el-upload class="upload-demo" drag action="/gb/yjb/api/outsidewall/sysFileInfo/upload" multiple :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" multiple :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" multiple :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" multiple :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" multiple :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.submit2();
|
||
} else {
|
||
if (this.$refs[formNameChild])
|
||
this.$refs[formNameChild].validate((valid) => {
|
||
if (valid) {
|
||
debugger
|
||
_this.submit2();
|
||
}
|
||
});
|
||
}
|
||
}
|
||
});
|
||
},
|
||
submit2() {
|
||
debugger;
|
||
let _this = this;
|
||
//let config = {
|
||
// //formData 提交请求头有两种 multipart/form-data 和 application/x-www-form-urlencoded
|
||
// // multipart/form-data 用于type=file 的input提交
|
||
// headers: {
|
||
// "Content-Type": "multipart/form-data"
|
||
// }
|
||
//};
|
||
//const fd = new FormData()
|
||
//fd.append('appid', "123")
|
||
//fd.append('wall', _this.form)
|
||
//for (let _i in _this.fileList) {
|
||
// fd.append('file', _i)
|
||
//}
|
||
//axios.post('/gb/yjb/api/outsidewall/submit', fd, config).then(res => {
|
||
// debugger
|
||
//}).catch(error => {
|
||
// console.log(error);
|
||
//});
|
||
|
||
|
||
axios({
|
||
headers: { 'Content-Type': 'multipart/form-data' },
|
||
method: 'post',
|
||
url: '/gb/yjb/api/outsidewall/submit',
|
||
data: _this.form,
|
||
responseType: "json",
|
||
}).then(async response => {
|
||
if (response.data?.data?.success == true) {
|
||
let token = response.data.data.token;
|
||
localStorage.setItem("_token", token)
|
||
_this.$alert(`<div>提交成功</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) });
|
||
}
|
||
_this.loading = false;
|
||
}).catch(async error => {
|
||
console.log(error)
|
||
_this.$message({
|
||
type: 'error',
|
||
message: error.message
|
||
})
|
||
_this.loading = false;
|
||
})
|
||
},
|
||
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> |