5 changed files with 1124 additions and 342 deletions
@ -0,0 +1,779 @@ |
|||||
|
<template> |
||||
|
<!-- 详情 --> |
||||
|
<view class="detail-container"> |
||||
|
<view class="info"> |
||||
|
<view class="title"> |
||||
|
<view>点检工单</view> |
||||
|
</view> |
||||
|
<view class="dec"> |
||||
|
<view class="dec-item"> |
||||
|
<view>工单单号：</view> |
||||
|
<view>{{ data.number }}</view> |
||||
|
</view> |
||||
|
<view class="" style="display: flex; flex-direction: row; align-items: center; padding-bottom: 30rpx"> |
||||
|
<view style="color: red">*</view> |
||||
|
<view>点检描述：</view> |
||||
|
<view class=""> |
||||
|
<u-input v-model="data.describes" placeholder="请输入点检描述" /> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="" style="display: flex; flex-direction: row; align-items: center; padding-bottom: 30rpx" v-if="data.status != 'PECEIVED'"> |
||||
|
<view style="color: red">*</view> |
||||
|
<view>班次：</view> |
||||
|
<!-- <view>{{ data.classesName }}</view>sssssss --> |
||||
|
<view class="select" style="margin-left: 50rpx; width: 70%" @click="openSingleColumn('classes', '', maintenanceShift)"> |
||||
|
<view class="input" v-if="data.classesName"> |
||||
|
{{ data.classesName }} |
||||
|
</view> |
||||
|
<view class="placeholder" v-else> |
||||
|
{{ `请选择班次` }} |
||||
|
</view> |
||||
|
<u-icon name="arrow-right" color="#aaaaaa" size="28"></u-icon> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="dec-item"> |
||||
|
<view>点检人：</view> |
||||
|
<view>{{ store.name }}</view> |
||||
|
</view> |
||||
|
<view class="dec-item"> |
||||
|
<view>点检时间：</view> |
||||
|
<view>{{ $time.formatDate(data.createTime) }}</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<div class="line"></div> |
||||
|
<view class="info" style="padding-bottom: 130rpx"> |
||||
|
<view class="tab"> |
||||
|
<u-tabs :list="list" :is-scroll="false" bar-height="2" bar-width="250" v-model="current" @change="change"></u-tabs> |
||||
|
</view> |
||||
|
|
||||
|
<view> |
||||
|
<view class="title"> |
||||
|
<view>{{ changeItem.name }}</view> |
||||
|
</view> |
||||
|
<view class="dec" v-if="changeItem.value == 1"> |
||||
|
<view class="dec-item"> |
||||
|
<view>编号：</view> |
||||
|
<view>{{ data.deviceNumber }}</view> |
||||
|
</view> |
||||
|
<view class="dec-item"> |
||||
|
<view>名称：</view> |
||||
|
<view>{{ data.name }}</view> |
||||
|
</view> |
||||
|
<view class="dec-item"> |
||||
|
<view>所属厂区：</view> |
||||
|
<view>{{ data.factoryAreaName }}</view> |
||||
|
</view> |
||||
|
<view class="dec-item"> |
||||
|
<view>类型：</view> |
||||
|
<view>{{ data.type == 'DEVICE' ? '设备' : data.type == 'TECH' ? '工艺' : '模具' }}</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="list" v-if="changeItem.value == 2"> |
||||
|
<view class="item" v-for="(item, index) in subList" :key="index"> |
||||
|
<view class="item-box"> |
||||
|
<view class="spare-title"> |
||||
|
<view class="title-txt"> |
||||
|
{{ item.name }} |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<u-row gutter="16"> |
||||
|
<u-col :span="12"> |
||||
|
<view class="dec" style="margin-top: 10rpx"> |
||||
|
<view class=""> 设备部位名称: {{ item.equipmentPosition }} </view> |
||||
|
</view> |
||||
|
<view class="" style="margin-left: 30rpx; display: flex; flex-direction: row; color: #9c9c9c; align-items: center"> |
||||
|
<view class=""> 是否符合: </view> |
||||
|
<view class="" style="display: flex; margin-left: 20rpx; margin-top: 20rpx"> |
||||
|
<u-radio-group v-model="item.isConform"> |
||||
|
<view class="" style="display: flex; flex-direction: row"> |
||||
|
<view class=""> |
||||
|
<u-radio name="TRUE">符合</u-radio> |
||||
|
</view> |
||||
|
<view class=""> |
||||
|
<u-radio name="FALSE">不符合</u-radio> |
||||
|
</view> |
||||
|
</view> |
||||
|
</u-radio-group> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="" style="display: flex; flex-direction: row; align-items: center"> |
||||
|
<view class=""> |
||||
|
<view class="" style="margin-left: 30rpx; color: #9c9c9c"> 巡检点检记录:</view> |
||||
|
</view> |
||||
|
<view class="" style="width: 60%; margin-left: 10rpx"> |
||||
|
<u-input v-model="item.records" :placeholder="'请输入巡检点检记录'" :class="{ error: item.numberNeedSwitch && !item.records }" /> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="image" style="margin-top: 20rpx"> |
||||
|
<view class="image-list" :key="refreshKey"> |
||||
|
<view class="image-item" v-for="(element, index) in item.imgList" :key="index"> |
||||
|
<image :src="element" mode=""></image> |
||||
|
<u-icon name="close-circle-fill" color="red" class="close" size="36" @click="delImage(index)"> </u-icon> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="image-item image-item1" @click="chooseImage(item)"> |
||||
|
<image src="../../static/images/photo.png" mode=""></image> |
||||
|
</view> |
||||
|
</view> |
||||
|
</u-col> |
||||
|
</u-row> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="footer"> |
||||
|
<view class="btns"> |
||||
|
<u-button type="primary" @click="submit()" :loading="loading" :disabled="loading">验证</u-button> |
||||
|
</view> |
||||
|
<view style="height: constant(safe-area-inset-bottom); height: env(safe-area-inset-bottom)"></view> |
||||
|
</view> |
||||
|
<!-- 验证完结--> |
||||
|
<u-popup v-model="isVerifyShowSuccess" mode="center" border-radius="14"> |
||||
|
<view class="popup-title">意见</view> |
||||
|
<view class="popup"> |
||||
|
<textarea v-model="data.applyContent" placeholder="请输入内容"></textarea> |
||||
|
</view> |
||||
|
<view class="popup-footer"> |
||||
|
<view class="sure" @click="apply('APPROVEPASS')">通过</view> |
||||
|
<view class="reject" @click="apply('APPROVEREJECTED')" style="color: red">驳回</view> |
||||
|
</view> |
||||
|
</u-popup> |
||||
|
|
||||
|
<view style="height: constant(safe-area-inset-bottom); height: env(safe-area-inset-bottom)"></view> |
||||
|
<u-select v-model="singleColumnShow" mode="single-column" :default-value="singleColumnDefaultValue" :list="singleColumnList" @confirm="chooseSingleColumn"></u-select> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script setup lang="ts"> |
||||
|
import { onLoad, onShow } from '@dcloudio/uni-app' |
||||
|
import { ref, getCurrentInstance } from 'vue' |
||||
|
import * as dictApi from '@/api/dict' |
||||
|
import * as repairOrderApi from '@/api/repairOrder' |
||||
|
import { useCountStore } from '@/store' |
||||
|
import * as spotCheckOrderApi from '@/api/spotCheckOrder' |
||||
|
import * as uploadApi from '@/api/upload' |
||||
|
|
||||
|
const { proxy } = getCurrentInstance() |
||||
|
// 获取自定义的store |
||||
|
const store = useCountStore() |
||||
|
|
||||
|
const list = ref([ |
||||
|
{ |
||||
|
name: '设备信息', |
||||
|
value: 1 |
||||
|
}, |
||||
|
{ |
||||
|
name: '维修内容', |
||||
|
value: 2 |
||||
|
} |
||||
|
]) |
||||
|
const current = ref(0) |
||||
|
const changeItem = ref({ |
||||
|
name: '设备信息', |
||||
|
value: 1 |
||||
|
}) |
||||
|
const subList = ref([]) |
||||
|
const data = ref({}) |
||||
|
const loading = ref(false) |
||||
|
const loading1 = ref(false) |
||||
|
const type = ref('') |
||||
|
const serviceList = ref([]) |
||||
|
const isShowSuccess = ref(false) |
||||
|
const isVerifyShowSuccess = ref(false) // 验证确认弹出层 |
||||
|
const isApplyShowSuccess = ref(false) // 维修确认弹出层 |
||||
|
const orderCompleteResult = ref([]) // 订单完成类型 |
||||
|
const result = ref('TEMPORARILY') |
||||
|
const data1 = ref('') |
||||
|
const number = ref('') |
||||
|
|
||||
|
const singleColumnShow = ref(false) |
||||
|
const singleColumnDefaultValue = ref([]) |
||||
|
const singleColumnList = ref([]) |
||||
|
const field = ref('') |
||||
|
const maintenanceShift = ref([]) // 班次字典项 |
||||
|
const faultType = ref([]) // 故障类型字典项 |
||||
|
const imgList = ref([]) |
||||
|
const refreshKey = ref(0) |
||||
|
|
||||
|
function change(index) { |
||||
|
current.value = index |
||||
|
changeItem.value = list.value[current.value] |
||||
|
} |
||||
|
// 添加表格表单 |
||||
|
function addSubForm(clickType, item) { |
||||
|
if (data.value.status == 'APPLYPASS' || data.value.status == 'COMPLETED') { |
||||
|
return |
||||
|
} |
||||
|
if (data.value.status == 'PENDING') { |
||||
|
proxy.$modal.showToast('请先接单') |
||||
|
return |
||||
|
} |
||||
|
if (clickType == 'updata') { |
||||
|
proxy.$tab.navigateTo(`/pages/repairOrder/addServiceRecord?type=${data.value.type}&factoryAreaNumber=${data.value.factoryAreaNumber}&number=${data.value.number}&data=${encodeURIComponent(JSON.stringify(item))}&deviceNumber=${data.value.deviceNumber}`) |
||||
|
} else { |
||||
|
proxy.$tab.navigateTo(`/pages/repairOrder/addServiceRecord?type=${data.value.type}&factoryAreaNumber=${data.value.factoryAreaNumber}&number=${data.value.number}&deviceNumber=${data.value.deviceNumber}`) |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
function submit() { |
||||
|
if (!data.value.describes) { |
||||
|
proxy.$modal.showToast('请输入点检描述') |
||||
|
return |
||||
|
} |
||||
|
if (!data.value.classesName) { |
||||
|
proxy.$modal.showToast('请选择班次') |
||||
|
return |
||||
|
} |
||||
|
|
||||
|
const submitData = { |
||||
|
id: data.value.id, |
||||
|
describes: data.value.describes, |
||||
|
deviceNumber: data.value.deviceNumber, |
||||
|
maintenances: data.value.maintenances, |
||||
|
classes: data.value.classes, |
||||
|
subList: subList.value, |
||||
|
type: type.value |
||||
|
} |
||||
|
|
||||
|
proxy.$modal.confirm('是否提交?').then(() => { |
||||
|
proxy.$modal.loading('加载中') |
||||
|
loading.value = true |
||||
|
spotCheckOrderApi |
||||
|
.orderEditClick(submitData) |
||||
|
.then((res) => { |
||||
|
proxy.$modal.closeLoading() |
||||
|
if (res.data) { |
||||
|
proxy.$modal.showToast('提交成功') |
||||
|
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 chooseSingleColumn(e) { |
||||
|
data.value[field.value] = e[0].value |
||||
|
if (field.value == 'classes') { |
||||
|
data.value.classesName = e[0].label |
||||
|
} |
||||
|
singleColumnShow.value = false |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* 点击验证完结填写意见 |
||||
|
*/ |
||||
|
function orderClickVerify() { |
||||
|
data.value.applyContent = null |
||||
|
isVerifyShowSuccess.value = true |
||||
|
spotCheckOrderApi.orderEditClick |
||||
|
} |
||||
|
function cancel() { |
||||
|
data.value.applyContent = null |
||||
|
isVerifyShowSuccess.value = false |
||||
|
isApplyShowSuccess.value = false |
||||
|
} |
||||
|
|
||||
|
function radioGroupChange(e) { |
||||
|
result.value = e |
||||
|
} |
||||
|
function sure() { |
||||
|
isShowSuccess.value = false |
||||
|
orderClick(2) |
||||
|
} |
||||
|
/** |
||||
|
* 验证确认 |
||||
|
*/ |
||||
|
function verify() { |
||||
|
isVerifyShowSuccess.value = false |
||||
|
orderClick() |
||||
|
} |
||||
|
|
||||
|
/** |
||||
|
* 审核确认 |
||||
|
*/ |
||||
|
function apply(status) { |
||||
|
isVerifyShowSuccess.value = false |
||||
|
data.value.status = status |
||||
|
orderClick() |
||||
|
} |
||||
|
// 点击审核 |
||||
|
async function orderClick() { |
||||
|
const dataOne = { |
||||
|
number: data.value.number, |
||||
|
status: data.value.status, |
||||
|
id: data.value.id, |
||||
|
approveOpinion: data.value.applyContent |
||||
|
} |
||||
|
const tips = '是否确认提交' |
||||
|
proxy.$modal.loading('加载中') |
||||
|
loading.value = true |
||||
|
await spotCheckOrderApi |
||||
|
.orderClickVerify(dataOne, type.value) |
||||
|
.then((res) => { |
||||
|
if (res.data) { |
||||
|
proxy.$modal.showToast('操作成功') |
||||
|
setTimeout(() => { |
||||
|
proxy.$tab.navigateBack() |
||||
|
loading.value = false |
||||
|
}, 1500) |
||||
|
} else { |
||||
|
proxy.$modal.showToast(res.msg) |
||||
|
loading.value = false |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
proxy.$modal.closeLoading() |
||||
|
loading.value = false |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
function previewImage(index, filePathList) { |
||||
|
uni.previewImage({ |
||||
|
current: index, // 当前显示图片的索引 |
||||
|
urls: filePathList, // 需要预览的图片链接列表 |
||||
|
longPressActions: { |
||||
|
itemList: ['保存图片'], |
||||
|
success(data) { |
||||
|
console.log(`选中了第${data.tapIndex}个按钮`) |
||||
|
console.log(`选中了第${data.index}张图片`) |
||||
|
}, |
||||
|
fail(err) { |
||||
|
console.log(err.errMsg) |
||||
|
} |
||||
|
} |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
// 删除图片 |
||||
|
function delImage(index) { |
||||
|
imgList.value.splice(index, 1) |
||||
|
} |
||||
|
|
||||
|
function chooseImage(dataItem) { |
||||
|
uni.chooseImage({ |
||||
|
count: 1, // 默认9 |
||||
|
sizeType: ['compressed'], // 可以指定是原图还是压缩图，默认二者都有 |
||||
|
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有 |
||||
|
success: (res) => { |
||||
|
const filePath = res.tempFilePaths[0] |
||||
|
proxy.$modal.loading() |
||||
|
const fileInfo = ref({ |
||||
|
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 openSingleColumn(fieldName, val, list) { |
||||
|
singleColumnList.value = list |
||||
|
field.value = fieldName |
||||
|
if (val) { |
||||
|
singleColumnDefaultValue.value = [list.findIndex((item) => item.value == val)] |
||||
|
} else { |
||||
|
singleColumnDefaultValue.value = [] |
||||
|
} |
||||
|
singleColumnShow.value = true |
||||
|
} |
||||
|
|
||||
|
async function getDeviceRepairDetail(number) { |
||||
|
await repairOrderApi |
||||
|
.getDeviceRepairDetail(number, type.value) |
||||
|
.then((res) => { |
||||
|
proxy.$modal.closeLoading() |
||||
|
data.value = res.data |
||||
|
if (res.data) { |
||||
|
} |
||||
|
loading.value = false |
||||
|
}) |
||||
|
.catch(() => { |
||||
|
proxy.$modal.closeLoading() |
||||
|
loading.value = false |
||||
|
}) |
||||
|
} |
||||
|
|
||||
|
onLoad(async (option) => { |
||||
|
if (option.data) { |
||||
|
data.value = JSON.parse(decodeURIComponent(option.data)) |
||||
|
} |
||||
|
if (option.type) type.value = option.type |
||||
|
if (option.number) { |
||||
|
number.value = option.number |
||||
|
selectListByNumber() |
||||
|
} |
||||
|
maintenanceShift.value = await dictApi.getDict('maintenance_shift') |
||||
|
changeItem.value = list.value[current.value] |
||||
|
orderCompleteResult.value = await dictApi.getDict('order_complete_result') |
||||
|
}) |
||||
|
onShow(async () => { |
||||
|
if (number.value) { |
||||
|
list.value = [ |
||||
|
{ |
||||
|
name: type.value == 'MOLD' ? '模具信息' : '设备信息', |
||||
|
value: 1 |
||||
|
}, |
||||
|
{ |
||||
|
name: '点检项内容', |
||||
|
value: 2 |
||||
|
} |
||||
|
] |
||||
|
} else { |
||||
|
list.value = [ |
||||
|
{ |
||||
|
name: type.value == 'MOLD' ? '模具信息' : '设备信息', |
||||
|
value: 1 |
||||
|
}, |
||||
|
{ |
||||
|
name: '点检项内容', |
||||
|
value: 2 |
||||
|
} |
||||
|
] |
||||
|
} |
||||
|
maintenanceShift.value = await dictApi.getDict('maintenance_shift') |
||||
|
faultType.value = await dictApi.getDict('fault_type') |
||||
|
}) |
||||
|
function selectListByNumber() { |
||||
|
const data = { |
||||
|
number: number.value |
||||
|
} |
||||
|
spotCheckOrderApi |
||||
|
.selectListByNumber(data, type.value) |
||||
|
.then((res) => { |
||||
|
if (res.data) { |
||||
|
subList.value = res.data |
||||
|
} |
||||
|
}) |
||||
|
.catch(() => {}) |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
.detail-container { |
||||
|
min-height: 100vh; |
||||
|
background: white; |
||||
|
} |
||||
|
|
||||
|
.line { |
||||
|
background: #f5f5f5; |
||||
|
height: 20rpx; |
||||
|
} |
||||
|
|
||||
|
.info { |
||||
|
background: white; |
||||
|
} |
||||
|
|
||||
|
.tab { |
||||
|
border-bottom: 1px solid #e4e4e4; |
||||
|
} |
||||
|
|
||||
|
.title { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
padding: 20rpx 30rpx; |
||||
|
border-bottom: 1px solid #e4e4e4; |
||||
|
|
||||
|
view { |
||||
|
&:nth-child(1) { |
||||
|
flex: 1; |
||||
|
border-left: 10rpx solid #409eff; |
||||
|
padding-left: 20rpx; |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.dec { |
||||
|
padding: 30rpx; |
||||
|
|
||||
|
.dec-item { |
||||
|
padding-bottom: 30rpx; |
||||
|
display: flex; |
||||
|
|
||||
|
view { |
||||
|
&:nth-child(1) { |
||||
|
width: 160rpx; |
||||
|
} |
||||
|
|
||||
|
&:nth-child(2) { |
||||
|
color: #888888; |
||||
|
flex: 1; |
||||
|
width: 0px; |
||||
|
word-wrap: break-word; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.dec2 { |
||||
|
padding: 10rpx 30rpx; |
||||
|
display: flex; |
||||
|
|
||||
|
view { |
||||
|
&:nth-child(1) { |
||||
|
width: 160rpx; |
||||
|
} |
||||
|
|
||||
|
&:nth-child(2) { |
||||
|
color: #888888; |
||||
|
flex: 1; |
||||
|
width: 0px; |
||||
|
word-wrap: break-word; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.items { |
||||
|
margin: 20rpx 30rpx; |
||||
|
border-radius: 12rpx; |
||||
|
background: #f5f5f5; |
||||
|
padding-bottom: 20rpx; |
||||
|
|
||||
|
.items-name { |
||||
|
padding: 20rpx; |
||||
|
border-bottom: 1px solid #dedede; |
||||
|
} |
||||
|
|
||||
|
.items-dec { |
||||
|
padding: 0px 20rpx; |
||||
|
margin-top: 20rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.popup-title { |
||||
|
text-align: center; |
||||
|
font-size: 32rpx; |
||||
|
font-weight: bold; |
||||
|
color: #409eff; |
||||
|
padding: 30rpx; |
||||
|
} |
||||
|
|
||||
|
.popup { |
||||
|
width: 600rpx; |
||||
|
padding: 0rpx 60rpx 0rpx; |
||||
|
} |
||||
|
|
||||
|
.popup-footer { |
||||
|
display: flex; |
||||
|
border-top: 1px solid #e4e4e4; |
||||
|
|
||||
|
view { |
||||
|
line-height: 100rpx; |
||||
|
flex: 1; |
||||
|
text-align: center; |
||||
|
|
||||
|
&.sure { |
||||
|
color: #409eff; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.footer { |
||||
|
position: fixed; |
||||
|
bottom: 0px; |
||||
|
left: 0px; |
||||
|
width: 100%; |
||||
|
background: white; |
||||
|
z-index: 22; |
||||
|
} |
||||
|
|
||||
|
.btns { |
||||
|
display: flex; |
||||
|
|
||||
|
padding: 20rpx; |
||||
|
box-shadow: 0px -2rpx 20rpx rgba(0, 0, 0, 0.1); |
||||
|
|
||||
|
button { |
||||
|
flex: 1; |
||||
|
margin: 0px 10rpx; |
||||
|
} |
||||
|
|
||||
|
.sure { |
||||
|
background: #409eff; |
||||
|
color: white; |
||||
|
border-radius: 8rpx; |
||||
|
|
||||
|
&::after { |
||||
|
border: 1px solid #409eff; |
||||
|
border-radius: 0px; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.list { |
||||
|
padding: 20rpx; |
||||
|
|
||||
|
.item { |
||||
|
display: flex; |
||||
|
margin-bottom: 20rpx; |
||||
|
|
||||
|
.item-box { |
||||
|
border-radius: 12rpx; |
||||
|
border: 1px solid #dedede; |
||||
|
border-radius: 12rpx; |
||||
|
|
||||
|
flex: 1; |
||||
|
width: 0rpx; |
||||
|
} |
||||
|
|
||||
|
.spare-title { |
||||
|
padding: 20rpx 30rpx; |
||||
|
border-bottom: 1px solid #e4e4e4; |
||||
|
display: flex; |
||||
|
|
||||
|
.title-txt { |
||||
|
color: #409eff; |
||||
|
font-size: 30rpx; |
||||
|
font-weight: bold; |
||||
|
flex: 1; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.dec { |
||||
|
color: #9c9c9c; |
||||
|
padding: 0rpx 30rpx 20rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.add-btn { |
||||
|
display: flex; |
||||
|
justify-content: flex-start; |
||||
|
align-items: center; |
||||
|
} |
||||
|
|
||||
|
::v-deep .u-radio-group { |
||||
|
display: grid !important; |
||||
|
padding-bottom: 20rpx; |
||||
|
} |
||||
|
|
||||
|
.images { |
||||
|
display: flex; |
||||
|
width: 100%; |
||||
|
|
||||
|
image { |
||||
|
width: 30%; |
||||
|
margin-right: 20rpx; |
||||
|
height: 200rpx; |
||||
|
border-radius: 10rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.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); |
||||
|
} |
||||
|
} |
||||
|
.images { |
||||
|
.preview-image { |
||||
|
width: 30%; |
||||
|
margin-right: 20rpx; |
||||
|
height: 200rpx; |
||||
|
border-radius: 10rpx; |
||||
|
cursor: pointer; // 添加这个属性以显示手型光标 |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.image { |
||||
|
padding: 0px 30rpx; |
||||
|
padding-bottom: 30rpx; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
|
||||
|
flex-wrap: wrap; |
||||
|
|
||||
|
.image-list { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
flex-wrap: wrap; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.image-item { |
||||
|
width: 210rpx; |
||||
|
height: 210rpx; |
||||
|
margin-right: 20rpx; |
||||
|
position: relative; |
||||
|
border: 1px solid rgba(230, 230, 230, 0.5); |
||||
|
margin-bottom: 20rpx; |
||||
|
border-radius: 20rpx; |
||||
|
overflow: hidden; |
||||
|
|
||||
|
image { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
||||
|
|
||||
|
.close { |
||||
|
position: absolute; |
||||
|
right: 0px; |
||||
|
top: 0px; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.image-item1 { |
||||
|
border: none; |
||||
|
margin-right: 0px; |
||||
|
|
||||
|
image { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
Loading…
Reference in new issue