165 lines
5.0 KiB
Vue
165 lines
5.0 KiB
Vue
<template>
|
|
<view :style="themeColor">
|
|
<view class="page" v-if="detail">
|
|
<view class="form-banner">
|
|
<image :src="$util.img('public/uniapp/form/banner.png')" mode="widthFix"></image>
|
|
</view>
|
|
<view class="system-form-wrap">
|
|
<view class="form-title">{{ $lang('form.form.title') }}</view>
|
|
<ns-form :data="detail.json_data" :formConfig="detail.form_config" ref="form"></ns-form>
|
|
<button type="primary" size="mini" class="button mini" @click="create()">{{ $lang('common.submit') }}</button>
|
|
</view>
|
|
</view>
|
|
<ns-empty :text="complete ? $lang('form.form.submitSuccess') : $lang('form.form.noFormInfo')" v-else></ns-empty>
|
|
|
|
<loading-cover ref="loadingCover"></loading-cover>
|
|
<ns-login ref="login"></ns-login>
|
|
<to-top v-if="showTop" @toTop="scrollToTopNative()"></to-top>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import scroll from '@/common/js/scroll-view.js';
|
|
|
|
export default {
|
|
mixins: [scroll],
|
|
data() {
|
|
return {
|
|
id: 0,
|
|
detail: null,
|
|
isRepeat: false,
|
|
complete: false,
|
|
scroll:true
|
|
};
|
|
},
|
|
onLoad(data) {
|
|
// #ifdef MP-ALIPAY
|
|
let options = my.getLaunchOptionsSync();
|
|
options.query && Object.assign(data, options.query)
|
|
// #endif
|
|
|
|
this.id = data.id || 0;
|
|
if (data.scene) {
|
|
var sceneParams = decodeURIComponent(data.scene);
|
|
sceneParams = sceneParams.split('&');
|
|
if (sceneParams.length) {
|
|
sceneParams.forEach(item => {
|
|
if (item.indexOf('id') != -1) this.id = item.split('-')[1];
|
|
});
|
|
}
|
|
}
|
|
},
|
|
onShow() {
|
|
if (!this.storeToken) {
|
|
this.redirectTologin('/pages_tool/form/form?id=' + this.id);
|
|
return;
|
|
}
|
|
|
|
this.getData();
|
|
},
|
|
watch: {
|
|
storeToken: function(nVal, oVal) {
|
|
if (nVal) this.getData();
|
|
}
|
|
},
|
|
methods: {
|
|
getData() {
|
|
this.$api.sendRequest({
|
|
url: '/form/api/form/info',
|
|
data: {
|
|
form_id: this.id
|
|
},
|
|
success: res => {
|
|
if (res.code == 0 && res.data) {
|
|
this.detail = res.data;
|
|
}
|
|
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
|
|
},
|
|
fail: res => {
|
|
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
|
|
}
|
|
});
|
|
},
|
|
create() {
|
|
if (this.$refs.form.verify()) {
|
|
if (this.isRepeat) return;
|
|
this.isRepeat = true;
|
|
|
|
this.$api.sendRequest({
|
|
url: '/form/api/form/create',
|
|
data: {
|
|
form_id: this.id,
|
|
form_data: typeof this.$refs.form.formData === 'string' ? this.$refs.form.formData : JSON.stringify(this.$refs.form.formData)
|
|
},
|
|
success: res => {
|
|
if (res.code == 0) {
|
|
this.$util.showToast({ title: this.$lang('form.form.submitSuccess') })
|
|
setTimeout(() => {
|
|
this.complete = true;
|
|
this.detail = null;
|
|
}, 1500)
|
|
} else {
|
|
this.isRepeat = false;
|
|
this.$util.showToast({ title: res.message })
|
|
}
|
|
}
|
|
});
|
|
}
|
|
},
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
|
|
.form-banner {
|
|
width: 100vw;
|
|
line-height: 1;
|
|
|
|
image {
|
|
width: 100%;
|
|
line-height: 1;
|
|
}
|
|
}
|
|
|
|
.system-form-wrap {
|
|
background: $color-bg;
|
|
border-radius: 32rpx;
|
|
overflow: hidden;
|
|
margin: 0 0 60rpx 0;
|
|
padding: 0 26rpx;
|
|
transform: translateY(-40rpx);
|
|
|
|
.form-title {
|
|
line-height: 100rpx;
|
|
padding-top: 20rpx;
|
|
}
|
|
|
|
.button {
|
|
height: 80rpx;
|
|
line-height: 80rpx !important;
|
|
margin-top: 30rpx !important;
|
|
width: 100%;
|
|
border-radius: 80rpx;
|
|
}
|
|
|
|
::v-deep .form-wrap {
|
|
background: #fff;
|
|
padding: 30rpx;
|
|
border-radius: 32rpx;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<style lang="scss" scoped>
|
|
::v-deep .mescroll-totop {
|
|
/* #ifdef H5 */
|
|
right: 27rpx !important;
|
|
bottom: 120rpx !important;
|
|
/* #endif */
|
|
/* #ifdef MP */
|
|
right: 27rpx !important;
|
|
bottom: 180rpx !important;
|
|
/* #endif */
|
|
}
|
|
</style> |