|
@@ -1,72 +1,112 @@
|
|
|
<template>
|
|
|
- <view class="back-content">
|
|
|
- <!-- 轮播图 -->
|
|
|
- <view class="paizhao">
|
|
|
- <view class="icon">
|
|
|
- <u-icon name="xianchangpaishe" custom-prefix="xd-icon" size="64" color="#888888"></u-icon>
|
|
|
+ <view class="back-body">
|
|
|
+ <view class="back-content">
|
|
|
+ <!-- 轮播图 -->
|
|
|
+ <view class="paizhao">
|
|
|
+ <view class="icon">
|
|
|
+ <u-icon name="xianchangpaishe" custom-prefix="xd-icon" size="64" color="#888888"></u-icon>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <swiper v-if="backlogPhotoList.length" class="top-ad-swiper" :indicator-dots="false" :autoplay="true" :interval="5000" :duration="600" :circular="true">
|
|
|
+ <swiper-item v-for="(item,index) in backlogPhotoList" :key="index">
|
|
|
+ <div class="swiper-item uni-bg-red">
|
|
|
+ <!-- <image class="swiper-item-imgse" :fade-show='true' :src="item.photo"></image> -->
|
|
|
+ <u-image mode="scaleToFill" width="750upx" height="400upx" :src="item.photo"></u-image>
|
|
|
+ </div>
|
|
|
+ </swiper-item>
|
|
|
+ </swiper>
|
|
|
+ <u-form class="form-content" :model="form" ref="uForm" label-width="180">
|
|
|
+ <u-form-item label="门店" prop="storeName">
|
|
|
+ <u-input @click="chooseStore" input-align="right" v-model="form.storeName" disabled placeholder="请选择门店" />
|
|
|
+ <u-icon name="icon-xian-11" custom-prefix="xd-icon" size="30" color="#888888"></u-icon>
|
|
|
+ </u-form-item>
|
|
|
+ <u-form-item label="考评指标" prop="clsName">
|
|
|
+ <u-input @click="chooseClsName" input-align="right" v-model="form.clsName" disabled placeholder="请选择考评指标" />
|
|
|
+ <u-icon name="icon-xian-11" custom-prefix="xd-icon" size="30" color="#888888"></u-icon>
|
|
|
+ </u-form-item>
|
|
|
+ <u-form-item label="处理人" prop="putUser">
|
|
|
+ <u-input input-align="right" v-model="form.clsName" disabled placeholder="请选择处理人" />
|
|
|
+ <u-icon name="icon-xian-11" custom-prefix="xd-icon" size="30" color="#888888"></u-icon>
|
|
|
+ </u-form-item>
|
|
|
+ <u-form-item label="抄送人" prop="receiveUser">
|
|
|
+ <u-input input-align="right" v-model="form.clsName" disabled placeholder="请选择抄送人" />
|
|
|
+ <u-icon name="icon-xian-11" custom-prefix="xd-icon" size="30" color="#888888"></u-icon>
|
|
|
+ </u-form-item>
|
|
|
+ <u-form-item label="整改到期日" prop="effectiveEndTime" >
|
|
|
+ <u-input @click="showPicker=true" input-align="right" v-model="form.effectiveEndTime" disabled placeholder="请选择整改到期日" />
|
|
|
+ <u-icon name="icon-xian-11" custom-prefix="xd-icon" size="30" color="#888888"></u-icon>
|
|
|
+ </u-form-item>
|
|
|
+ </u-form>
|
|
|
+ <view class="remarks">
|
|
|
+ <u-input v-model="remarks" type="textarea" placeholder="请输入备注..." />
|
|
|
</view>
|
|
|
</view>
|
|
|
- <swiper v-if="backlogPhotoList.length" class="top-ad-swiper" :indicator-dots="false" :autoplay="true" :interval="5000" :duration="600" :circular="true">
|
|
|
- <swiper-item v-for="(item,index) in backlogPhotoList" :key="index">
|
|
|
- <div class="swiper-item uni-bg-red">
|
|
|
- <!-- <image class="swiper-item-imgse" :fade-show='true' :src="item.photo"></image> -->
|
|
|
- <u-image mode="scaleToFill" width="750upx" height="400upx" :src="item.photo"></u-image>
|
|
|
- </div>
|
|
|
- </swiper-item>
|
|
|
- </swiper>
|
|
|
- <u-form class="form-content" :model="form" ref="uForm" label-width="180">
|
|
|
- <u-form-item label="门店" prop="storeName">
|
|
|
- <u-input clearable v-model="form.storeName" disabled placeholder="请选择发起时间区间" @click="openPicker"/>
|
|
|
- </u-form-item>
|
|
|
- <u-form-item label="考评指标" prop="clsName">
|
|
|
- <u-input v-model="form.clsName" placeholder="请输入门店名称" />
|
|
|
- </u-form-item>
|
|
|
- <!-- <u-form-item label="处理人" prop="userName">
|
|
|
- <u-input v-model="form.userName" placeholder="请输入巡店人名称" />
|
|
|
- </u-form-item>
|
|
|
- <u-form-item label="抄送" prop="status" label-position="top">
|
|
|
- <view :class="['status-item', item.checked ? 'active' : '']" v-for="item in statusList" :key="item.id" @click="chooseStatus(item)">
|
|
|
- {{item.dispName}}
|
|
|
- </view>
|
|
|
- </u-form-item>
|
|
|
- <u-form-item label="整改到期日" prop="sourceType" label-position="top">
|
|
|
- <view :class="['status-item', item.checked ? 'active' : '']" v-for="item in sourceTypeList" :key="item.id" @click="chooseSourceType(item)">
|
|
|
- {{item.dispName}}
|
|
|
- </view>
|
|
|
- </u-form-item> -->
|
|
|
- </u-form>
|
|
|
-
|
|
|
+ <u-button class="save-btn" type="primary">保存</u-button>
|
|
|
+ <!-- 时间选择器 -->
|
|
|
+ <mx-date-picker class="date-picker" :show="showPicker" type="date" format="yyyy-mm-dd" :value="form.effectiveEndTime" :show-tips="true" @confirm="onSelected" @cancel="showPicker=false" />
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+ import MxDatePicker from "@/components/mx-datepicker/mx-datepicker.vue"
|
|
|
export default {
|
|
|
components: {
|
|
|
+ MxDatePicker
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
// 顶部轮播图片
|
|
|
backlogPhotoList:[],
|
|
|
+ showPicker: false, // 是否显示时间弹窗
|
|
|
form: {
|
|
|
storeName: '', // 门店
|
|
|
- clsName: '' ,// 考评指标
|
|
|
-
|
|
|
- }
|
|
|
+ clsName: '',// 考评指标
|
|
|
+ putUser: '', // 处理人
|
|
|
+ receiveUser: '', // 抄送人
|
|
|
+ effectiveEndTime: '' // 整改到期日
|
|
|
+ },
|
|
|
+ remarks: '' // 备注
|
|
|
}
|
|
|
},
|
|
|
onLoad(option) {
|
|
|
|
|
|
},
|
|
|
methods: {
|
|
|
-
|
|
|
+ // 确认日期选择
|
|
|
+ onSelected (v) {
|
|
|
+ console.log(v,'vvvvvvvv')
|
|
|
+ this.form.effectiveEndTime = v.value
|
|
|
+ this.showPicker = false
|
|
|
+ },
|
|
|
+ // 选择门店
|
|
|
+ chooseStore () {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/spotCheckConfigure/evaluateStore'
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 选择考评指标
|
|
|
+ chooseClsName () {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: '/pages/spotCheckConfigure/evaluateItem'
|
|
|
+ })
|
|
|
+ }
|
|
|
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
- .back-content {
|
|
|
+ .back-body {
|
|
|
+ height: 100%;
|
|
|
+ background-color: #eee;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ .back-content {
|
|
|
+ flex: 1;
|
|
|
+ overflow-y: scroll;
|
|
|
+ }
|
|
|
.paizhao {
|
|
|
+ background-color: #fff;
|
|
|
height: 340upx;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
@@ -80,12 +120,29 @@
|
|
|
justify-content: center;
|
|
|
}
|
|
|
}
|
|
|
+ .text-right {
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
.top-ad-swiper{
|
|
|
+ background-color: #fff;
|
|
|
height: 340upx;
|
|
|
}
|
|
|
.swiper-item-imgse{
|
|
|
width: 750upx;
|
|
|
height: 340upx;
|
|
|
}
|
|
|
+ .form-content{
|
|
|
+ background-color: #fff;
|
|
|
+ padding: 0 30upx;
|
|
|
+ }
|
|
|
+ .remarks{
|
|
|
+ background-color: #fff;
|
|
|
+ padding: 0 30upx;
|
|
|
+ margin-top: 20upx;
|
|
|
+ }
|
|
|
+ .save-btn{
|
|
|
+ width: 90%;
|
|
|
+ margin-bottom: 20upx;
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|