eam
/
eam-uniapp
8
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

fix: SBBJ-790app巡检点检，点击重置，内容应重置，现没有重置

master
张立 2 months ago
parent
f0c1143f27
commit
7584aaf377
1 changed files with 465 additions and 466 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 917
      src/pages/spotCheckOrder/addForm.vue

917
src/pages/spotCheckOrder/addForm.vue
View File

@ -1,58 +1,53 @@
<template> <template>
<!-- 添加设备报修 --> <!-- 添加设备报修 -->
<view class="add-form-container"> <view class="add-form-container">
<u-form :model="form" ref="formRef" label-width="160rpx"> <u-form :model="form" ref="formRef" label-width="160rpx">
<u-form-item label="点检描述" prop="describes" required> <u-form-item label="点检描述" prop="describes" required>
<u-input v-model="form.describes" placeholder="请输入点检描述" /> <u-input v-model="form.describes" placeholder="请输入点检描述" />
</u-form-item> </u-form-item>
<u-form-item :label="`${type=='DEVICE'?'设备' : '模具'}编码`" prop="deviceNumber" required> <u-form-item :label="`${type == 'DEVICE' ? '设备' : '模具'}编码`" prop="deviceNumber" required>
<u-input v-model="form.deviceNumber" :placeholder="`请输入${type=='DEVICE'?'设备' : '模具'}编码`" @blur="blur" <u-input v-model="form.deviceNumber" :placeholder="`请输入${type == 'DEVICE' ? '设备' : '模具'}编码`" @blur="blur" @confirm="blur()" />
@confirm='blur()' /> <view class="right-button" @click="chickRightButton"> 扫描 </view>
<view class="right-button" @click="chickRightButton"> </u-form-item>
扫描 <u-form-item :label="`${type == 'DEVICE' ? '设备' : '模具'}名称`" prop="deviceName" required class="disabled">
</view> <u-input v-model="form.deviceName" :placeholder="`请输入${type == 'DEVICE' ? '设备' : '模具'}名称`" disabled />
</u-form-item> </u-form-item>
<u-form-item :label="`${type=='DEVICE'?'设备' : '模具'}名称`" prop="deviceName" required class="disabled"> <u-form-item label="点检人" prop="name" required class="disabled">
<u-input v-model="form.deviceName" :placeholder="`请输入${type=='DEVICE'?'设备' : '模具'}名称`" disabled /> <u-input v-model="store.name" placeholder="请输入点检人" disabled />
</u-form-item> </u-form-item>
<u-form-item label="点检人" prop="name" required class="disabled"> <u-form-item label="班次" prop="classes" required>
<u-input v-model=" store.name" placeholder="请输入点检人" disabled /> <view class="select" @click="openSingleColumn('classes', form.classes, maintenanceShift)">
</u-form-item> <view class="input" v-if="form.classes">
<u-form-item label="班次" prop="classes" required> {{ form.classesName }}
<view class="select" @click="openSingleColumn('classes',form.classes,maintenanceShift)"> </view>
<view class="input" v-if='form.classes'> <view class="placeholder" v-else>
{{form.classesName}} {{ `请选择班次` }}
</view> </view>
<view class="placeholder" v-else> <u-icon name="arrow-right" color="#aaaaaa" size="28"></u-icon>
{{`请选择班次`}} </view>
</view> </u-form-item>
<u-icon name="arrow-right" color="#aaaaaa" size="28"></u-icon> </u-form>
</view> <view class="list">
</u-form-item> <!-- <view class="title">
</u-form>
<view class="list">
<!-- <view class="title">
<span></span>备件 <span></span>备件
</view> --> </view> -->
<view class="item " v-for="(item,index) in subList" :key="index"> <view class="item" v-for="(item, index) in subList" :key="index">
<view class="item-box"> <view class="item-box">
<view class="spare-title"> <view class="spare-title">
<view class="title-txt"> <view class="title-txt">
{{item.name}} {{ item.name }}
</view> </view>
</view> </view>
<u-row gutter="16"> <u-row gutter="16">
<u-col :span="12"> <u-col :span="12">
<view class="dec"> <view class="dec">
<view class=""> <view class=""> 设备部位名称: </view>
设备部位名称: <view>{{ item.equipmentParts }}</view>
</view> </view>
<view>{{item.equipmentParts}}</view> <view class="dec">
</view> <!-- <view style="margin-right: 20rpx;">是否符合:</view><u-switch v-model="item.isConform1"></u-switch> -->
<view class="dec"> <u-radio-group v-model="item.isConform" @change="radioGroupChange">
<!-- <view style="margin-right: 20rpx;">是否符合:</view><u-switch v-model="item.isConform1"></u-switch> --> <!-- <u-radio
<u-radio-group v-model="item.isConform" @change="radioGroupChange">
<!-- <u-radio
@change="radioChange" @change="radioChange"
v-for="(item, index) in list" :key="index" v-for="(item, index) in list" :key="index"
:name="item.name" :name="item.name"
@ -60,461 +55,465 @@
> >
{{item.name}} {{item.name}}
</u-radio> --> </u-radio> -->
<u-radio name="TRUE">符合</u-radio> <u-radio name="TRUE">符合</u-radio>
<u-radio name="FALSE">不符合</u-radio> <u-radio name="FALSE">不符合</u-radio>
</u-radio-group> </u-radio-group>
</view>
</view> <view class="dec">
<view class="dec"> <view class="">
<view class=""> <span v-if="item.numberNeedSwitch" class="required">*</span>
<span v-if="item.numberNeedSwitch" class="required">*</span> 巡检点检记录:
巡检点检记录: </view>
</view> <u-input v-model="item.records" :placeholder="'请输入巡检点检记录'" :class="{ error: item.numberNeedSwitch && !item.records }" />
<u-input </view>
v-model="item.records" <view class="image" style="margin-top: 20rpx">
:placeholder="'请输入巡检点检记录'" <view class="image-list" :key="refreshKey">
:class="{'error': item.numberNeedSwitch && !item.records}" <view class="image-item" v-for="(element, index) in item.imgList" :key="index">
/> <image :src="element" mode=""></image>
</view> <u-icon name="close-circle-fill" color="red" class="close" size="36" @click="delImage(index)"> </u-icon>
<view class="image" style="margin-top: 20rpx;"> </view>
<view class="image-list" :key="refreshKey"> </view>
<view class="image-item" v-for="(element,index) in item.imgList" :key="index"> <view class="image-item image-item1" @click="chooseImage(item)">
<image :src="element" mode=""></image> <image src="../../static/images/photo.png" mode=""></image>
<u-icon name="close-circle-fill" color="red" class="close" size="36" @click="delImage(index)"> </view>
</u-icon> </view>
</view> <!-- <view class="dec">
</view>
<view class="image-item image-item1" @click="chooseImage(item)">
<image src="../../static/images/photo.png" mode=""></image>
</view>
</view>
<!-- <view class="dec">
<view style="margin-right: 20rpx;">是否符合:</view> <view style="margin-right: 20rpx;">是否符合:</view>
<input type="radio" v-model="item.isConform1" value="true"> 是 <input type="radio" v-model="item.isConform1" value="true"> 是
<input type="radio" v-model="item.isConform1" value="false"> 否 <input type="radio" v-model="item.isConform1" value="false"> 否
</view> --> </view> -->
</u-col> </u-col>
</u-row> </u-row>
</view> </view>
</view> </view>
</view> </view>
<view class="footer"> <view class="footer">
<view class="btns"> <view class="btns">
<button class="reset" @click="reset">重置</button> <button class="reset" @click="reset">重置</button>
<button class="sure" @click="submit" :loading='loading' :disabled='loading'>确定</button> <button class="sure" @click="submit" :loading="loading" :disabled="loading">确定</button>
</view> </view>
<view style="height: constant(safe-area-inset-bottom); height: env(safe-area-inset-bottom);"></view> <view style="height: constant(safe-area-inset-bottom); height: env(safe-area-inset-bottom)"></view>
</view> </view>
<u-select v-model="singleColumnShow" mode="single-column" :default-value='singleColumnDefaultValue' <u-select v-model="singleColumnShow" mode="single-column" :default-value="singleColumnDefaultValue" :list="singleColumnList" @confirm="chooseSingleColumn" @cancle="singleColumnShow = false"></u-select>
:list="singleColumnList" @confirm="chooseSingleColumn" @cancle='singleColumnShow = false'></u-select> </view>
</view>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { import { onLoad } from '@dcloudio/uni-app'
onLoad import { ref, getCurrentInstance } from 'vue'
} from '@dcloudio/uni-app'
import {
ref,
getCurrentInstance
} from 'vue'
import * as deviceApi from "@/api/device"
import * as moldApi from "@/api/mold"
import * as spotCheckOrderApi from "@/api/spotCheckOrder"
import * as dictApi from "@/api/dict"
import { useCountStore } from '@/store'
import * as uploadApi from "@/api/upload"
const { proxy } = getCurrentInstance() import * as deviceApi from '@/api/device'
// 获取自定义的store import * as moldApi from '@/api/mold'
const store = useCountStore() import * as spotCheckOrderApi from '@/api/spotCheckOrder'
import * as dictApi from '@/api/dict'
import { useCountStore } from '@/store'
import * as uploadApi from '@/api/upload'
const loading = ref(false) const { proxy } = getCurrentInstance()
const type = ref('') // 获取自定义的store
const imgList = ref([]) const store = useCountStore()
const list = ref([{
name: 'apple',
disabled: false
},
{
name: 'banner',
disabled: false
},
{
name: 'orange',
disabled: false
}])
const form = ref({
describes: "",
deviceNumber: '',
deviceName: '',
maintenances: '',
classes: '',
classesName: ''
})
const singleColumnShow = ref(false)
const singleColumnDefaultValue = ref([])
const singleColumnList = ref([])
const field = ref('')
const maintenanceShift = ref([])
const subList = ref([])
const refreshKey = ref(0);
// 扫描设备条码
function chickRightButton(field) {
uni.scanCode({
success: function (res) {
form.value.deviceNumber = res.result
getDetailsByNumber()
getSubList()
}
});
}
function blur() {
if (form.value.deviceNumber) {
getDetailsByNumber()
getSubList()
}
}
// 根据设备/模具号查询信息
function getDetailsByNumber() {
const data = {
number: form.value.deviceNumber,
flag: 2
}
if (type.value == 'MOLD') {
moldApi.getMoldDetailsByNumber(data).then((res) => {
if (res.data) {
form.value.deviceName = res.data.name
} else {
proxy.$modal.showToast(`找不到该${type.value == 'DEVICE' ? '设备' : '模具'}`)
}
}).catch(() => { })
} else {
deviceApi.getDeviceDetailsByNumber(data).then((res) => {
if (res.data) {
form.value.deviceName = res.data.name
} else {
proxy.$modal.showToast(`找不到该${type.value == 'DEVICE' ? '设备' : '模具'}`)
}
}).catch(() => { })
}
} const loading = ref(false)
// 根据设备获取二级列表 const type = ref('')
function getSubList() { const imgList = ref([])
const data = { const list = ref([
number: form.value.deviceNumber {
} name: 'apple',
deviceApi.getSubList(data).then((res) => { disabled: false
if (res.data) { },
subList.value = res.data {
subList.value.forEach(item => { name: 'banner',
item.isConform = 'TRUE' disabled: false
item.records = '' },
}) {
} else { name: 'orange',
proxy.$modal.showToast(`找不到该${type.value == 'DEVICE' ? '设备' : '模具'}`) disabled: false
} }
}).catch(() => { }) ])
} const form = ref({
//提交 describes: '',
function submit() { deviceNumber: '',
// 校验 deviceName: '',
if (!form.value.describes) { maintenances: '',
proxy.$modal.showToast('请输入点检描述'); classes: '',
return; classesName: ''
} })
if (!form.value.deviceNumber) { const singleColumnShow = ref(false)
proxy.$modal.showToast(`请输入${type.value == 'DEVICE' ? '设备' : '模具'}编码`); const singleColumnDefaultValue = ref([])
return; const singleColumnList = ref([])
} const field = ref('')
if (!form.value.classes) { const maintenanceShift = ref([])
proxy.$modal.showToast('请选择班次'); const subList = ref([])
return; const refreshKey = ref(0)
} // 扫描设备条码
if (subList.value.length == 0) { function chickRightButton(field) {
proxy.$modal.showToast('该设备无检修项目'); uni.scanCode({
return; success(res) {
} form.value.deviceNumber = res.result
getDetailsByNumber()
// 校验 subList 中的巡检点检记录 getSubList()
let hasError = false; }
subList.value.forEach(item => { })
if (item.numberNeedSwitch && !item.records) { }
hasError = true; function blur() {
item.error = true; // 设置错误标记 if (form.value.deviceNumber) {
} else { getDetailsByNumber()
item.error = false; // 清除错误标记 getSubList()
} }
}); }
// 根据设备/模具号查询信息
function getDetailsByNumber() {
const data = {
number: form.value.deviceNumber,
flag: 2
}
if (type.value == 'MOLD') {
moldApi
.getMoldDetailsByNumber(data)
.then((res) => {
if (res.data) {
form.value.deviceName = res.data.name
} else {
proxy.$modal.showToast(`找不到该${type.value == 'DEVICE' ? '设备' : '模具'}`)
}
})
.catch(() => {})
} else {
deviceApi
.getDeviceDetailsByNumber(data)
.then((res) => {
if (res.data) {
form.value.deviceName = res.data.name
} else {
proxy.$modal.showToast(`找不到该${type.value == 'DEVICE' ? '设备' : '模具'}`)
}
})
.catch(() => {})
}
}
// 根据设备获取二级列表
function getSubList() {
const data = {
number: form.value.deviceNumber
}
deviceApi
.getSubList(data)
.then((res) => {
if (res.data) {
subList.value = res.data
subList.value.forEach((item) => {
item.isConform = 'TRUE'
item.records = ''
})
} else {
proxy.$modal.showToast(`找不到该${type.value == 'DEVICE' ? '设备' : '模具'}`)
}
})
.catch(() => {})
}
// 提交
function submit() {
// 校验
if (!form.value.describes) {
proxy.$modal.showToast('请输入点检描述')
return
}
if (!form.value.deviceNumber) {
proxy.$modal.showToast(`请输入${type.value == 'DEVICE' ? '设备' : '模具'}编码`)
return
}
if (!form.value.classes) {
proxy.$modal.showToast('请选择班次')
return
}
if (subList.value.length == 0) {
proxy.$modal.showToast('该设备无检修项目')
return
}
if (hasError) { // 校验 subList 中的巡检点检记录
proxy.$modal.showToast('请填写所有必填的巡检点检记录'); let hasError = false
return; subList.value.forEach((item) => {
} if (item.numberNeedSwitch && !item.records) {
hasError = true
item.error = true // 设置错误标记
} else {
item.error = false // 清除错误标记
}
})
const data = { if (hasError) {
describes: form.value.describes, proxy.$modal.showToast('请填写所有必填的巡检点检记录')
deviceNumber: form.value.deviceNumber, return
maintenances: form.value.maintenances, }
classes: form.value.classes,
subList: subList.value,
type: type.value
};
proxy.$modal.confirm('是否添加点检工单').then(() => { const data = {
proxy.$modal.loading('加载中'); describes: form.value.describes,
loading.value = true; deviceNumber: form.value.deviceNumber,
spotCheckOrderApi.spotCheckOrderCreate(data, type.value).then((res) => { maintenances: form.value.maintenances,
proxy.$modal.closeLoading(); classes: form.value.classes,
if (res.data) { subList: subList.value,
proxy.$modal.showToast('添加成功'); type: type.value
setTimeout(() => { }
proxy.$tab.navigateBack();
loading.value = false;
}, 1500);
} else {
if (res.msg) {
proxy.$modal.showToast(res.msg);
} else {
proxy.$modal.showToast('添加失败');
}
loading.value = false;
}
}).catch(() => {
proxy.$modal.closeLoading();
loading.value = false;
});
});
}
// 重置
function reset() {
form.value = {
describes: "",
deviceNumber: '',
deviceName: '',
maintenances: '',
classes: ''
}
}
// 单列模式 proxy.$modal.confirm('是否添加点检工单').then(() => {
function openSingleColumn(fieldName, val, list) { proxy.$modal.loading('加载中')
singleColumnList.value = list loading.value = true
field.value = fieldName spotCheckOrderApi
if (val) { .spotCheckOrderCreate(data, type.value)
singleColumnDefaultValue.value = [list.findIndex(item => item.value == val)] .then((res) => {
} else { proxy.$modal.closeLoading()
singleColumnDefaultValue.value = [] if (res.data) {
} proxy.$modal.showToast('添加成功')
singleColumnShow.value = true setTimeout(() => {
} proxy.$tab.navigateBack()
// 单列模式点击确定之后 loading.value = false
function chooseSingleColumn(e) { }, 1500)
form.value[field.value] = e[0].value } else {
if (field.value == 'classes') { if (res.msg) {
form.value.classesName = e[0].label proxy.$modal.showToast(res.msg)
} } else {
singleColumnShow.value = false proxy.$modal.showToast('添加失败')
} }
loading.value = false
}
})
.catch(() => {
proxy.$modal.closeLoading()
loading.value = false
})
})
}
// 重置
function reset() {
form.value = {
describes: '',
deviceNumber: '',
deviceName: '',
maintenances: '',
classes: ''
}
subList.value = []
}
function chooseImage(dataItem) { // 单列模式
uni.chooseImage({ function openSingleColumn(fieldName, val, list) {
count: 1, // 默认9 singleColumnList.value = list
sizeType: ['compressed'], // 可以指定是原图还是压缩图，默认二者都有 field.value = fieldName
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有 if (val) {
success: (res) => { singleColumnDefaultValue.value = [list.findIndex((item) => item.value == val)]
let filePath = res.tempFilePaths[0] } else {
proxy.$modal.loading() singleColumnDefaultValue.value = []
const fileInfo = ref({ }
name: res.tempFiles[0].name, singleColumnShow.value = true
url: '' }
}) // 单列模式点击确定之后
uploadApi.uploadFile({ function chooseSingleColumn(e) {
filePath: filePath, form.value[field.value] = e[0].value
name: 'file', if (field.value == 'classes') {
formData: { form.value.classesName = e[0].label
'user': 'test' }
}, singleColumnShow.value = false
}).then(ret => { }
if(dataItem['imgList']){
dataItem['imgList'].push(ret.data)
fileInfo.value.url = ret.data
dataItem['fileInfoList'].push(fileInfo.value)
}else{
dataItem['imgList'] = [ret.data]
fileInfo.value.url = ret.data
dataItem['fileInfoList'] = [fileInfo.value]
}
proxy.$modal.closeLoading()
}).catch((err) => {
proxy.$modal.closeLoading()
});
},
});
}
// 删除图片 function chooseImage(dataItem) {
function delImage(index) { uni.chooseImage({
imgList.value.splice(index, 1) count: 1, // 默认9
} sizeType: ['compressed'], // 可以指定是原图还是压缩图，默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
success: (res) => {
const filePath = res.tempFilePaths[0]
proxy.$modal.loading()
const fileInfo = ref({
name: res.tempFiles[0].name,
url: ''
})
uploadApi
.uploadFile({
filePath,
name: 'file',
formData: {
user: 'test'
}
})
.then((ret) => {
if (dataItem.imgList) {
dataItem.imgList.push(ret.data)
fileInfo.value.url = ret.data
dataItem.fileInfoList.push(fileInfo.value)
} else {
dataItem.imgList = [ret.data]
fileInfo.value.url = ret.data
dataItem.fileInfoList = [fileInfo.value]
}
proxy.$modal.closeLoading()
})
.catch((err) => {
proxy.$modal.closeLoading()
})
}
})
}
// 删除图片
function delImage(index) {
imgList.value.splice(index, 1)
}
onLoad(async (option) => { onLoad(async (option) => {
if (option.type) type.value = option.type; if (option.type) type.value = option.type
maintenanceShift.value = await dictApi.getDict('maintenance_shift') maintenanceShift.value = await dictApi.getDict('maintenance_shift')
form.value.maintenances = uni.getStorageSync('user').nickname form.value.maintenances = uni.getStorageSync('user').nickname
}) })
function radioGroupChange(e) { function radioGroupChange(e) {
console.log(e); console.log(e)
} }
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.add-form-container { .add-form-container {
min-height: calc(100vh - 140rpx); min-height: calc(100vh - 140rpx);
background: white; background: white;
padding: 0px 0rpx 140rpx; padding: 0px 0rpx 140rpx;
} }
.u-form-item { .u-form-item {
padding: 20rpx 30rpx; padding: 20rpx 30rpx;
} }
.disabled { .disabled {
background: #f5f5f5; background: #f5f5f5;
} }
.list { .list {
padding: 30rpx 30rpx; padding: 30rpx 30rpx;
.item { .item {
display: flex;
margin-bottom: 20rpx;
.item-box {
background: #F5F5F5;
border-radius: 12rpx;
flex: 1;
width: 0rpx;
}
.spare-title {
padding: 20rpx 30rpx;
border-bottom: 1px solid #e4e4e4;
.title-txt {
color: #409eff;
font-size: 30rpx;
font-weight: bold;
}
}
.dec {
color: #9c9c9c;
padding: 20rpx 30rpx 20rpx;
display: flex;
align-items: center;
.required {
color: red;
margin-right: 5rpx;
}
.error {
border: 1px solid red !important;
}
}
}
}
.select {
display: flex; display: flex;
align-items: center; margin-bottom: 20rpx;
height: 72rpx; .item-box {
width: 100%; background: #f5f5f5;
.input { border-radius: 12rpx;
flex: 1; flex: 1;
font-size: 28rpx; width: 0rpx;
color: #000000; }
.spare-title {
padding: 20rpx 30rpx;
border-bottom: 1px solid #e4e4e4;
.title-txt {
color: #409eff;
font-size: 30rpx;
font-weight: bold;
}
} }
.placeholder { .dec {
flex: 1; color: #9c9c9c;
font-size: 28rpx; padding: 20rpx 30rpx 20rpx;
color: rgb(192, 196, 204); display: flex;
align-items: center;
.required {
color: red;
margin-right: 5rpx;
}
.error {
border: 1px solid red !important;
}
} }
}
}
.select {
display: flex;
align-items: center;
height: 72rpx;
width: 100%;
.input {
flex: 1;
font-size: 28rpx;
color: #000000;
}
.placeholder {
flex: 1;
font-size: 28rpx;
color: rgb(192, 196, 204);
}
} }
.footer { .footer {
position: fixed; position: fixed;
bottom: 0px; bottom: 0px;
left: 0px; left: 0px;
width: 100%; width: 100%;
} }
.btns { .btns {
display: flex; display: flex;
button { button {
flex: 1; flex: 1;
} }
.sure { .sure {
background: #409eff; background: #409eff;
color: white; color: white;
border-radius: 0px; border-radius: 0px;
&::after { &::after {
border: 1px solid #409eff; border: 1px solid #409eff;
border-radius: 0px; border-radius: 0px;
}
} }
.reset { }
background: #F5F5F5; .reset {
border-radius: 0px; background: #f5f5f5;
&::after { border-radius: 0px;
border-radius: 0px; &::after {
} border-radius: 0px;
} }
}
} }
.right-button { .right-button {
background: #409eff; background: #409eff;
color: white; color: white;
padding: 0rpx 30rpx; padding: 0rpx 30rpx;
border-radius: 16rpx; border-radius: 16rpx;
text-align: center; text-align: center;
font-size: 28rpx; font-size: 28rpx;
} }
.image { .image {
padding: 0px 30rpx; padding: 0px 30rpx;
padding-bottom: 30rpx; padding-bottom: 30rpx;
display: flex; display: flex;
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
.image-list { .image-list {
display: flex; display: flex;
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
} }
} }
.image-item { .image-item {
width: 210rpx; width: 210rpx;
height: 210rpx; height: 210rpx;
margin-right: 20rpx; margin-right: 20rpx;
position: relative; position: relative;
border: 1px solid rgba(230, 230, 230, 0.5); border: 1px solid rgba(230, 230, 230, 0.5);
margin-bottom: 20rpx; margin-bottom: 20rpx;
border-radius: 20rpx; border-radius: 20rpx;
overflow: hidden; overflow: hidden;
image { image {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.close { .close {
position: absolute; position: absolute;
right: 0px; right: 0px;
top: 0px; top: 0px;
} }
} }
.image-item1 { .image-item1 {
border: none; border: none;
margin-right: 0px; margin-right: 0px;
image { image {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
} }
</style> </style>
Write Preview
Loading…
Cancel
Save