Skip to content

basic-uniapp-v3
basic-uniapp-v3
提交 a5aa2470 作者: 宇宙超人
操作

基地管理

上级 52cdf723
正在显示 包含 1207 行增加 和 1076 行删除
src/api/model/nongchang.ts
...@@ -10,6 +10,17 @@ enum Api { ...@@ -10,6 +10,17 @@ enum Api {
getFarmBaseList = '/farmbase/getFarmBaseList', getFarmBaseList = '/farmbase/getFarmBaseList',
} }
/** /**
* 农场基地管理-通过id查询
* @param params
* @returns
*/
export function getFarmbaseInfoById(params: any = {}) {
return otherHttp.get({
url: '/farmbase/queryById',
params,
})
}
/**
* 删除基地 * 删除基地
* @param id * @param id
* @returns * @returns
...@@ -31,6 +42,17 @@ export function addFarmbase(params = {}) { ...@@ -31,6 +42,17 @@ export function addFarmbase(params = {}) {
}) })
} }
/** /**
* 编辑基地
* @param params
* @returns
*/
export function editFarmbase(params = {}) {
return otherHttp.post({
url: '/farmbase/edit',
params,
})
}
/**
* 基地列表 * 基地列表
* @param {any} params * @param {any} params
* @return * @return
......
src/pages/jidiguanli/add.vue
<template> <template>
<view class="container"> <view class="container">
<u-form :model="formData" :rules="rules" ref="formRef" label-width="160rpx"> <u-form :model="formData" :rules="rules" ref="formRef" label-width="160rpx">
<!-- 基地基本信息 --> <!-- 基地基本信息 -->
<view class="section-title">基地基本信息</view> <view class="section-title">基地基本信息</view>
<u-form-item label="基地名称" prop="baseName" required> <u-form-item label="基地名称" prop="baseName" required>
<u-input v-model="formData.baseName" placeholder="请输入基地名称" border="bottom" /> <u-input v-model="formData.baseName" placeholder="请输入基地名称" border="bottom" />
</u-form-item> </u-form-item>
<u-form-item label="基地类型" prop="baseType" required> <u-form-item label="基地类型" prop="baseType" required>
<u-input v-model="formData.baseTypeText" placeholder="请选择基地类型" border="bottom" <u-input v-model="formData.baseTypeText" placeholder="请选择基地类型" border="bottom"
@click="show.farmType = true" /> @click="show.farmType = true" />
</u-form-item> </u-form-item>
<u-form-item label="规模" prop="scale" required> <u-form-item label="规模" prop="scale" required>
<u-input v-model="formData.scale" placeholder="请输入规模（亩）" border="bottom" type="number"> <u-input v-model="formData.scale" placeholder="请输入规模（亩）" border="bottom" type="number">
<template #suffix> <template #suffix>
<text class="suffix-text">亩</text> <text class="suffix-text">亩</text>
</template> </template>
</u-input> </u-input>
</u-form-item> </u-form-item>
<!-- 地址信息 --> <!-- 地址信息 -->
<view class="section-title">地址信息</view> <view class="section-title">地址信息</view>
<u-form-item label="省市区" prop="province" required> <u-form-item label="省市区" prop="province" required>
<u-input v-model="formData.province" placeholder="请选择省市区" border="bottom" <u-input v-model="formData.province" placeholder="请选择省市区" border="bottom"
@click="show.address = true" /> @click="show.address = true" />
</u-form-item> </u-form-item>
<u-form-item label="详细地址" prop="detailedAddress" required> <u-form-item label="详细地址" prop="detailedAddress" required>
<u-input v-model="formData.detailedAddress" placeholder="请输入详细地址" border="bottom" /> <u-input v-model="formData.detailedAddress" placeholder="请输入详细地址" border="bottom" />
</u-form-item> </u-form-item>
<!-- 负责人信息 --> <!-- 负责人信息 -->
<view class="section-title">负责人信息</view> <view class="section-title">负责人信息</view>
<u-form-item label="负责人姓名" prop="managerName" required> <u-form-item label="负责人姓名" prop="managerName" required>
<u-input v-model="formData.managerName" placeholder="请输入负责人姓名" border="bottom" /> <u-input v-model="formData.managerName" placeholder="请输入负责人姓名" border="bottom" />
</u-form-item> </u-form-item>
<u-form-item label="联系电话" prop="contactPhone" required> <u-form-item label="联系电话" prop="contactPhone" required>
<u-input v-model="formData.contactPhone" placeholder="请输入联系电话" border="bottom" type="number" /> <u-input v-model="formData.contactPhone" placeholder="请输入联系电话" border="bottom" type="number" />
</u-form-item> </u-form-item>
<u-form-item label="身份证号" prop="idCard" required> <u-form-item label="身份证号" prop="idCard" required>
<u-input v-model="formData.idCard" placeholder="请输入身份证号" border="bottom" /> <u-input v-model="formData.idCard" placeholder="请输入身份证号" border="bottom" />
</u-form-item> </u-form-item>
<!-- 经营信息 --> <!-- 经营信息 -->
<view class="section-title">经营信息</view> <view class="section-title">经营信息</view>
<u-form-item label="种植作物" prop="plantedCrops" required> <u-form-item label="种植作物" prop="plantedCrops" required>
<u-input v-model="formData.plantedCrops" placeholder="请输入种植作物，多个用逗号分隔" border="bottom" /> <u-input v-model="formData.plantedCrops" placeholder="请输入种植作物，多个用逗号分隔" border="bottom" />
</u-form-item> </u-form-item>
<u-form-item label="经营年限" prop="operationYears" required> <u-form-item label="经营年限" prop="operationYears" required>
<u-input v-model="formData.operationYears" placeholder="请输入经营年限" border="bottom" type="number"> <u-input v-model="formData.operationYears" placeholder="请输入经营年限" border="bottom" type="number">
<template #suffix> <template #suffix>
<text class="suffix-text">年</text> <text class="suffix-text">年</text>
</template> </template>
</u-input> </u-input>
</u-form-item> </u-form-item>
<!-- 基地图片 --> <!-- 基地图片 -->
<view class="section-title">认证材料</view> <view class="section-title">认证材料</view>
<u-form-item label="基地图片" prop="baseImages"> <u-form-item label="基地图片" prop="baseImages">
<u-upload :fileList="formData.baseImages" @afterRead="(e) => afterRead(e, 'baseImages')" <u-upload :fileList="formData.baseImages" @afterRead="(e) => afterRead(e, 'baseImages')"
@delete="(e) => deletePic(e, 'baseImages')" name="1" multiple :maxCount="5" @delete="(e) => deletePic(e, 'baseImages')" name="1" multiple :maxCount="5"
:previewFullImage="true"></u-upload> :previewFullImage="true"></u-upload>
</u-form-item> </u-form-item>
<u-form-item label="身份证明" prop="identityProveUrl" required> <u-form-item label="身份证明" prop="identityProveUrl" required>
<div> <div>
<u-upload :fileList="formData.identityProveUrl" @afterRead="(e) => afterRead(e, 'identityProveUrl')" <u-upload :fileList="formData.identityProveUrl" @afterRead="(e) => afterRead(e, 'identityProveUrl')"
@delete="(e) => deletePic(e, 'identityProveUrl')" name="identityProveUrl" multiple :maxCount="2" @delete="(e) => deletePic(e, 'identityProveUrl')" name="identityProveUrl" multiple :maxCount="2"
:previewFullImage="true"></u-upload> :previewFullImage="true"></u-upload>
<div><i>身份证/营业执照图片</i></div> <div><i>身份证/营业执照图片</i></div>
</div> </div>
</u-form-item> </u-form-item>
<u-form-item label="场地证明" prop="landProveUrl" required> <u-form-item label="场地证明" prop="landProveUrl" required>
<div> <div>
<u-upload :fileList="formData.landProveUrl" @afterRead="(e) => afterRead(e, 'landProveUrl')" <u-upload :fileList="formData.landProveUrl" @afterRead="(e) => afterRead(e, 'landProveUrl')"
@delete="(e) => deletePic(e, 'landProveUrl')" name="landProveUrl" multiple :maxCount="2" @delete="(e) => deletePic(e, 'landProveUrl')" name="landProveUrl" multiple :maxCount="2"
:previewFullImage="true"></u-upload> :previewFullImage="true"></u-upload>
<div><i>土地合同/场地照片</i></div> <div><i>土地合同/场地照片</i></div>
</div> </div>
</u-form-item> </u-form-item>
<u-form-item label="生产证明" prop="productionProveUrl" required> <u-form-item label="生产证明" prop="productionProveUrl" required>
<div> <div>
<u-upload :fileList="formData.productionProveUrl" <u-upload :fileList="formData.productionProveUrl"
@afterRead="(e) => afterRead(e, 'productionProveUrl')" @afterRead="(e) => afterRead(e, 'productionProveUrl')"
@delete="(e) => deletePic(e, 'productionProveUrl')" name="productionProveUrl" multiple @delete="(e) => deletePic(e, 'productionProveUrl')" name="productionProveUrl" multiple
:maxCount="2" :previewFullImage="true"></u-upload> :maxCount="2" :previewFullImage="true"></u-upload>
<div><i>现场作业照片/产品照片</i></div> <div><i>现场作业照片/产品照片</i></div>
</div> </div>
</u-form-item> </u-form-item>
<u-form-item label="质量证书"> <u-form-item label="质量证书">
<div> <div>
<u-upload :fileList="formData.qualityCertificateUrl" <u-upload :fileList="formData.qualityCertificateUrl"
@afterRead="(e) => afterRead(e, 'qualityCertificateUrl')" @afterRead="(e) => afterRead(e, 'qualityCertificateUrl')"
@delete="(e) => deletePic(e, 'qualityCertificateUrl')" name="qualityCertificateUrl" multiple @delete="(e) => deletePic(e, 'qualityCertificateUrl')" name="qualityCertificateUrl" multiple
:maxCount="2" :previewFullImage="true"></u-upload> :maxCount="2" :previewFullImage="true"></u-upload>
<div><i>质量认证证书</i></div> <div><i>质量认证证书</i></div>
</div> </div>
</u-form-item> </u-form-item>
<u-form-item label="其他材料"> <u-form-item label="其他材料">
<div> <div>
<u-upload :fileList="formData.otherMaterialUrl" @afterRead="(e) => afterRead(e, 'otherMaterialUrl')" <u-upload :fileList="formData.otherMaterialUrl" @afterRead="(e) => afterRead(e, 'otherMaterialUrl')"
@delete="(e) => deletePic(e, 'otherMaterialUrl')" name="otherMaterialUrl" multiple :maxCount="2" @delete="(e) => deletePic(e, 'otherMaterialUrl')" name="otherMaterialUrl" multiple :maxCount="2"
:previewFullImage="true"></u-upload> :previewFullImage="true"></u-upload>
<div><i>其他补充材料</i></div> <div><i>其他补充材料</i></div>
</div> </div>
</u-form-item> </u-form-item>
<!-- 提交按钮 --> <!-- 提交按钮 -->
<view class="submit-btn-container"> <view class="submit-btn-container">
<u-button type="primary" @click="submitForm" :loading="loading">提交</u-button> <u-button type="primary" @click="submitForm" :loading="loading">提交</u-button>
</view> </view>
</u-form> </u-form>
<fui-picker :show="show.address" :options="options.address" :linkage="true" :layer="3" <fui-picker :show="show.address" :options="options.address" :linkage="true" :layer="3"
@change="handleChangeAddress" @cancel="show.address = false"></fui-picker> @change="handleChangeAddress" @cancel="show.address = false"></fui-picker>
<fui-picker :show="show.farmType" :layer="1" :linkage="true" :options="options.farmType" <fui-picker :show="show.farmType" :layer="1" :linkage="true" :options="options.farmType"
@change="handleChangeFarmType" @cancel="show.farmType = false"></fui-picker> @change="handleChangeFarmType" @cancel="show.farmType = false"></fui-picker>
</view> </view>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
...@@ -143,105 +143,124 @@ const dictStore = useDictStore() ...@@ -143,105 +143,124 @@ const dictStore = useDictStore()
const formRef = ref() const formRef = ref()
const loading = ref(false) const loading = ref(false)
const show = reactive({ const show = reactive({
address: false, address: false,
farmType: false, farmType: false,
}) })
const options = reactive({ const options = reactive({
address: areaTree, address: areaTree,
farmType: [] farmType: []
}) })
// 表单数据 // 表单数据
const formData = reactive({ const formData = reactive({
farmId: '', farmId: '',
baseName: '', baseName: '',
baseType: '', baseType: '',
baseTypeText: '', baseTypeText: '',
scale: '', scale: '',
provinceName: '', provinceName: '',
cityName: '', cityName: '',
districtName: '', districtName: '',
detailedAddress: '', detailedAddress: '',
province: '', province: '',
managerName: '', managerName: '',
contactPhone: '', contactPhone: '',
idCard: '', idCard: '',
plantedCrops: '', plantedCrops: '',
operationYears: '', operationYears: '',
baseImages: [], baseImages: [],
identityProveUrl: [],//身份证明(身份证/营业执照图片) identityProveUrl: [],//身份证明(身份证/营业执照图片)
landProveUrl: [],//土地证明(土地证/国有土地使用证) landProveUrl: [],//土地证明(土地证/国有土地使用证)
productionProveUrl: [],//生产证明(生产许可证/种养许可证) productionProveUrl: [],//生产证明(生产许可证/种养许可证)
qualityCertificateUrl: [],//质量证明(质量认证证书) qualityCertificateUrl: [],//质量证明(质量认证证书)
otherMaterialUrl: [],//其他证明(其他证明) otherMaterialUrl: [],//其他证明(其他证明)
}) })
// 表单验证规则 // 表单验证规则
const rules = { const rules = {
baseName: [ baseName: [
{ required: true, message: '请输入基地名称', trigger: 'blur' }, { required: true, message: '请输入基地名称', trigger: 'blur' },
{ min: 2, max: 50, message: '基地名称长度在2-50个字符之间', trigger: 'blur' } { min: 2, max: 50, message: '基地名称长度在2-50个字符之间', trigger: 'blur' }
], ],
baseType: [ baseType: [
{ required: true, message: '请选择基地类型', trigger: 'change' } { required: true, message: '请选择基地类型', trigger: 'change' }
], ],
scale: [ scale: [
{ required: true, message: '请输入规模', trigger: 'blur' }, {
{ pattern: /^[1-9]\d*$/, message: '规模必须为正整数', trigger: 'blur' } validator: (rule: any, value: any, callback: any) => {
], if (!value || value === '') {
province: [ callback(new Error('请输入规模'))
{ } else if (!/^[1-9]\d*$/.test(value.toString())) {
required: true, message: '请获取地址信息', trigger: 'change', callback(new Error('规模必须为正整数'))
// validator: () => formData.provinceName && formData.cityName && formData.districtName } else {
} callback()
], }
detailedAddress: [ },
{ required: true, message: '请输入详细地址', trigger: 'blur' }, trigger: ['blur', 'change']
{ min: 5, max: 200, message: '详细地址长度在5-200个字符之间', trigger: 'blur' } }
], ],
managerName: [ province: [
{ required: true, message: '请输入负责人姓名', trigger: 'blur' }, {
{ pattern: /^[\u4e00-\u9fa5]{2,10}$/, message: '姓名必须为2-10个汉字', trigger: 'blur' } required: true, message: '请获取地址信息', trigger: 'change',
], // validator: () => formData.provinceName && formData.cityName && formData.districtName
contactPhone: [ }
{ required: true, message: '请输入联系电话', trigger: 'blur' }, ],
{ pattern: /^1[3-9]\d{9}$/, message: '请输入正确的手机号码', trigger: 'blur' } detailedAddress: [
], { required: true, message: '请输入详细地址', trigger: 'blur' },
idCard: [ { min: 5, max: 200, message: '详细地址长度在5-200个字符之间', trigger: 'blur' }
{ required: true, message: '请输入身份证号', trigger: 'blur' }, ],
{ managerName: [
pattern: /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/, { required: true, message: '请输入负责人姓名', trigger: 'blur' },
message: '请输入正确的身份证号码', trigger: 'blur' { pattern: /^[\u4e00-\u9fa5]{2,10}$/, message: '姓名必须为2-10个汉字', trigger: 'blur' }
} ],
], contactPhone: [
plantedCrops: [ { required: true, message: '请输入联系电话', trigger: 'blur' },
{ required: true, message: '请输入种植作物', trigger: 'blur' }, { pattern: /^1[3-9]\d{9}$/, message: '请输入正确的手机号码', trigger: 'blur' }
{ min: 2, max: 100, message: '种植作物长度在2-100个字符之间', trigger: 'blur' } ],
], idCard: [
operationYears: [ { required: true, message: '请输入身份证号', trigger: 'blur' },
{ required: true, message: '请输入经营年限', trigger: 'blur' }, {
{ pattern: /^[1-9]\d*$/, message: '经营年限必须为正整数', trigger: 'blur' } pattern: /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/,
], message: '请输入正确的身份证号码', trigger: 'blur'
identityProveUrl:[ }
{required: true, message: '请上传身份证明', trigger: 'change',type:'array'} ],
], plantedCrops: [
landProveUrl:[ { required: true, message: '请输入种植作物', trigger: 'blur' },
{required: true, message: '请上传场地证明', trigger: 'change',type:'array'} { min: 2, max: 100, message: '种植作物长度在2-100个字符之间', trigger: 'blur' }
], ],
productionProveUrl:[ operationYears: [
{required: true, message: '请上传生产证明', trigger: 'change',type:'array'} {
] validator: (rule: any, value: any, callback: any) => {
if (value && !/^[1-9]\d*$/.test(value.toString())) {
callback(new Error('经营年限必须为正整数'))
} else {
callback()
}
},
message: '经营年限必须为正整数',
trigger: ['blur', 'change']
}
],
identityProveUrl: [
{ required: true, message: '请上传身份证明', trigger: 'change', type: 'array' }
],
landProveUrl: [
{ required: true, message: '请上传场地证明', trigger: 'change', type: 'array' }
],
productionProveUrl: [
{ required: true, message: '请上传生产证明', trigger: 'change', type: 'array' }
]
} }
function handleChangeFarmType(e) { function handleChangeFarmType(e) {
formData.baseType = e.value formData.baseType = e.value
formData.baseTypeText = e.text formData.baseTypeText = e.text
show.farmType = false show.farmType = false
} }
function handleChangeAddress(e) { function handleChangeAddress(e) {
formData.province = e.result; formData.province = e.result;
formData.provinceName = e.text[0]; formData.provinceName = e.text[0];
formData.cityName = e.text[1]; formData.cityName = e.text[1];
formData.districtName = e.text[2]; formData.districtName = e.text[2];
show.address = false show.address = false
} }
const userStore = useUserStore() const userStore = useUserStore()
...@@ -249,231 +268,308 @@ const globSetting = useGlobSetting() ...@@ -249,231 +268,308 @@ const globSetting = useGlobSetting()
const toastRef = ref() const toastRef = ref()
// 文件上传 // 文件上传
function afterRead(event, key) { function afterRead(event, key) {
// 获取上传的文件列表 // 获取上传的文件列表
const files = event.file const files = event.file
// 如果没有文件，直接返回 // 如果没有文件，直接返回
if (!files || files.length === 0) return if (!files || files.length === 0) return
// 记录成功上传的数量 // 记录成功上传的数量
let successCount = 0 let successCount = 0
let totalCount = files.length let totalCount = files.length
// 遍历所有文件进行上传 // 遍历所有文件进行上传
files.forEach((file) => { files.forEach((file) => {
uni.uploadFile({ uni.uploadFile({
url: globSetting.apiUrl + globSetting.urlPrefix + '/sys/common/upload', // 直接使用上传接口URL url: globSetting.apiUrl + globSetting.urlPrefix + '/sys/common/upload', // 直接使用上传接口URL
filePath: file.url, filePath: file.url,
name: 'file', name: 'file',
formData: { formData: {
biz: 'temp', biz: 'temp',
}, },
header: { header: {
'X-Access-Token': userStore.getToken, 'X-Access-Token': userStore.getToken,
}, },
success: (res) => { success: (res) => {
if (res.statusCode === 200) { if (res.statusCode === 200) {
const data = JSON.parse(res.data) const data = JSON.parse(res.data)
if (data.code === 200 || data.code === 0) { if (data.code === 200 || data.code === 0) {
successCount++ successCount++
formData[key].push(data.message) formData[key].push(data.message)
// 所有文件上传完成 // 所有文件上传完成
if (successCount === totalCount) { if (successCount === totalCount) {
toastRef.value.show({ toastRef.value.show({
type: 'success', type: 'success',
text: `成功上传${successCount}张图片`, text: `成功上传${successCount}张图片`,
}) })
} }
} }
} }
}, },
fail: () => { fail: () => {
toastRef.value.show({ toastRef.value.show({
type: 'error', type: 'error',
text: '部分图片上传失败', text: '部分图片上传失败',
}) })
}, },
}) })
}) })
} }
// 删除图片 // 删除图片
const deletePic = (event: any, key) => { const deletePic = (event: any, key) => {
formData[key].splice(event.index, 1) formData[key].splice(event.index, 1)
} }
// 提交表单 // 提交表单
const submitForm = async () => { const submitForm = async () => {
try { try {
const valid = await formRef.value.validate() // 先进行表单验证
if (valid) { const valid = await formRef.value.validate()
loading.value = true if (!valid) {
// 这里应该调用提交API return
let paramData = { ...formData }; }
paramData.baseImages = paramData.baseImages.join(',');
paramData.identityProveUrl = paramData.identityProveUrl.join(','); loading.value = true
paramData.landProveUrl = paramData.landProveUrl.join(',');
paramData.productionProveUrl = paramData.productionProveUrl.join(','); // 准备提交数据
paramData.qualityCertificateUrl = paramData.qualityCertificateUrl.join(','); const submitData = { ...formData }
paramData.otherMaterialUrl = paramData.otherMaterialUrl.join(',');
NongchangAPI.addFarmbase(paramData).then(res => { // 将数组字段转换为逗号分隔的字符串
loading.value = false const arrayFields = [
uni.showToast({ title: '提交成功', icon: 'success' }) 'baseImages',
setTimeout(() => { 'identityProveUrl',
uni.navigateBack() 'landProveUrl',
}, 800) 'productionProveUrl',
}).catch(err => { 'qualityCertificateUrl',
loading.value = false; 'otherMaterialUrl'
Message.toast(err.message) ]
})
} arrayFields.forEach(field => {
} catch (error) { if (Array.isArray(submitData[field])) {
console.log('表单验证失败:', error) submitData[field] = submitData[field].filter(item => item?.trim()).join(',')
uni.showToast({ title: '请完善表单信息', icon: 'none' }) }
} })
// 根据是否有ID决定调用编辑还是新增接口
const apiCall = submitData.id ? NongchangAPI.editFarmbase : NongchangAPI.addFarmbase
try {
await apiCall(submitData)
uni.showToast({
title: '提交成功',
icon: 'success',
duration: 1500
})
// 延迟返回上一页
setTimeout(() => {
uni.navigateBack()
}, 1500)
} catch (error) {
console.error('API调用失败:', error)
uni.showToast({
title: error.message || '提交失败，请重试',
icon: 'none',
duration: 2000
})
} finally {
loading.value = false
}
} catch (error) {
console.log('表单验证失败:', error)
loading.value = false
uni.showToast({
title: '请完善表单信息',
icon: 'none',
duration: 2000
})
}
} }
const farmStore = useFarmStore() const farmStore = useFarmStore()
onLoad(() => { onLoad((pageOptions) => {
// 页面加载时的初始化操作 // 页面加载时的初始化操作
const farmInfo = farmStore.getFarm const farmInfo = farmStore.getFarm
if (farmInfo) { if (farmInfo) {
formData.farmId = farmInfo.id formData.farmId = farmInfo.id
} }
options.farmType = dictStore.getDictList['farm_type'].map((item) => { // 修复：修改页面上定义的 options 对象中的 farmType
return { options.farmType = dictStore.getDictList['farm_type'].map((item) => {
value: item.value, return {
text: item.text, value: item.value,
} text: item.text,
}) }
})
if (pageOptions.id) {
NongchangAPI.getFarmbaseInfoById({ id: pageOptions.id }).then(res => {
if (res) {
// 将 res 中的数据赋值到 formData 中，key 保持一致
Object.keys(res).forEach(key => {
if (key in formData) {
// 如果是数组类型的字段且返回的是字符串，需要转换为数组
if (['baseImages', 'identityProveUrl', 'landProveUrl', 'productionProveUrl', 'qualityCertificateUrl', 'otherMaterialUrl'].includes(key) &&
typeof res[key] === 'string') {
formData[key] = res[key].split(',').filter(item => item.trim() !== '')
} else {
formData[key] = res[key]
}
}
})
formData.id = res.id
formData.province = res.provinceName + res.cityName + res.districtName
// 根据 res.baseType 的值从 options.farmType 中查找对应的文本
if (res.baseType && options.farmType.length > 0) {
const foundItem = options.farmType.find((item: any) => item.value === res.baseType)
if (foundItem) {
formData.baseTypeText = foundItem.text
}
}
// 数据赋值完成后，延迟触发表单验证更新
setTimeout(() => {
if (formRef.value) {
// 逐个验证可能存在问题的字段
formRef.value.validateField('scale')
formRef.value.validateField('operationYears')
// 重新验证整个表单
formRef.value.validate()
}
}, 200)
}
})
}
}) })
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.container { .container {
padding: 30rpx; padding: 30rpx;
background-color: #f8f9fa; background-color: #f8f9fa;
min-height: 100vh; min-height: 100vh;
} }
.section-title { .section-title {
font-size: 32rpx; font-size: 32rpx;
font-weight: 600; font-weight: 600;
color: #333; color: #333;
margin: 40rpx 0 20rpx 0; margin: 40rpx 0 20rpx 0;
padding-left: 20rpx; padding-left: 20rpx;
border-left: 6rpx solid #5DB66F; border-left: 6rpx solid #5DB66F;
} }
.address-display { .address-display {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding: 20rpx 0; padding: 20rpx 0;
background-color: transparent; background-color: transparent;
border-bottom: 2rpx solid #e4e7ed; border-bottom: 2rpx solid #e4e7ed;
border-radius: 0; border-radius: 0;
.placeholder-text { .placeholder-text {
color: #c0c4cc; color: #c0c4cc;
} }
} }
.suffix-text { .suffix-text {
color: #909399; color: #909399;
margin-left: 10rpx; margin-left: 10rpx;
} }
.submit-btn-container { .submit-btn-container {
margin: 60rpx 0; margin: 60rpx 0;
::v-deep .u-button { ::v-deep .u-button {
height: 88rpx; height: 88rpx;
border-radius: 44rpx; border-radius: 44rpx;
font-size: 32rpx; font-size: 32rpx;
background-color: #5DB66F; background-color: #5DB66F;
border-color: #5DB66F; border-color: #5DB66F;
} }
} }
// uview-plus 表单样式调整 // uview-plus 表单样式调整
::v-deep .u-form-item { ::v-deep .u-form-item {
margin-bottom: 40rpx; margin-bottom: 40rpx;
.u-form-item__body { .u-form-item__body {
padding: 0; padding: 0;
align-items: flex-start; align-items: flex-start;
} }
.u-form-item__body__left__content__label { .u-form-item__body__left__content__label {
font-size: 28rpx; font-size: 28rpx;
color: #333; color: #333;
font-weight: 500; font-weight: 500;
width: 160rpx; width: 160rpx;
flex-shrink: 0; flex-shrink: 0;
text-align: right; text-align: right;
padding-right: 20rpx; padding-right: 20rpx;
line-height: 80rpx; line-height: 80rpx;
} }
.u-form-item__body__right { .u-form-item__body__right {
flex: 1; flex: 1;
min-width: 0; min-width: 0;
} }
} }
::v-deep .u-form-item__body__left__content__required { ::v-deep .u-form-item__body__left__content__required {
position: static; position: static;
padding-right: 10rpx; padding-right: 10rpx;
} }
// 输入框样式优化 - 只保留下面的线 // 输入框样式优化 - 只保留下面的线
::v-deep .u-input { ::v-deep .u-input {
.u-input__content { .u-input__content {
padding: 0; padding: 0;
.u-input__content__field-wrapper { .u-input__content__field-wrapper {
border: none; border: none;
// border-bottom: 2rpx solid #e4e7ed; // border-bottom: 2rpx solid #e4e7ed;
border-radius: 0; border-radius: 0;
.u-input__content__field-wrapper__field { .u-input__content__field-wrapper__field {
font-size: 28rpx; font-size: 28rpx;
// padding: 20rpx 0; // padding: 20rpx 0;
height: auto; height: auto;
// min-height: 80rpx; // min-height: 80rpx;
} }
.u-input__content__field-wrapper__placeholder { .u-input__content__field-wrapper__placeholder {
color: #c0c4cc; color: #c0c4cc;
font-size: 28rpx; font-size: 28rpx;
} }
} }
&.u-input--focus { &.u-input--focus {
.u-input__content__field-wrapper { .u-input__content__field-wrapper {
border-bottom-color: #5DB66F; border-bottom-color: #5DB66F;
} }
} }
} }
} }
// 上传组件样式调整 // 上传组件样式调整
::v-deep .u-upload { ::v-deep .u-upload {
margin-top: 10rpx; margin-top: 10rpx;
.u-upload__wrap { .u-upload__wrap {
padding: 0; padding: 0;
} }
} }
// 选择器输入框样式 // 选择器输入框样式
::v-deep .u-input--readonly { ::v-deep .u-input--readonly {
.u-input__content__field-wrapper { .u-input__content__field-wrapper {
background-color: transparent; background-color: transparent;
.u-input__content__field-wrapper__field { .u-input__content__field-wrapper__field {
color: #333; color: #333;
} }
} }
} }
</style> </style>
src/pages/jidiguanli/jidiguanli.vue
<script setup lang="ts"> <script setup lang="ts">
import { reactive, ref } from 'vue' import { nextTick, reactive, ref } from 'vue'
import { onPullDownRefresh, onLoad, onShow, onNavigationBarButtonTap } from '@dcloudio/uni-app' import { onLoad, onNavigationBarButtonTap, onShow } from '@dcloudio/uni-app'
import * as NongchangAPI from '@/api/model/nongchang' import * as NongchangAPI from '@/api/model/nongchang'
const isOnePage = ref(true)
const paging = ref(null) const isOnePage = ref(true)
const pageData = reactive({ const paging = ref(null)
param: { const pageData = reactive({
pageNo: 1, param: {
pageSize: 10, pageNo: 1,
baseName: '' pageSize: 10,
}, baseName: '',
list: [], },
total: 0, //基地总数 list: [],
type_success_total: 0,//已认证 total: 0, // 基地总数
type_unverified_total: 0,//未认证 type_success_total: 0, // 已认证
}) type_unverified_total: 0, // 未认证
onNavigationBarButtonTap((e) => { })
console.log('onNavigationBarButtonTap', e) onNavigationBarButtonTap((e) => {
}) console.log('onNavigationBarButtonTap', e)
onLoad(() => { })
onLoad(() => {})
}) onShow(() => {
onShow(() => { nextTick(() => {
if (!isOnePage.value && paging.value) {
nextTick(() => { paging.value.reload()
if(!isOnePage.value)paging.value.refresh(); }
isOnePage.value = false
}) isOnePage.value = false
})
}) })
function getList() { function getList() {
NongchangAPI.getFarmbaseList(pageData.param).then(res => { if (!paging.value) return
pageData.total = res.total; NongchangAPI.getFarmbaseList(pageData.param)
paging.value.complete(res.records); .then((res) => {
}).catch(err => { pageData.total = res.total
paging.value.complete(false); paging.value.complete(res.records)
}) })
} .catch(() => {
onNavigationBarButtonTap((e) => { paging.value.complete(false)
uni.navigateTo({ })
url: './add'
})
})
const queryList = (pageNo, pageSize) => {
pageData.param.pageNo = pageNo;
pageData.param.pageSize = pageSize;
getList()
}
const handleSearch = () => {
// 重置页码为1，重新搜索
pageData.param.pageNo = 1;
paging.value.reload();
}
const del = (id, index) => {
uni.showModal({
title: '提示',
content: '确定删除吗？',
success: (res) => {
if (res.confirm) {
NongchangAPI.delFarmbase(id).then(res => {
uni.showToast({
title: '删除成功',
icon: 'none'
})
paging.value.refresh();
})
}
}
})
} }
onNavigationBarButtonTap((_) => {
uni.navigateTo({
url: './add',
})
})
function queryList(pageNo, pageSize) {
pageData.param.pageNo = pageNo
pageData.param.pageSize = pageSize
getList()
}
function handleSearch() {
// 重置页码为1，重新搜索
pageData.param.pageNo = 1
if (paging.value) {
paging.value.reload()
}
}
const goDetail = (id)=>{
uni.navigateTo({
url: './add?id='+id,
})
}
function del(id) {
uni.showModal({
title: '提示',
content: '确定删除吗？',
success: (res) => {
if (res.confirm) {
NongchangAPI.delFarmbase(id).then(() => {
uni.showToast({
title: '删除成功',
icon: 'none',
})
if (paging.value) {
paging.value.reload()
}
})
}
},
})
}
</script> </script>
<template> <template>
<view class="codefun-flex-col page"> <view class="codefun-flex-col page">
<!-- <view class="codefun-flex-col section"> <z-paging ref="paging" v-model="pageData.list" @query="queryList">
<view class="codefun-flex-row codefun-justify-between codefun-items-center"> <view class="codefun-flex-col group_3">
<image class="image" src="/static/images/codefun/187b02e95cf1f33e4fa03b784305e21d.png" /> <view class="codefun-flex-row codefun-items-center section_2">
<view class="codefun-flex-row group"> <image class="image_6" src="/static/images/codefun/6c5c5a3c082b8c60a307d3a7caee623c.png" />
<image class="image_2" src="/static/images/codefun/5095bac6e3d752cba3708a4aaae4995a.png" /> <u-input
<image class="image_3 ml-5" src="/static/images/codefun/568ef7f0e1d4af85ed9e599afdc74d20.png" /> v-model="pageData.param.baseName"
<image class="image_4 ml-5" src="/static/images/codefun/21fe98696f0027c988d25f6121cc2831.png" /> placeholder="请输入搜索内容"
</view> border="none"
</view> class="codefun-ml-8"
<view class="codefun-mt-22 codefun-flex-row codefun-justify-center codefun-items-center codefun-relative group_2"> @confirm="handleSearch"
<image class="image_5 pos" src="/static/images/codefun/8e086590d7d14994e1d62cf41c8ccff9.png" /> />
<text class="font text">农场基地管理</text> </view>
<view class="codefun-flex-row codefun-items-center pos_2"> <view class="codefun-mt-12 codefun-flex-col section_3">
<image class="codefun-shrink-0 image_6" src="/static/images/codefun/09abef094d235d5ac956a89c6f8a3835.png" /> <view class="codefun-flex-row codefun-justify-between group_4">
<text class="font_2 text_2 ml-5">添加基地</text> <view class="codefun-flex-row codefun-self-start">
</view> <image
</view> class="codefun-shrink-0 image_7"
</view> --> src="/static/images/codefun/db26a8ae3f4d5f1e0a3f11d8fb5bc491.png"
<z-paging ref="paging" v-model="pageData.list" @query="queryList"> />
<view class="codefun-flex-col group_3"> <view
<view class="codefun-flex-row codefun-items-center section_2"> class="codefun-flex-col codefun-items-start codefun-shrink-0 codefun-self-center group_7"
<image class="image_6" src="/static/images/codefun/6c5c5a3c082b8c60a307d3a7caee623c.png" /> >
<u-input <text class="text_5">{{ pageData.total }}</text>
v-model="pageData.param.baseName" <text class="font_4 text_7 mt-5">总基地数</text>
placeholder="请输入搜索内容" </view>
border="none" <text class="codefun-self-start font_4 text_4">个</text>
class="codefun-ml-8" </view>
@confirm="handleSearch" <view class="codefun-flex-col codefun-self-center group_5">
/> <view class="codefun-flex-row codefun-items-center group_6">
</view> <image
<view class="codefun-mt-12 codefun-flex-col section_3"> class="image_6"
<view class="codefun-flex-row codefun-justify-between group_4"> src="/static/images/codefun/118c884c539aaba710313f0682db00e1.png"
<view class="codefun-flex-row codefun-self-start"> />
<image class="codefun-shrink-0 image_7" <view
src="/static/images/codefun/db26a8ae3f4d5f1e0a3f11d8fb5bc491.png" /> class="codefun-ml-4 codefun-flex-col codefun-justify-start codefun-items-center text-wrapper"
<view >
class="codefun-flex-col codefun-items-start codefun-shrink-0 codefun-self-center group_7"> <text class="font_3 text_6">已认证：</text>
<text class="text_5">{{ pageData.total }}</text> </view>
<text class="font_4 text_7 mt-5">总基地数</text> <view
</view> class="codefun-ml-4 codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_2"
<text class="codefun-self-start font_4 text_4">个</text> >
</view> <text class="font_5">{{ pageData.type_success_total }}个</text>
<view class="codefun-flex-col codefun-self-center group_5"> </view>
<view class="codefun-flex-row codefun-items-center group_6"> </view>
<image class="image_6" <view class="codefun-flex-row codefun-items-center group_8">
src="/static/images/codefun/118c884c539aaba710313f0682db00e1.png" /> <image
<view class="image_6"
class="codefun-ml-4 codefun-flex-col codefun-justify-start codefun-items-center text-wrapper"> src="/static/images/codefun/27ef797870c2085d1a14446c50cf53e0.png"
<text class="font_3 text_6">已认证：</text> />
</view> <view
<view class="codefun-ml-4 codefun-flex-col codefun-justify-start codefun-items-center text-wrapper"
class="codefun-ml-4 codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_2"> >
<text class="font_5">{{ pageData.type_success_total }}个</text> <text class="font_3 text_6">待认证：</text>
</view> </view>
</view> <view
<view class="codefun-flex-row codefun-items-center group_8"> class="codefun-ml-4 codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_3"
<image class="image_6" >
src="/static/images/codefun/27ef797870c2085d1a14446c50cf53e0.png" /> <text class="font_3 text_8">{{ pageData.type_unverified_total }}个</text>
<view </view>
class="codefun-ml-4 codefun-flex-col codefun-justify-start codefun-items-center text-wrapper"> </view>
<text class="font_3 text_6">待认证：</text> </view>
</view> </view>
<view <view class="codefun-flex-row codefun-justify-between codefun-items-center group_9">
class="codefun-ml-4 codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_3"> <view class="codefun-flex-row">
<text class="font_3 text_8">{{ pageData.type_unverified_total }}个</text> <image class="image_8" src="/static/images/codefun/c24e87154a833caadfcb70fb24ae52dc.png" />
</view> <view
</view> class="codefun-ml-4 codefun-flex-col codefun-justify-start codefun-items-start text-wrapper_4"
</view> >
</view> <text class="font_5">基地认证指南</text>
<view class="codefun-flex-row codefun-justify-between codefun-items-center group_9"> </view>
<view class="codefun-flex-row"> </view>
<image class="image_8" src="/static/images/codefun/c24e87154a833caadfcb70fb24ae52dc.png" /> <image class="image_9" src="/static/images/codefun/7e185c6d21ed1b0d04422b2d3835fce8.png" />
<view </view>
class="codefun-ml-4 codefun-flex-col codefun-justify-start codefun-items-start text-wrapper_4"> </view>
<text class="font_5">基地认证指南</text> <view class="codefun-mt-12 codefun-flex-col section_4" v-if="pageData.list.length">
</view> <view class="codefun-flex-col codefun-self-stretch list">
</view> <view
<image class="image_9" src="/static/images/codefun/7e185c6d21ed1b0d04422b2d3835fce8.png" /> class="codefun-flex-row codefun-items-center list-item"
</view> v-for="(item, index) in pageData.list"
</view> :key="index"
<view class="codefun-mt-12 codefun-flex-col section_4" v-if="pageData.list.length"> >
<view class="codefun-flex-col codefun-self-stretch list"> <view class="codefun-flex-col codefun-justify-start codefun-items-start section_5">
<view class="codefun-flex-row codefun-items-center list-item" <view
v-for="(item, index) in pageData.list" :key="index"> class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_5"
<view class="codefun-flex-col codefun-justify-start codefun-items-start section_5"> >
<view <text class="font_6">{{ item.auditStatus_dictText }}</text>
class="codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_5"> </view>
<text class="font_6">{{ item.auditStatus_dictText }}</text> </view>
</view> <view class="codefun-flex-col codefun-flex-1 group_10 ml-13">
</view> <view class="codefun-flex-col">
<view class="codefun-flex-col codefun-flex-1 group_10 ml-13"> <text class="codefun-self-start font">{{ item.baseName }}</text>
<view class="codefun-flex-col"> <view class="codefun-flex-row codefun-self-stretch mt-11">
<text class="codefun-self-start font">{{ item.baseName }}</text> <text class="font_4 text_9">类型：{{ item.baseType_dictText }}</text>
<view class="codefun-flex-row codefun-self-stretch mt-11"> <text class="font_4 text_10 ml-13">规模：{{ item.scale }} 亩</text>
<text class="font_4 text_9">类型：{{ item.baseType_dictText }}</text> </view>
<text class="font_4 text_10 ml-13">规模：{{ item.scale }} 亩</text> </view>
</view> <view
</view> class="codefun-mt-18 codefun-flex-row codefun-justify-between codefun-items-center group_11"
<view >
class="codefun-mt-18 codefun-flex-row codefun-justify-between codefun-items-center group_11"> <view class="codefun-flex-row" @click="goDetail(item.id)">
<view class="codefun-flex-row"> <image
<image class="image_10" class="image_10"
src="/static/images/codefun/3566724e23f8a91e60ae87c2744e4090.png" /> src="/static/images/codefun/3566724e23f8a91e60ae87c2744e4090.png"
<view />
class="codefun-ml-4 codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_6"> <view
<text class="font_7 text_11">详情</text> class="codefun-ml-4 codefun-flex-col codefun-justify-start codefun-items-center text-wrapper_6"
</view> >
</view> <text class="font_7 text_11">详情</text>
<view class="codefun-flex-row codefun-items-center" @click="del(item.id, index)"> </view>
<image class="codefun-shrink-0 image_10" </view>
src="/static/images/codefun/8630d19ebb6334e2028daa7d7b8b5983.png" /> <view class="codefun-flex-row codefun-items-center" @click="del(item.id)">
<text class="font_8 ml-5">删除</text> <image
</view> class="codefun-shrink-0 image_10"
</view> src="/static/images/codefun/8630d19ebb6334e2028daa7d7b8b5983.png"
</view> />
</view> <text class="font_8 ml-5">删除</text>
</view> </view>
</view> </view>
</view> </view>
</z-paging> </view>
</view>
</view> </view>
</view>
</z-paging>
</view>
</template> </template>
<style scoped lang="scss"> <style scoped lang="scss">
body { body {
background-color: #e6f5e8; background-color: #e6f5e8;
} }
.mt-5 { .mt-5 {
margin-top: 10rpx; margin-top: 10rpx;
} }
.mt-11 { .mt-11 {
margin-top: 22rpx; margin-top: 22rpx;
} }
.ml-5 { .ml-5 {
margin-left: 10rpx; margin-left: 10rpx;
} }
.ml-13 { .ml-13 {
margin-left: 26rpx; margin-left: 26rpx;
} }
.ml-9 { .ml-9 {
margin-left: 18rpx; margin-left: 18rpx;
} }
.page { .page {
background-color: #e6f5e8; background-color: #e6f5e8;
mix-blend-mode: NOTTHROUGH; mix-blend-mode: NOTTHROUGH;
width: 100%; width: 100%;
overflow-y: auto; overflow-y: auto;
overflow-x: hidden; overflow-x: hidden;
height: 100%; height: 100%;
.section { .section {
padding: 32rpx 24rpx 32rpx 36rpx; padding: 32rpx 24rpx 32rpx 36rpx;
background-color: #5db66f; background-color: #5db66f;
mix-blend-mode: NOTTHROUGH; mix-blend-mode: NOTTHROUGH;
.image { .image {
border-radius: 64rpx; border-radius: 64rpx;
width: 108rpx; width: 108rpx;
height: 42rpx; height: 42rpx;
} }
.group { .group {
margin-right: 4rpx; margin-right: 4rpx;
.image_2 { .image_2 {
mix-blend-mode: NOTTHROUGH; mix-blend-mode: NOTTHROUGH;
width: 34rpx; width: 34rpx;
height: 22rpx; height: 22rpx;
} }
.image_3 { .image_3 {
mix-blend-mode: NOTTHROUGH; mix-blend-mode: NOTTHROUGH;
width: 30rpx; width: 30rpx;
height: 22rpx; height: 22rpx;
} }
.image_4 { .image_4 {
width: 48rpx; width: 48rpx;
height: 22rpx; height: 22rpx;
} }
} }
.group_2 { .group_2 {
padding-left: 6rpx; padding-left: 6rpx;
.image_5 { .image_5 {
mix-blend-mode: NOTTHROUGH; mix-blend-mode: NOTTHROUGH;
width: 14rpx; width: 14rpx;
height: 26rpx; height: 26rpx;
} }
.pos { .pos {
position: absolute; position: absolute;
left: 6rpx; left: 6rpx;
top: 50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
} }
.text { .text {
color: #ffffffe6; color: #ffffffe6;
line-height: 29.6rpx; line-height: 29.6rpx;
} }
.pos_2 { .pos_2 {
position: absolute; position: absolute;
right: 0; right: 0;
top: 50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
.text_2 { .text_2 {
line-height: 25.78rpx; line-height: 25.78rpx;
} }
} }
} }
} }
.group_3 { .group_3 {
padding: 28rpx 24rpx 58rpx; padding: 28rpx 24rpx 58rpx;
.section_2 { .section_2 {
padding: 16rpx 20rpx; padding: 16rpx 20rpx;
background-color: #ffffff; background-color: #ffffff;
border-radius: 1998rpx; border-radius: 1998rpx;
mix-blend-mode: NOTTHROUGH; mix-blend-mode: NOTTHROUGH;
.text_3 { .text_3 {
color: #cccccc; color: #cccccc;
line-height: 26.02rpx; line-height: 26.02rpx;
} }
} }
.section_3 { .section_3 {
padding: 0 24rpx; padding: 0 24rpx;
background-color: #ffffff; background-color: #ffffff;
border-radius: 18.46rpx; border-radius: 18.46rpx;
mix-blend-mode: NOTTHROUGH; mix-blend-mode: NOTTHROUGH;
.group_4 { .group_4 {
padding: 42rpx 4rpx 30rpx 22rpx; padding: 42rpx 4rpx 30rpx 22rpx;
border-bottom: solid 2rpx #eeeeee; border-bottom: solid 2rpx #eeeeee;
.image_7 { .image_7 {
width: 100rpx; width: 100rpx;
height: 86rpx; height: 86rpx;
} }
.group_7 { .group_7 {
margin-left: 32rpx; margin-left: 32rpx;
.text_5 { .text_5 {
color: #5db66f; color: #5db66f;
font-size: 40rpx; font-size: 40rpx;
font-family: SourceHanSansCN; font-family: SourceHanSansCN;
line-height: 40rpx; line-height: 40rpx;
} }
.text_7 { .text_7 {
line-height: 22.18rpx; line-height: 22.18rpx;
} }
} }
.text_4 { .text_4 {
color: #333333; color: #333333;
line-height: 40rpx; line-height: 40rpx;
} }
.group_5 { .group_5 {
width: 219.94rpx; width: 219.94rpx;
.group_6 { .group_6 {
overflow: hidden; overflow: hidden;
.text-wrapper_2 { .text-wrapper_2 {
padding: 8rpx 0 4rpx; padding: 8rpx 0 4rpx;
overflow: hidden; overflow: hidden;
width: 60rpx; width: 60rpx;
height: 40rpx; height: 40rpx;
} }
} }
.group_8 { .group_8 {
padding-top: 16rpx; padding-top: 16rpx;
.text-wrapper_3 { .text-wrapper_3 {
padding: 8rpx 0 4rpx; padding: 8rpx 0 4rpx;
overflow: hidden; overflow: hidden;
width: 60rpx; width: 60rpx;
height: 40rpx; height: 40rpx;
.text_8 { .text_8 {
color: #ff9800; color: #ff9800;
} }
} }
} }
.text-wrapper { .text-wrapper {
padding: 8rpx 0 4rpx; padding: 8rpx 0 4rpx;
overflow: hidden; overflow: hidden;
width: 112rpx; width: 112rpx;
height: 40rpx; height: 40rpx;
.text_6 { .text_6 {
line-height: 25.74rpx; line-height: 25.74rpx;
} }
} }
} }
} }
.group_9 { .group_9 {
padding: 12rpx 4rpx; padding: 12rpx 4rpx;
.image_8 { .image_8 {
margin: 4rpx 0; margin: 4rpx 0;
width: 40rpx; width: 40rpx;
height: 40rpx; height: 40rpx;
} }
.text-wrapper_4 { .text-wrapper_4 {
padding: 12rpx 0; padding: 12rpx 0;
overflow: hidden; overflow: hidden;
width: 168rpx; width: 168rpx;
height: 48rpx; height: 48rpx;
} }
.image_9 { .image_9 {
margin-right: 12rpx; margin-right: 12rpx;
width: 16rpx; width: 16rpx;
height: 26rpx; height: 26rpx;
} }
} }
.font_5 { .font_5 {
font-size: 28rpx; font-size: 28rpx;
font-family: SourceHanSansCN; font-family: SourceHanSansCN;
line-height: 25.76rpx; line-height: 25.76rpx;
color: #5db66f; color: #5db66f;
} }
} }
.font_3 { .font_3 {
font-size: 28rpx; font-size: 28rpx;
font-family: SourceHanSansCN; font-family: SourceHanSansCN;
line-height: 25.76rpx; line-height: 25.76rpx;
color: #1f2937; color: #1f2937;
} }
.section_4 { .section_4 {
padding-left: 6rpx; padding-left: 6rpx;
padding-bottom: 26rpx; padding-bottom: 26rpx;
background-color: #ffffff; background-color: #ffffff;
border-radius: 26.28rpx; border-radius: 26.28rpx;
mix-blend-mode: NOTTHROUGH; mix-blend-mode: NOTTHROUGH;
.list { .list {
margin-left: 18rpx; margin-left: 18rpx;
margin-right: 24rpx; margin-right: 24rpx;
.list-item { .list-item {
padding: 24rpx 0; padding: 24rpx 0;
border-bottom: solid 2rpx #eeeeee; border-bottom: solid 2rpx #eeeeee;
.section_5 { .section_5 {
padding: 12rpx 0 116rpx; padding: 12rpx 0 116rpx;
background-image: url('/static/images/codefun/4be80e2618f3c4b4aa1ce64fd9063abf.png'); background-image: url('/static/images/codefun/4be80e2618f3c4b4aa1ce64fd9063abf.png');
background-size: 100% 100%; background-size: 100% 100%;
background-repeat: no-repeat; background-repeat: no-repeat;
width: 160rpx; width: 160rpx;
height: 160rpx; height: 160rpx;
.text-wrapper_5 { .text-wrapper_5 {
padding: 8rpx 0; padding: 8rpx 0;
background-image: linear-gradient(90deg, #43cf7c 0%, #5db66f 100%); background-image: linear-gradient(90deg, #43cf7c 0%, #5db66f 100%);
border-radius: 0rpx 8rpx 8rpx 0rpx; border-radius: 0rpx 8rpx 8rpx 0rpx;
mix-blend-mode: NOTTHROUGH; mix-blend-mode: NOTTHROUGH;
width: 84rpx; width: 84rpx;
.font_6 { .font_6 {
font-size: 20rpx; font-size: 20rpx;
font-family: SourceHanSansCN; font-family: SourceHanSansCN;
line-height: 18.38rpx; line-height: 18.38rpx;
color: #ffffff; color: #ffffff;
} }
} }
} }
.group_10 { .group_10 {
margin-right: 40rpx; margin-right: 40rpx;
.text_9 { .text_9 {
line-height: 22.34rpx; line-height: 22.34rpx;
} }
.text_10 { .text_10 {
line-height: 22.22rpx; line-height: 22.22rpx;
} }
.group_11 { .group_11 {
padding-left: 64rpx; padding-left: 64rpx;
.image_10 { .image_10 {
width: 28rpx; width: 28rpx;
height: 28rpx; height: 28rpx;
} }
.text-wrapper_6 { .text-wrapper_6 {
padding-top: 8rpx; padding-top: 8rpx;
overflow: hidden; overflow: hidden;
width: 48rpx; width: 48rpx;
height: 32rpx; height: 32rpx;
.text_11 { .text_11 {
line-height: 22.12rpx; line-height: 22.12rpx;
} }
} }
.font_8 { .font_8 {
font-size: 24rpx; font-size: 24rpx;
font-family: SourceHanSansCN; font-family: SourceHanSansCN;
line-height: 22.28rpx; line-height: 22.28rpx;
color: #f44336; color: #f44336;
} }
} }
} }
} }
} }
.group_14 { .group_14 {
margin: 18rpx 24rpx 0; margin: 18rpx 24rpx 0;
.text_14 { .text_14 {
line-height: 26.12rpx; line-height: 26.12rpx;
} }
.text-wrapper_8 { .text-wrapper_8 {
padding: 4rpx 0; padding: 4rpx 0;
overflow: hidden; overflow: hidden;
width: 48rpx; width: 48rpx;
height: 32rpx; height: 32rpx;
.text_15 { .text_15 {
line-height: 22.2rpx; line-height: 22.2rpx;
} }
} }
} }
.font_7 { .font_7 {
font-size: 24rpx; font-size: 24rpx;
font-family: SourceHanSansCN; font-family: SourceHanSansCN;
line-height: 22.28rpx; line-height: 22.28rpx;
color: #5db66f; color: #5db66f;
} }
.group_15 { .group_15 {
margin-left: 24rpx; margin-left: 24rpx;
margin-top: 28rpx; margin-top: 28rpx;
width: 528.18rpx; width: 528.18rpx;
.text_16 { .text_16 {
line-height: 25.12rpx; line-height: 25.12rpx;
} }
.text_17 { .text_17 {
line-height: 26.26rpx; line-height: 26.26rpx;
} }
} }
.group_16 { .group_16 {
margin-left: 24rpx; margin-left: 24rpx;
margin-top: 28rpx; margin-top: 28rpx;
width: 216.94rpx; width: 216.94rpx;
.text_18 { .text_18 {
line-height: 25.82rpx; line-height: 25.82rpx;
} }
.text_19 { .text_19 {
line-height: 25.34rpx; line-height: 25.34rpx;
} }
} }
.font_9 { .font_9 {
font-size: 28rpx; font-size: 28rpx;
font-family: SourceHanSansCN; font-family: SourceHanSansCN;
line-height: 25.76rpx; line-height: 25.76rpx;
color: #6b7280; color: #6b7280;
} }
.group_17 { .group_17 {
margin-left: 24rpx; margin-left: 24rpx;
margin-top: 28rpx; margin-top: 28rpx;
.text_20 { .text_20 {
line-height: 26.16rpx; line-height: 26.16rpx;
} }
.text_21 { .text_21 {
line-height: 22.66rpx; line-height: 22.66rpx;
} }
} }
.divider { .divider {
margin: 28rpx 18rpx 0 24rpx; margin: 28rpx 18rpx 0 24rpx;
background-color: #f3f4f6; background-color: #f3f4f6;
height: 2rpx; height: 2rpx;
} }
.text_22 { .text_22 {
margin-left: 24rpx; margin-left: 24rpx;
margin-top: 32rpx; margin-top: 32rpx;
line-height: 26.12rpx; line-height: 26.12rpx;
} }
.group_18 { .group_18 {
margin-left: 24rpx; margin-left: 24rpx;
margin-top: 32rpx; margin-top: 32rpx;
.text_23 { .text_23 {
line-height: 26.06rpx; line-height: 26.06rpx;
} }
.text_24 { .text_24 {
line-height: 22.66rpx; line-height: 22.66rpx;
} }
} }
.font_10 { .font_10 {
font-size: 28rpx; font-size: 28rpx;
font-family: SourceHanSansCN; font-family: SourceHanSansCN;
line-height: 22.28rpx; line-height: 22.28rpx;
color: #1f2937; color: #1f2937;
} }
.group_19 { .group_19 {
margin-left: 24rpx; margin-left: 24rpx;
margin-top: 28rpx; margin-top: 28rpx;
.text_25 { .text_25 {
line-height: 25.9rpx; line-height: 25.9rpx;
} }
.text_26 { .text_26 {
line-height: 25.78rpx; line-height: 25.78rpx;
} }
} }
.group_20 { .group_20 {
margin-left: 24rpx; margin-left: 24rpx;
margin-top: 32rpx; margin-top: 32rpx;
.text_27 { .text_27 {
line-height: 25.96rpx; line-height: 25.96rpx;
} }
.text_28 { .text_28 {
line-height: 25.88rpx; line-height: 25.88rpx;
} }
} }
.divider_2 { .divider_2 {
margin-top: 28rpx; margin-top: 28rpx;
background-color: #f3f4f6; background-color: #f3f4f6;
width: 716rpx; width: 716rpx;
height: 2rpx; height: 2rpx;
} }
.text-wrapper_9 { .text-wrapper_9 {
margin-left: 24rpx; margin-left: 24rpx;
margin-top: 32rpx; margin-top: 32rpx;
padding: 24rpx 0; padding: 24rpx 0;
background-color: #5db66f; background-color: #5db66f;
border-radius: 400rpx; border-radius: 400rpx;
mix-blend-mode: NOTTHROUGH; mix-blend-mode: NOTTHROUGH;
.text_29 { .text_29 {
line-height: 25.9rpx; line-height: 25.9rpx;
} }
} }
} }
.font_4 { .font_4 {
font-size: 24rpx; font-size: 24rpx;
font-family: SourceHanSansCN; font-family: SourceHanSansCN;
line-height: 22.28rpx; line-height: 22.28rpx;
color: #555555; color: #555555;
} }
} }
.image_6 { .image_6 {
width: 32rpx; width: 32rpx;
height: 32rpx; height: 32rpx;
} }
.font { .font {
font-size: 32rpx; font-size: 32rpx;
font-family: SourceHanSansCN; font-family: SourceHanSansCN;
line-height: 29.88rpx; line-height: 29.88rpx;
color: #333333; color: #333333;
} }
.font_2 { .font_2 {
font-size: 28rpx; font-size: 28rpx;
font-family: SourceHanSansCN; font-family: SourceHanSansCN;
line-height: 25.76rpx; line-height: 25.76rpx;
color: #ffffff; color: #ffffff;
} }
} }
</style> </style>
\ No newline at end of file
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论