城镇基础数据
parent
b9845d3065
commit
e1e4dcce03
|
|
@ -646,4 +646,10 @@ body, uni-page-body {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dropdownClose{
|
||||
.u-dropdown__content{
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,37 @@
|
|||
<template>
|
||||
<u-navbar
|
||||
:title="title"
|
||||
:background="background"
|
||||
:custom-back="goback"
|
||||
:title-color="titleColor"
|
||||
:back-icon-color="titleColor"
|
||||
>
|
||||
<template #right>
|
||||
<slot name="right"></slot>
|
||||
</template>
|
||||
</u-navbar>
|
||||
</template>
|
||||
<script>
|
||||
import { navigateBack } from '@/com/utils.js'
|
||||
export default {
|
||||
props: {
|
||||
title: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
background: {
|
||||
backgroundColor: '#2a7dc9',
|
||||
},
|
||||
titleColor: '#ffffff',
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
goback() {
|
||||
navigateBack()
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
@ -13,10 +13,14 @@
|
|||
</view>
|
||||
<scroll-view scroll-y="true" class="max-h-1200rpx">
|
||||
<view v-if="colums.length && data && Object.keys(data).length">
|
||||
<view class="flex items-center" v-for="(item, i) in colums" :key="i">
|
||||
<view
|
||||
class="flex items-center"
|
||||
v-for="(item, i) in columsList"
|
||||
:key="i"
|
||||
>
|
||||
<u-cell-item
|
||||
:title="item.title"
|
||||
:value="data[item.dataIndex]"
|
||||
:value="item.value"
|
||||
:arrow="false"
|
||||
></u-cell-item>
|
||||
</view>
|
||||
|
|
@ -56,8 +60,26 @@ export default {
|
|||
isDel() {
|
||||
return !!this.$listeners.onDel
|
||||
},
|
||||
columsList() {
|
||||
const arr = []
|
||||
this.colums.forEach((e) => {
|
||||
const { dataIndex, format } = e
|
||||
let str = this.data[dataIndex]
|
||||
if (this.isFunction(format)) {
|
||||
str = format(str)
|
||||
}
|
||||
arr.push({
|
||||
...e,
|
||||
value: str,
|
||||
})
|
||||
})
|
||||
return arr
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
isFunction(fn) {
|
||||
return typeof fn === 'function'
|
||||
},
|
||||
handleEdit() {
|
||||
this.$emit('onEdit', this.data)
|
||||
},
|
||||
|
|
|
|||
|
|
@ -0,0 +1,114 @@
|
|||
<template>
|
||||
<view>
|
||||
<u-checkbox-group @change="checkboxGroupChange">
|
||||
<u-checkbox
|
||||
v-model="item.checked"
|
||||
@change="checkboxChange"
|
||||
v-for="(item, index) in getOptions"
|
||||
:key="item.value"
|
||||
:name="item.value"
|
||||
>{{ item.label }}</u-checkbox
|
||||
>
|
||||
</u-checkbox-group>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import { omit } from 'lodash-es'
|
||||
export default {
|
||||
props: {
|
||||
api: {
|
||||
type: Function,
|
||||
default: () => {},
|
||||
},
|
||||
value: {
|
||||
type: [Array, Object, String, Number],
|
||||
},
|
||||
params: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
labelField: {
|
||||
type: String,
|
||||
default: 'label',
|
||||
},
|
||||
valueField: {
|
||||
type: String,
|
||||
default: 'value',
|
||||
},
|
||||
placeholder: {
|
||||
type: String,
|
||||
default: '请选择',
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
checkValue: [],
|
||||
options: [],
|
||||
getOptions: [],
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
created() {
|
||||
this.fetch()
|
||||
},
|
||||
methods: {
|
||||
getOptionsFun() {
|
||||
const { labelField, valueField } = this
|
||||
return this.options.reduce((prev, next) => {
|
||||
if (next) {
|
||||
const value = next[valueField]
|
||||
prev.push({
|
||||
...omit(next, [labelField, valueField]),
|
||||
label: next[labelField],
|
||||
value: value,
|
||||
key: value,
|
||||
checked: this.checkValue.includes(value),
|
||||
})
|
||||
}
|
||||
return prev
|
||||
}, [])
|
||||
},
|
||||
checkboxChange(e) {},
|
||||
checkboxGroupChange(e) {
|
||||
this.checkValue = e
|
||||
this.$emit('change', e)
|
||||
this.$emit('input', e)
|
||||
},
|
||||
async fetch() {
|
||||
const api = this.api
|
||||
if (!api || !this.isFunction(api)) return
|
||||
this.options = []
|
||||
try {
|
||||
const data = await api(this.params)
|
||||
this.isFirstLoad = false
|
||||
if (Array.isArray(data)) {
|
||||
this.options = data
|
||||
this.getOptions = this.getOptionsFun()
|
||||
this.emitChange()
|
||||
return
|
||||
}
|
||||
|
||||
this.emitChange()
|
||||
} catch (error) {
|
||||
console.warn(error)
|
||||
}
|
||||
},
|
||||
emitChange() {
|
||||
this.$emit('options-change', this.getOptions)
|
||||
},
|
||||
isFunction(fn) {
|
||||
return typeof fn === 'function'
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
value: {
|
||||
handler(val) {
|
||||
this.checkValue = val ?? []
|
||||
this.getOptionsFun()
|
||||
},
|
||||
immediate: true,
|
||||
deep: true,
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,115 @@
|
|||
<template>
|
||||
<view class="w-full">
|
||||
<view @click="show = true">
|
||||
<u-input
|
||||
class="w-full !pointer-events-none"
|
||||
:placeholder="placeholder"
|
||||
:value="showText"
|
||||
type="select"
|
||||
/>
|
||||
</view>
|
||||
<u-select
|
||||
@confirm="handleConfirm"
|
||||
:default-value="defaultValue"
|
||||
v-model="show"
|
||||
:list="getOptions"
|
||||
></u-select>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import { omit } from 'lodash-es'
|
||||
export default {
|
||||
props: {
|
||||
api: {
|
||||
type: Function,
|
||||
default: () => {},
|
||||
},
|
||||
value: {
|
||||
type: [Array, Object, String, Number],
|
||||
},
|
||||
params: {
|
||||
type: Object,
|
||||
default: () => ({}),
|
||||
},
|
||||
labelField: {
|
||||
type: String,
|
||||
default: 'label',
|
||||
},
|
||||
valueField: {
|
||||
type: String,
|
||||
default: 'value',
|
||||
},
|
||||
placeholder: {
|
||||
type: String,
|
||||
default: '请选择',
|
||||
},
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
show: false,
|
||||
options: [],
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
currentOption() {
|
||||
const item = this.getOptions.find((e) => e.value == this.value)
|
||||
return item ?? {}
|
||||
},
|
||||
showText() {
|
||||
return this.currentOption?.label ?? this.value
|
||||
},
|
||||
defaultValue() {
|
||||
const index = this.getOptions.findIndex((e) => e.value == this.value)
|
||||
return [index > -1 ? index : 0]
|
||||
},
|
||||
getOptions() {
|
||||
const { labelField, valueField } = this
|
||||
return this.options.reduce((prev, next) => {
|
||||
if (next) {
|
||||
const value = next[valueField]
|
||||
prev.push({
|
||||
...omit(next, [labelField, valueField]),
|
||||
label: next[labelField],
|
||||
value: value,
|
||||
})
|
||||
}
|
||||
return prev
|
||||
}, [])
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.fetch()
|
||||
},
|
||||
methods: {
|
||||
async fetch() {
|
||||
const api = this.api
|
||||
if (!api || !this.isFunction(api)) return
|
||||
this.options = []
|
||||
try {
|
||||
const data = await api(this.params)
|
||||
this.isFirstLoad = false
|
||||
if (Array.isArray(data)) {
|
||||
this.options = data
|
||||
this.emitChange()
|
||||
return
|
||||
}
|
||||
this.emitChange()
|
||||
} catch (error) {
|
||||
console.warn(error)
|
||||
}
|
||||
},
|
||||
emitChange() {
|
||||
this.$emit('options-change', this.getOptions)
|
||||
},
|
||||
handleConfirm(e) {
|
||||
const { value } = e[0]
|
||||
this.$emit('change', value)
|
||||
this.$emit('input', value)
|
||||
},
|
||||
isFunction(fn) {
|
||||
return typeof fn === 'function'
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,62 @@
|
|||
<template>
|
||||
<u-dropdown-item :title="label">
|
||||
<view class="bg-white p-30rpx">
|
||||
<u-input v-model="status" :placeholder="placeholder" class="flex-1" />
|
||||
<view class="my-20rpx">
|
||||
<u-line></u-line>
|
||||
</view>
|
||||
<u-button type="primary" @click="handleChange">确定</u-button>
|
||||
</view>
|
||||
</u-dropdown-item>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
label: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
value: {
|
||||
type: [Array, Object, String, Number],
|
||||
},
|
||||
placeholder: {
|
||||
type: [Array, String],
|
||||
default: '请输入',
|
||||
},
|
||||
isOpen: {
|
||||
type: Boolean,
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
// status: {
|
||||
// get() {
|
||||
// console.log(this.value);
|
||||
// return this.value
|
||||
// },
|
||||
// set(val) {
|
||||
// // this.$emit('change', val)
|
||||
// // this.$emit('input', val)
|
||||
// },
|
||||
// },
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
status: '',
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleChange() {
|
||||
this.$emit('change', this.status)
|
||||
this.$emit('close-dropdown', this.status)
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
isOpen: {
|
||||
handler(e) {
|
||||
this.status = this.value
|
||||
},
|
||||
immediate: true,
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
@ -1,13 +1,14 @@
|
|||
<template>
|
||||
<component v-bind="getBindValue.bind" v-on="getBindValue.on"></component>
|
||||
</template>
|
||||
<script>
|
||||
<script>
|
||||
import ApiSelect from './ApiSelect.vue'
|
||||
import Calendar from './Calendar.vue'
|
||||
import Input from './Input.vue'
|
||||
import { upperFirst, kebabCase } from 'lodash-es'
|
||||
export default {
|
||||
props: {
|
||||
schema: {
|
||||
schema: {
|
||||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
|
|
@ -23,10 +24,14 @@ export default {
|
|||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
isOpen: {
|
||||
type: Boolean,
|
||||
},
|
||||
},
|
||||
components: {
|
||||
ApiSelect,
|
||||
Calendar
|
||||
Calendar,
|
||||
Input,
|
||||
},
|
||||
created() {
|
||||
// this.fetch()
|
||||
|
|
@ -92,6 +97,7 @@ export default {
|
|||
...propsData,
|
||||
...bindValue,
|
||||
...on,
|
||||
isOpen: this.isOpen,
|
||||
}
|
||||
const onEventsObject = {}
|
||||
const bindObject = {}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,11 @@
|
|||
<template>
|
||||
<view>
|
||||
<u-dropdown ref="dropdownRef">
|
||||
<u-dropdown
|
||||
ref="dropdownRef"
|
||||
:class="{ dropdownClose: !isOpen }"
|
||||
@open="isOpen = true"
|
||||
@close="isOpen = false"
|
||||
>
|
||||
<SearchItem
|
||||
v-for="schema in getSchema"
|
||||
:key="schema.field"
|
||||
|
|
@ -8,6 +13,7 @@
|
|||
:formModel="formModel"
|
||||
:setFormModel="setFormModel"
|
||||
:formActionType="formActionType"
|
||||
:isOpen="isOpen"
|
||||
@close-dropdown="handleCloseDropdown"
|
||||
></SearchItem>
|
||||
</u-dropdown>
|
||||
|
|
@ -92,6 +98,7 @@ export default {
|
|||
},
|
||||
data() {
|
||||
return {
|
||||
isOpen: false,
|
||||
formModel: {},
|
||||
}
|
||||
},
|
||||
|
|
@ -99,6 +106,9 @@ export default {
|
|||
this.initFormModel()
|
||||
},
|
||||
methods: {
|
||||
handleOpen() {
|
||||
console.log('====')
|
||||
},
|
||||
handleCloseDropdown() {
|
||||
this.$refs.dropdownRef?.close()
|
||||
},
|
||||
|
|
@ -155,15 +165,14 @@ export default {
|
|||
if (pattern.test(key)) {
|
||||
const keyArr = key.match(pattern)[1].split(',')
|
||||
keyArr.forEach((item, index) => {
|
||||
const _val = value?.[index] ?? ''
|
||||
if(_val) {
|
||||
const _val = value?.[index] ?? ''
|
||||
if (_val) {
|
||||
res[item.trim()] = _val
|
||||
}
|
||||
})
|
||||
}else {
|
||||
} else {
|
||||
value && (res[key] = value)
|
||||
}
|
||||
|
||||
}
|
||||
return Object.assign({}, res)
|
||||
},
|
||||
|
|
|
|||
|
|
@ -221,6 +221,14 @@
|
|||
"navigationBarTitleText": "城镇数据",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},{
|
||||
"path" : "pages/basics/basics-base",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText": "基地数据",
|
||||
"enablePullDownRefresh": false,
|
||||
"navigationStyle":"custom"
|
||||
}
|
||||
}
|
||||
],
|
||||
"globalStyle": {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,289 @@
|
|||
<template>
|
||||
<view>
|
||||
<Appbar title="基地数据">
|
||||
<template #right>
|
||||
<view class="text-white mr-20px" @click="handleCreate">新增</view>
|
||||
</template>
|
||||
</Appbar>
|
||||
<u-sticky>
|
||||
<view class="bg-white">
|
||||
<SearchForm
|
||||
:schemas="searchFormSchema"
|
||||
@submit="handleSubmit"
|
||||
></SearchForm>
|
||||
</view>
|
||||
</u-sticky>
|
||||
<mescroll-body
|
||||
@init="mescrollInit"
|
||||
@up="upCallback"
|
||||
:up="upOption"
|
||||
:down="downOption"
|
||||
>
|
||||
<view>
|
||||
<u-swipe-action
|
||||
v-for="(item, i) in dataList"
|
||||
:show="item.show"
|
||||
:index="i"
|
||||
:key="item.id"
|
||||
class="my-20rpx mx-30rpx rounded-md overflow-hidden"
|
||||
:options="options"
|
||||
@click="handleClick"
|
||||
@content-click="handleContentClick"
|
||||
>
|
||||
<view>
|
||||
<view class="bg-white p-20rpx">
|
||||
<view>基地名称：{{ item.name }} </view>
|
||||
<view>农业类型：{{ item.industry_label }}</view>
|
||||
<view class="my-12rpx">
|
||||
<u-line></u-line>
|
||||
</view>
|
||||
|
||||
<view class="grid grid-cols-3">
|
||||
<view class="text-center">基地面积</view>
|
||||
<view class="text-center">种养殖面积</view>
|
||||
<view class="text-center">就业人数</view>
|
||||
</view>
|
||||
<view class="grid grid-cols-3">
|
||||
<view class="text-center">{{ item.areas }}</view>
|
||||
<view class="text-center">{{ item.cultivated }}</view>
|
||||
<view class="text-center">{{ item.workforce }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-swipe-action>
|
||||
</view>
|
||||
</mescroll-body>
|
||||
|
||||
<!-- 详情 -->
|
||||
<BaseTablePopup
|
||||
v-model="baseShow"
|
||||
:colums="baseTableColums"
|
||||
:data="currentData"
|
||||
@onEdit="handleEdit"
|
||||
@onDel="handleDel"
|
||||
></BaseTablePopup>
|
||||
<!-- 编辑 -->
|
||||
<cuPopup v-model="formShow" :title="currentData ? '编辑基地' : '新增基地'">
|
||||
<BasicsEdit
|
||||
@cancel="formShow = false"
|
||||
@confirm="handleEditConfirm"
|
||||
:data="currentData"
|
||||
></BasicsEdit>
|
||||
</cuPopup>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import Appbar from '@/components/Appbar'
|
||||
import SearchForm from '@/components/search-form'
|
||||
import { http } from '@/api/index.js'
|
||||
import MescrollMixin from '@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js'
|
||||
import cuPopup from '@/components/cu-popup/index.vue'
|
||||
import BaseTablePopup from '@/components/base-table/popup.vue'
|
||||
import BasicsEdit from './components/basics-edit.vue'
|
||||
const baseTableColums = [
|
||||
{
|
||||
title: '基地名称',
|
||||
dataIndex: 'name',
|
||||
},
|
||||
{
|
||||
title: '农业类型',
|
||||
dataIndex: 'industry_label',
|
||||
},
|
||||
{
|
||||
title: '是否外部链接',
|
||||
dataIndex: 'is_blank',
|
||||
format: (text) => {
|
||||
return text ? '是' : '否'
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '排序',
|
||||
dataIndex: 'sort',
|
||||
},
|
||||
{
|
||||
title: '基地负责人',
|
||||
dataIndex: 'person',
|
||||
},
|
||||
{
|
||||
title: '基地农作物',
|
||||
dataIndex: 'crops',
|
||||
format: (arr) => {
|
||||
return arr?.map((e) => e.name).join(',') ?? ''
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '基地经度',
|
||||
dataIndex: 'address_lng',
|
||||
},
|
||||
{
|
||||
title: '基地纬度',
|
||||
dataIndex: 'address_lat',
|
||||
},
|
||||
{
|
||||
title: '基地地址',
|
||||
dataIndex: 'address',
|
||||
},
|
||||
{
|
||||
title: '基地面积',
|
||||
dataIndex: 'areas',
|
||||
},
|
||||
{
|
||||
title: '种养殖面积',
|
||||
dataIndex: 'cultivated',
|
||||
},
|
||||
{
|
||||
title: '基地就业人数',
|
||||
dataIndex: 'workforce',
|
||||
},
|
||||
{
|
||||
title: '基地描述',
|
||||
dataIndex: 'description',
|
||||
},
|
||||
]
|
||||
export default {
|
||||
mixins: [MescrollMixin],
|
||||
components: {
|
||||
SearchForm,
|
||||
Appbar,
|
||||
cuPopup,
|
||||
BaseTablePopup,
|
||||
BasicsEdit,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
baseTableColums,
|
||||
currentData: null,
|
||||
filterParmas: {},
|
||||
downOption: {
|
||||
use: false,
|
||||
},
|
||||
upOption: {
|
||||
auto: false,
|
||||
page: {
|
||||
size: 20,
|
||||
},
|
||||
},
|
||||
dataList: [],
|
||||
options: [
|
||||
{
|
||||
text: '编辑',
|
||||
opt: 'edit',
|
||||
style: {
|
||||
backgroundColor: '#007aff',
|
||||
},
|
||||
},
|
||||
{
|
||||
text: '删除',
|
||||
opt: 'delete',
|
||||
style: {
|
||||
backgroundColor: '#dd524d',
|
||||
},
|
||||
},
|
||||
],
|
||||
formShow: false,
|
||||
baseShow: false,
|
||||
searchFormSchema: [
|
||||
{
|
||||
field: 'name',
|
||||
label: '名称',
|
||||
component: 'Input',
|
||||
componentProps: {
|
||||
placeholder: '请输入名称',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'type',
|
||||
label: '农业类型',
|
||||
component: 'ApiSelect',
|
||||
componentProps: ({ formActionType }) => {
|
||||
return {
|
||||
api: async (e) => {
|
||||
const { data } = await http.get('/api/keywords-industry', {
|
||||
params: e,
|
||||
})
|
||||
return data.data
|
||||
},
|
||||
labelField: 'name',
|
||||
valueField: 'id',
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleSubmit(e) {
|
||||
this.filterParmas = e
|
||||
this.mescroll.resetUpScroll()
|
||||
},
|
||||
upCallback({ num, size }) {
|
||||
this.getData({
|
||||
...this.filterParmas,
|
||||
page: num,
|
||||
per_page: size,
|
||||
type: 1,
|
||||
})
|
||||
},
|
||||
async getData(e) {
|
||||
try {
|
||||
const { data } = await http.get(`/api/agricultural-basic`, {
|
||||
params: e,
|
||||
})
|
||||
if (e.page == 1) this.dataList = []
|
||||
const { data: list, meta } = data
|
||||
this.dataList = this.dataList.concat(
|
||||
list.map((e) => Object.assign({ show: false }, e))
|
||||
)
|
||||
this.mescroll.endByPage(list.length, meta.total)
|
||||
} catch (error) {
|
||||
this.mescroll.endErr()
|
||||
}
|
||||
},
|
||||
handleClick(index1, index) {
|
||||
const { opt } = this.options[index]
|
||||
const item = this.dataList[index1]
|
||||
this.currentData = item
|
||||
if (opt == 'edit') {
|
||||
this.handleEdit(item)
|
||||
} else if (opt == 'delete') {
|
||||
this.handleDel(item)
|
||||
}
|
||||
},
|
||||
handleContentClick(e) {
|
||||
this.currentData = this.dataList[e]
|
||||
this.baseShow = true
|
||||
},
|
||||
handleEdit(item) {
|
||||
this.currentData = item
|
||||
this.formShow = true
|
||||
this.baseShow = false
|
||||
},
|
||||
async handleDel(item) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '是否确定删除？',
|
||||
success: async (res) => {
|
||||
if (res.confirm) {
|
||||
try {
|
||||
await this.$http.delete(`/api/agricultural-basic/${item.id}`)
|
||||
this.mescroll.resetUpScroll()
|
||||
this.baseShow = false
|
||||
} catch ({ data }) {
|
||||
this.$u.toast(data.message)
|
||||
}
|
||||
}
|
||||
},
|
||||
})
|
||||
},
|
||||
async handleCreate() {
|
||||
this.currentData = null
|
||||
this.formShow = true
|
||||
this.baseShow = false
|
||||
},
|
||||
handleEditConfirm() {
|
||||
this.mescroll.resetUpScroll()
|
||||
this.formShow = false
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,219 @@
|
|||
<template>
|
||||
<view class="p-20rpx h-full overflow-hidden flex flex-col">
|
||||
<view class="flex-1 relative">
|
||||
<view class="absolute top-0 left-0 w-full h-full">
|
||||
<scroll-view scroll-y="true" class="h-full">
|
||||
<u-form ref="uForm" :model="form" class="cu-form" label-width="200">
|
||||
<u-form-item label="ID" v-if="form.id">
|
||||
<u-input disabled v-model="form.id"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="外部链接">
|
||||
<u-switch v-model="form.is_blank"></u-switch>
|
||||
</u-form-item>
|
||||
<u-form-item label="外部链接" v-if="form.is_blank">
|
||||
<u-input v-model="form.blank_url" placeholder="请输入"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="农业类型">
|
||||
<ApiSelect
|
||||
v-model="form.industry_key"
|
||||
v-bind="industrySelectOption"
|
||||
></ApiSelect>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地名称">
|
||||
<u-input v-model="form.name" placeholder="请输入"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="排序">
|
||||
<u-input v-model="form.sort" placeholder="请输入"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地负责人">
|
||||
<u-input v-model="form.person" placeholder="请输入"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地面积">
|
||||
<u-input v-model="form.areas" placeholder="请输入"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="种养殖面积">
|
||||
<u-input v-model="form.cultivated" placeholder="请输入"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地人数">
|
||||
<u-input v-model="form.workforce" placeholder="请输入"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="城镇">
|
||||
<ApiSelect
|
||||
v-model="form.parent_id"
|
||||
v-bind="parentSelectOption"
|
||||
></ApiSelect>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地农作物">
|
||||
<ApiCheckbox
|
||||
v-model="form.crops_ids"
|
||||
v-bind="cropsSelectOption"
|
||||
></ApiCheckbox>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地地址">
|
||||
<u-input v-model="form.address"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地介绍">
|
||||
<u-input type="textarea" v-model="form.description"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地经度">
|
||||
<u-input v-model="form.address_lng"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地纬度">
|
||||
<u-input v-model="form.address_lat"></u-input>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="grid grid-cols-2 gap-x-20rpx">
|
||||
<u-button class="mt-20rpx" round @click="handleCancel"> 取消 </u-button>
|
||||
<u-button class="mt-20rpx" type="primary" round @click="handleSubmit">
|
||||
保存
|
||||
</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import { http } from '@/api/index.js'
|
||||
import ApiSelect from '@/components/search-form/components/ApiSelect1.vue'
|
||||
import ApiCheckbox from '@/components/search-form/components/ApiCheckbox.vue'
|
||||
const industrySelectOption = {
|
||||
api: async (e) => {
|
||||
const { data } = await http.get('/api/keywords-industry', {
|
||||
params: e,
|
||||
})
|
||||
return data.data
|
||||
},
|
||||
labelField: 'name',
|
||||
valueField: 'key',
|
||||
}
|
||||
const parentSelectOption = {
|
||||
api: async (e) => {
|
||||
const { data } = await http.get('/api/agricultural-basic', {
|
||||
params: {
|
||||
type: 2,
|
||||
},
|
||||
})
|
||||
console.log(data)
|
||||
return data.data
|
||||
},
|
||||
labelField: 'name',
|
||||
valueField: 'id',
|
||||
}
|
||||
const cropsSelectOption = {
|
||||
api: async (e) => {
|
||||
const { data } = await http.get('/api/crops', {
|
||||
params: { type: 'all', crop_type: 1 },
|
||||
})
|
||||
console.log(data)
|
||||
return data.data.map((e) => {
|
||||
return {
|
||||
...e,
|
||||
disabled: e.is_end === 0,
|
||||
}
|
||||
})
|
||||
},
|
||||
labelField: 'name',
|
||||
valueField: 'id',
|
||||
}
|
||||
|
||||
export default {
|
||||
props: {
|
||||
data: {
|
||||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
},
|
||||
components: {
|
||||
ApiSelect,
|
||||
ApiCheckbox,
|
||||
},
|
||||
computed: {
|
||||
isEdit() {
|
||||
return !!this.data
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
industrySelectOption,
|
||||
parentSelectOption,
|
||||
cropsSelectOption,
|
||||
form: {
|
||||
id: '',
|
||||
is_blank: false,
|
||||
blank_url: '',
|
||||
industry_key: '',
|
||||
name: '',
|
||||
sort: 0,
|
||||
person: '',
|
||||
areas: '',
|
||||
cultivated: '',
|
||||
workforce: '',
|
||||
parent_id: '',
|
||||
crops_ids: [],
|
||||
address: '',
|
||||
description: '',
|
||||
address_lng: '',
|
||||
address_lat: '',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleCancel() {
|
||||
this.$emit('cancel')
|
||||
},
|
||||
async handleSubmit() {
|
||||
const params = { ...this.form, type: 1 }
|
||||
|
||||
if (this.isEdit) {
|
||||
this.onUpdate(params)
|
||||
} else {
|
||||
this.onCreate(params)
|
||||
}
|
||||
this.$emit('confirm')
|
||||
},
|
||||
|
||||
async onUpdate(params) {
|
||||
try {
|
||||
await this.$http.put(`/api/agricultural-basic/${params.id}`, params)
|
||||
this.$u.toast('操作成功')
|
||||
} catch ({ data }) {
|
||||
data && this.$u.toast(data?.message)
|
||||
}
|
||||
},
|
||||
|
||||
async onCreate(params) {
|
||||
try {
|
||||
await this.$http.post('/api/agricultural-basic', params)
|
||||
this.$u.toast('操作成功')
|
||||
} catch ({ data }) {
|
||||
data && this.$u.toast(data?.message)
|
||||
}
|
||||
},
|
||||
|
||||
setDefaultForm(data) {
|
||||
Object.keys(data).forEach((key) => {
|
||||
const value = data[key]
|
||||
if (key == 'blank_url') {
|
||||
this.form.is_blank = data[key] ? true : false
|
||||
} else if (key == 'crops') {
|
||||
this.form.crops_ids = value.map((e) => e.id)
|
||||
}
|
||||
if (this.form[key] !== undefined) this.form[key] = value
|
||||
})
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
data: {
|
||||
handler(val) {
|
||||
console.log(val)
|
||||
if (val) {
|
||||
this.setDefaultForm(val)
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
deep: true,
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
@ -1,69 +1,85 @@
|
|||
<template>
|
||||
<view class="p-20rpx h-full overflow-hidden flex flex-col">
|
||||
<view class="overflow-y-auto">
|
||||
<u-form ref="uForm" class="cu-form" label-width="200">
|
||||
<u-form-item v-for="(item, i) in template" :key="i" :label="item.name">
|
||||
<template v-if="!item.isMore">
|
||||
<view class="flex items-center flex-1">
|
||||
<template v-if="item.component == 'InputTextArea'">
|
||||
<u-input
|
||||
border
|
||||
class="flex-1"
|
||||
type="textarea"
|
||||
v-model="item.value"
|
||||
:suffix="item.unit"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
<view class="flex-1 relative">
|
||||
<view class="absolute top-0 left-0 w-full h-full">
|
||||
<scroll-view scroll-y="true" class="h-full">
|
||||
<u-form ref="uForm" class="cu-form" label-width="200">
|
||||
<u-form-item
|
||||
v-for="(item, i) in template"
|
||||
:key="i"
|
||||
:label="item.name"
|
||||
>
|
||||
<template v-if="!item.isMore">
|
||||
<view class="flex items-center flex-1">
|
||||
<template v-if="item.component == 'InputTextArea'">
|
||||
<u-input
|
||||
border
|
||||
class="flex-1"
|
||||
type="textarea"
|
||||
v-model="item.value"
|
||||
:suffix="item.unit"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</template>
|
||||
<template v-else>
|
||||
<u-input
|
||||
border
|
||||
:disabled="item.readonly"
|
||||
class="w-full"
|
||||
v-model="item.value"
|
||||
:suffix="item.unit"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</template>
|
||||
</view>
|
||||
</template>
|
||||
<template v-else>
|
||||
<u-input
|
||||
border
|
||||
:disabled="item.readonly"
|
||||
class="w-full"
|
||||
v-model="item.value"
|
||||
:suffix="item.unit"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
<view class="w-full">
|
||||
<view
|
||||
class="w-full flex my-10rpx"
|
||||
v-for="(arr, j) in item.value"
|
||||
:key="j"
|
||||
>
|
||||
<view class="w-140rpx mr-20rpx">
|
||||
<u-input
|
||||
type="number"
|
||||
:clearable="false"
|
||||
border
|
||||
v-model="arr.year"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</view>
|
||||
<view class="flex-1 flex items-center">
|
||||
<u-input
|
||||
type="number"
|
||||
:clearable="false"
|
||||
border
|
||||
v-model="arr.value"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
<!-- <view class="opacity-50 ml-10rpx">{{ item.unit }}</view> -->
|
||||
</view>
|
||||
<view
|
||||
@click="addDomain(item)"
|
||||
v-if="j == 0"
|
||||
class="px-10rpx"
|
||||
>
|
||||
<u-icon name="plus" size="34"></u-icon>
|
||||
</view>
|
||||
<view
|
||||
@click="removeDomain(item, j)"
|
||||
class="px-10rpx"
|
||||
v-else
|
||||
>
|
||||
<u-icon name="minus" size="34"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</view>
|
||||
</template>
|
||||
<template v-else>
|
||||
<view class="w-full">
|
||||
<view
|
||||
class="w-full flex my-10rpx"
|
||||
v-for="(arr, j) in item.value"
|
||||
:key="j"
|
||||
>
|
||||
<view class="w-140rpx mr-20rpx">
|
||||
<u-input
|
||||
type="number"
|
||||
:clearable="false"
|
||||
border
|
||||
v-model="arr.year"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</view>
|
||||
<view class="flex-1 flex items-center">
|
||||
<u-input
|
||||
type="number"
|
||||
:clearable="false"
|
||||
border
|
||||
v-model="arr.value"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
<!-- <view class="opacity-50 ml-10rpx">{{ item.unit }}</view> -->
|
||||
</view>
|
||||
<view @click="addDomain(item)" v-if="j == 0" class="px-10rpx">
|
||||
<u-icon name="plus" size="34"></u-icon>
|
||||
</view>
|
||||
<view @click="removeDomain(item, j)" class="px-10rpx" v-else>
|
||||
<u-icon name="minus" size="34"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="grid grid-cols-2 gap-x-20rpx">
|
||||
<u-button class="mt-20rpx" round @click="handleCancel"> 取消 </u-button>
|
||||
|
|
|
|||
|
|
@ -1,56 +1,74 @@
|
|||
<template>
|
||||
<view class="p-20rpx h-full overflow-hidden flex flex-col">
|
||||
<view class="overflow-y-auto">
|
||||
<u-form ref="uForm" class="cu-form" label-width="200">
|
||||
<u-form-item v-for="(item, i) in template" :key="i" :label="item.name">
|
||||
<template v-if="!item.isMore">
|
||||
<view class="flex items-center">
|
||||
<u-input
|
||||
border
|
||||
v-model="item.value"
|
||||
:suffix="item.unit"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
<view class="w-120rpx opacity-50 ml-10rpx">{{ item.unit }}</view>
|
||||
</view>
|
||||
</template>
|
||||
<template v-else>
|
||||
<view class="w-full">
|
||||
<view
|
||||
class="w-full flex my-10rpx"
|
||||
v-for="(arr, j) in item.value"
|
||||
:key="j"
|
||||
>
|
||||
<view class="w-140rpx mr-20rpx">
|
||||
<view class="flex-1 relative">
|
||||
<view class="absolute top-0 left-0 w-full h-full">
|
||||
<scroll-view scroll-y="true" class="h-full">
|
||||
<u-form ref="uForm" class="cu-form" label-width="200">
|
||||
<u-form-item
|
||||
v-for="(item, i) in template"
|
||||
:key="i"
|
||||
:label="item.name"
|
||||
>
|
||||
<template v-if="!item.isMore">
|
||||
<view class="flex items-center">
|
||||
<u-input
|
||||
type="number"
|
||||
:clearable="false"
|
||||
border
|
||||
v-model="arr.year"
|
||||
v-model="item.value"
|
||||
:suffix="item.unit"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
<view class="w-120rpx opacity-50 ml-10rpx">{{
|
||||
item.unit
|
||||
}}</view>
|
||||
</view>
|
||||
<view class="flex-1 flex items-center">
|
||||
<u-input
|
||||
type="number"
|
||||
:clearable="false"
|
||||
border
|
||||
v-model="arr.value"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
<!-- <view class="opacity-50 ml-10rpx">{{ item.unit }}</view> -->
|
||||
</template>
|
||||
<template v-else>
|
||||
<view class="w-full">
|
||||
<view
|
||||
class="w-full flex my-10rpx"
|
||||
v-for="(arr, j) in item.value"
|
||||
:key="j"
|
||||
>
|
||||
<view class="w-140rpx mr-20rpx">
|
||||
<u-input
|
||||
type="number"
|
||||
:clearable="false"
|
||||
border
|
||||
v-model="arr.year"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
</view>
|
||||
<view class="flex-1 flex items-center">
|
||||
<u-input
|
||||
type="number"
|
||||
:clearable="false"
|
||||
border
|
||||
v-model="arr.value"
|
||||
placeholder="请输入"
|
||||
/>
|
||||
<!-- <view class="opacity-50 ml-10rpx">{{ item.unit }}</view> -->
|
||||
</view>
|
||||
<view
|
||||
@click="addDomain(item)"
|
||||
v-if="j == 0"
|
||||
class="px-10rpx"
|
||||
>
|
||||
<u-icon name="plus" size="34"></u-icon>
|
||||
</view>
|
||||
<view
|
||||
@click="removeDomain(item, j)"
|
||||
class="px-10rpx"
|
||||
v-else
|
||||
>
|
||||
<u-icon name="minus" size="34"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view @click="addDomain(item)" v-if="j == 0" class="px-10rpx">
|
||||
<u-icon name="plus" size="34"></u-icon>
|
||||
</view>
|
||||
<view @click="removeDomain(item, j)" class="px-10rpx" v-else>
|
||||
<u-icon name="minus" size="34"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
</template>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="grid grid-cols-2 gap-x-20rpx">
|
||||
<u-button class="mt-20rpx" round @click="handleCancel"> 取消 </u-button>
|
||||
|
|
|
|||
|
|
@ -196,7 +196,6 @@ export default {
|
|||
handleClick(index1, index) {
|
||||
this.currentData = this.dataList[index1]
|
||||
this.cityItemShow = true
|
||||
console.log(index1, index)
|
||||
},
|
||||
|
||||
handleContentClick(e) {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,219 @@
|
|||
<template>
|
||||
<view class="p-20rpx h-full overflow-hidden flex flex-col">
|
||||
<view class="flex-1 relative">
|
||||
<view class="absolute top-0 left-0 w-full h-full">
|
||||
<scroll-view scroll-y="true" class="h-full">
|
||||
<u-form ref="uForm" :model="form" class="cu-form" label-width="200">
|
||||
<u-form-item label="ID" v-if="form.id">
|
||||
<u-input disabled v-model="form.id"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="外部链接">
|
||||
<u-switch v-model="form.is_blank"></u-switch>
|
||||
</u-form-item>
|
||||
<u-form-item label="外部链接" v-if="form.is_blank">
|
||||
<u-input v-model="form.blank_url" placeholder="请输入"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="农业类型">
|
||||
<ApiSelect
|
||||
v-model="form.industry_key"
|
||||
v-bind="industrySelectOption"
|
||||
></ApiSelect>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地名称">
|
||||
<u-input v-model="form.name" placeholder="请输入"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="排序">
|
||||
<u-input v-model="form.sort" placeholder="请输入"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地负责人">
|
||||
<u-input v-model="form.person" placeholder="请输入"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地面积">
|
||||
<u-input v-model="form.areas" placeholder="请输入"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="种养殖面积">
|
||||
<u-input v-model="form.cultivated" placeholder="请输入"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地人数">
|
||||
<u-input v-model="form.workforce" placeholder="请输入"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="城镇">
|
||||
<ApiSelect
|
||||
v-model="form.parent_id"
|
||||
v-bind="parentSelectOption"
|
||||
></ApiSelect>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地农作物">
|
||||
<ApiCheckbox
|
||||
v-model="form.crops_ids"
|
||||
v-bind="cropsSelectOption"
|
||||
></ApiCheckbox>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地地址">
|
||||
<u-input v-model="form.address"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地介绍">
|
||||
<u-input type="textarea" v-model="form.description"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地经度">
|
||||
<u-input v-model="form.address_lng"></u-input>
|
||||
</u-form-item>
|
||||
<u-form-item label="基地纬度">
|
||||
<u-input v-model="form.address_lat"></u-input>
|
||||
</u-form-item>
|
||||
</u-form>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="grid grid-cols-2 gap-x-20rpx">
|
||||
<u-button class="mt-20rpx" round @click="handleCancel"> 取消 </u-button>
|
||||
<u-button class="mt-20rpx" type="primary" round @click="handleSubmit">
|
||||
保存
|
||||
</u-button>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import { http } from '@/api/index.js'
|
||||
import ApiSelect from '@/components/search-form/components/ApiSelect1.vue'
|
||||
import ApiCheckbox from '@/components/search-form/components/ApiCheckbox.vue'
|
||||
const industrySelectOption = {
|
||||
api: async (e) => {
|
||||
const { data } = await http.get('/api/keywords-industry', {
|
||||
params: e,
|
||||
})
|
||||
return data.data
|
||||
},
|
||||
labelField: 'name',
|
||||
valueField: 'key',
|
||||
}
|
||||
const parentSelectOption = {
|
||||
api: async (e) => {
|
||||
const { data } = await http.get('/api/agricultural-basic', {
|
||||
params: {
|
||||
type: 2,
|
||||
},
|
||||
})
|
||||
console.log(data)
|
||||
return data.data
|
||||
},
|
||||
labelField: 'name',
|
||||
valueField: 'id',
|
||||
}
|
||||
const cropsSelectOption = {
|
||||
api: async (e) => {
|
||||
const { data } = await http.get('/api/crops', {
|
||||
params: { type: 'all', crop_type: 1 },
|
||||
})
|
||||
console.log(data)
|
||||
return data.data.map((e) => {
|
||||
return {
|
||||
...e,
|
||||
disabled: e.is_end === 0,
|
||||
}
|
||||
})
|
||||
},
|
||||
labelField: 'name',
|
||||
valueField: 'id',
|
||||
}
|
||||
|
||||
export default {
|
||||
props: {
|
||||
data: {
|
||||
type: Object,
|
||||
default: () => {},
|
||||
},
|
||||
},
|
||||
components: {
|
||||
ApiSelect,
|
||||
ApiCheckbox,
|
||||
},
|
||||
computed: {
|
||||
isEdit() {
|
||||
return !!this.data
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
industrySelectOption,
|
||||
parentSelectOption,
|
||||
cropsSelectOption,
|
||||
form: {
|
||||
id: '',
|
||||
is_blank: false,
|
||||
blank_url: '',
|
||||
industry_key: '',
|
||||
name: '',
|
||||
sort: 0,
|
||||
person: '',
|
||||
areas: '',
|
||||
cultivated: '',
|
||||
workforce: '',
|
||||
parent_id: '',
|
||||
crops_ids: [],
|
||||
address: '',
|
||||
description: '',
|
||||
address_lng: '',
|
||||
address_lat: '',
|
||||
},
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleCancel() {
|
||||
this.$emit('cancel')
|
||||
},
|
||||
async handleSubmit() {
|
||||
const params = { ...this.form, type: 1 }
|
||||
|
||||
if (this.isEdit) {
|
||||
this.onUpdate(params)
|
||||
} else {
|
||||
this.onCreate(params)
|
||||
}
|
||||
this.$emit('confirm')
|
||||
},
|
||||
|
||||
async onUpdate(params) {
|
||||
try {
|
||||
await this.$http.put(`/api/agricultural-basic/${params.id}`, params)
|
||||
this.$u.toast('操作成功')
|
||||
} catch ({ data }) {
|
||||
data && this.$u.toast(data?.message)
|
||||
}
|
||||
},
|
||||
|
||||
async onCreate(params) {
|
||||
try {
|
||||
await this.$http.post('/api/agricultural-basic', params)
|
||||
this.$u.toast('操作成功')
|
||||
} catch ({ data }) {
|
||||
data && this.$u.toast(data?.message)
|
||||
}
|
||||
},
|
||||
|
||||
setDefaultForm(data) {
|
||||
Object.keys(data).forEach((key) => {
|
||||
const value = data[key]
|
||||
if (key == 'blank_url') {
|
||||
this.form.is_blank = data[key] ? true : false
|
||||
} else if (key == 'crops') {
|
||||
this.form.crops_ids = value.map((e) => e.id)
|
||||
}
|
||||
if (this.form[key] !== undefined) this.form[key] = value
|
||||
})
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
data: {
|
||||
handler(val) {
|
||||
console.log(val)
|
||||
if (val) {
|
||||
this.setDefaultForm(val)
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
deep: true,
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
@ -0,0 +1,289 @@
|
|||
<template>
|
||||
<view>
|
||||
<Appbar title="基地数据">
|
||||
<template #right>
|
||||
<view class="text-white mr-20px" @click="handleCreate">新增</view>
|
||||
</template>
|
||||
</Appbar>
|
||||
<u-sticky>
|
||||
<view class="bg-white">
|
||||
<SearchForm
|
||||
:schemas="searchFormSchema"
|
||||
@submit="handleSubmit"
|
||||
></SearchForm>
|
||||
</view>
|
||||
</u-sticky>
|
||||
<mescroll-body
|
||||
@init="mescrollInit"
|
||||
@up="upCallback"
|
||||
:up="upOption"
|
||||
:down="downOption"
|
||||
>
|
||||
<view>
|
||||
<u-swipe-action
|
||||
v-for="(item, i) in dataList"
|
||||
:show="item.show"
|
||||
:index="i"
|
||||
:key="item.id"
|
||||
class="my-20rpx mx-30rpx rounded-md overflow-hidden"
|
||||
:options="options"
|
||||
@click="handleClick"
|
||||
@content-click="handleContentClick"
|
||||
>
|
||||
<view>
|
||||
<view class="bg-white p-20rpx">
|
||||
<view>基地名称：{{ item.name }} </view>
|
||||
<view>农业类型：{{ item.industry_label }}</view>
|
||||
<view class="my-12rpx">
|
||||
<u-line></u-line>
|
||||
</view>
|
||||
|
||||
<view class="grid grid-cols-3">
|
||||
<view class="text-center">基地面积</view>
|
||||
<view class="text-center">种养殖面积</view>
|
||||
<view class="text-center">就业人数</view>
|
||||
</view>
|
||||
<view class="grid grid-cols-3">
|
||||
<view class="text-center">{{ item.areas }}</view>
|
||||
<view class="text-center">{{ item.cultivated }}</view>
|
||||
<view class="text-center">{{ item.workforce }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-swipe-action>
|
||||
</view>
|
||||
</mescroll-body>
|
||||
|
||||
<!-- 详情 -->
|
||||
<BaseTablePopup
|
||||
v-model="baseShow"
|
||||
:colums="baseTableColums"
|
||||
:data="currentData"
|
||||
@onEdit="handleEdit"
|
||||
@onDel="handleDel"
|
||||
></BaseTablePopup>
|
||||
<!-- 编辑 -->
|
||||
<cuPopup v-model="formShow" :title="currentData ? '编辑基地' : '新增基地'">
|
||||
<BasicsEdit
|
||||
@cancel="formShow = false"
|
||||
@confirm="handleEditConfirm"
|
||||
:data="currentData"
|
||||
></BasicsEdit>
|
||||
</cuPopup>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import Appbar from '@/components/Appbar'
|
||||
import SearchForm from '@/components/search-form'
|
||||
import { http } from '@/api/index.js'
|
||||
import MescrollMixin from '@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js'
|
||||
import cuPopup from '@/components/cu-popup/index.vue'
|
||||
import BaseTablePopup from '@/components/base-table/popup.vue'
|
||||
import BasicsEdit from './components/basics-edit.vue'
|
||||
const baseTableColums = [
|
||||
{
|
||||
title: '基地名称',
|
||||
dataIndex: 'name',
|
||||
},
|
||||
{
|
||||
title: '农业类型',
|
||||
dataIndex: 'industry_label',
|
||||
},
|
||||
{
|
||||
title: '是否外部链接',
|
||||
dataIndex: 'is_blank',
|
||||
format: (text) => {
|
||||
return text ? '是' : '否'
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '排序',
|
||||
dataIndex: 'sort',
|
||||
},
|
||||
{
|
||||
title: '基地负责人',
|
||||
dataIndex: 'person',
|
||||
},
|
||||
{
|
||||
title: '基地农作物',
|
||||
dataIndex: 'crops',
|
||||
format: (arr) => {
|
||||
return arr?.map((e) => e.name).join(',') ?? ''
|
||||
},
|
||||
},
|
||||
{
|
||||
title: '基地经度',
|
||||
dataIndex: 'address_lng',
|
||||
},
|
||||
{
|
||||
title: '基地纬度',
|
||||
dataIndex: 'address_lat',
|
||||
},
|
||||
{
|
||||
title: '基地地址',
|
||||
dataIndex: 'address',
|
||||
},
|
||||
{
|
||||
title: '基地面积',
|
||||
dataIndex: 'areas',
|
||||
},
|
||||
{
|
||||
title: '种养殖面积',
|
||||
dataIndex: 'cultivated',
|
||||
},
|
||||
{
|
||||
title: '基地就业人数',
|
||||
dataIndex: 'workforce',
|
||||
},
|
||||
{
|
||||
title: '基地描述',
|
||||
dataIndex: 'description',
|
||||
},
|
||||
]
|
||||
export default {
|
||||
mixins: [MescrollMixin],
|
||||
components: {
|
||||
SearchForm,
|
||||
Appbar,
|
||||
cuPopup,
|
||||
BaseTablePopup,
|
||||
BasicsEdit,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
baseTableColums,
|
||||
currentData: null,
|
||||
filterParmas: {},
|
||||
downOption: {
|
||||
use: false,
|
||||
},
|
||||
upOption: {
|
||||
auto: false,
|
||||
page: {
|
||||
size: 20,
|
||||
},
|
||||
},
|
||||
dataList: [],
|
||||
options: [
|
||||
{
|
||||
text: '编辑',
|
||||
opt: 'edit',
|
||||
style: {
|
||||
backgroundColor: '#007aff',
|
||||
},
|
||||
},
|
||||
{
|
||||
text: '删除',
|
||||
opt: 'delete',
|
||||
style: {
|
||||
backgroundColor: '#dd524d',
|
||||
},
|
||||
},
|
||||
],
|
||||
formShow: false,
|
||||
baseShow: false,
|
||||
searchFormSchema: [
|
||||
{
|
||||
field: 'name',
|
||||
label: '名称',
|
||||
component: 'Input',
|
||||
componentProps: {
|
||||
placeholder: '请输入名称',
|
||||
},
|
||||
},
|
||||
{
|
||||
field: 'type',
|
||||
label: '农业类型',
|
||||
component: 'ApiSelect',
|
||||
componentProps: ({ formActionType }) => {
|
||||
return {
|
||||
api: async (e) => {
|
||||
const { data } = await http.get('/api/keywords-industry', {
|
||||
params: e,
|
||||
})
|
||||
return data.data
|
||||
},
|
||||
labelField: 'name',
|
||||
valueField: 'id',
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleSubmit(e) {
|
||||
this.filterParmas = e
|
||||
this.mescroll.resetUpScroll()
|
||||
},
|
||||
upCallback({ num, size }) {
|
||||
this.getData({
|
||||
...this.filterParmas,
|
||||
page: num,
|
||||
per_page: size,
|
||||
type: 1,
|
||||
})
|
||||
},
|
||||
async getData(e) {
|
||||
try {
|
||||
const { data } = await http.get(`/api/agricultural-basic`, {
|
||||
params: e,
|
||||
})
|
||||
if (e.page == 1) this.dataList = []
|
||||
const { data: list, meta } = data
|
||||
this.dataList = this.dataList.concat(
|
||||
list.map((e) => Object.assign({ show: false }, e))
|
||||
)
|
||||
this.mescroll.endByPage(list.length, meta.total)
|
||||
} catch (error) {
|
||||
this.mescroll.endErr()
|
||||
}
|
||||
},
|
||||
handleClick(index1, index) {
|
||||
const { opt } = this.options[index]
|
||||
const item = this.dataList[index1]
|
||||
this.currentData = item
|
||||
if (opt == 'edit') {
|
||||
this.handleEdit(item)
|
||||
} else if (opt == 'delete') {
|
||||
this.handleDel(item)
|
||||
}
|
||||
},
|
||||
handleContentClick(e) {
|
||||
this.currentData = this.dataList[e]
|
||||
this.baseShow = true
|
||||
},
|
||||
handleEdit(item) {
|
||||
this.currentData = item
|
||||
this.formShow = true
|
||||
this.baseShow = false
|
||||
},
|
||||
async handleDel(item) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '是否确定删除？',
|
||||
success: async (res) => {
|
||||
if (res.confirm) {
|
||||
try {
|
||||
await this.$http.delete(`/api/agricultural-basic/${item.id}`)
|
||||
this.mescroll.resetUpScroll()
|
||||
this.baseShow = false
|
||||
} catch ({ data }) {
|
||||
this.$u.toast(data.message)
|
||||
}
|
||||
}
|
||||
},
|
||||
})
|
||||
},
|
||||
async handleCreate() {
|
||||
this.currentData = null
|
||||
this.formShow = true
|
||||
this.baseShow = false
|
||||
},
|
||||
handleEditConfirm() {
|
||||
this.mescroll.resetUpScroll()
|
||||
this.formShow = false
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
|
@ -1,214 +1,221 @@
|
|||
<template>
|
||||
<view class="index-page bg-page">
|
||||
<view class="banner-section">
|
||||
<image class="banner_img" mode="scaleToFill" src="../../static/img/banner_img.png"></image>
|
||||
</view>
|
||||
<view class="content-box">
|
||||
<view class="menus-section" v-for="(menu,index) in menuList" :key="index">
|
||||
<view class="title-t" v-if="menu.parent">{{menu.parent}}-{{menu.label}}</view>
|
||||
<view class="title-t" v-else>{{menu.label}}</view>
|
||||
<view class="menu-ul">
|
||||
<view class="menu-li" v-for="(cdm,i) in menu.children" :key="i">
|
||||
<view class="menu_item" @click="linknavFn(cdm)">
|
||||
<view class="icon"></view>
|
||||
<view class="name">{{cdm.label}}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="index-page bg-page">
|
||||
<view class="banner-section">
|
||||
<image
|
||||
class="banner_img"
|
||||
mode="scaleToFill"
|
||||
src="../../static/img/banner_img.png"
|
||||
></image>
|
||||
</view>
|
||||
<view class="content-box">
|
||||
<view
|
||||
class="menus-section"
|
||||
v-for="(menu, index) in menuList"
|
||||
:key="index"
|
||||
>
|
||||
<view class="title-t" v-if="menu.parent"
|
||||
>{{ menu.parent }}-{{ menu.label }}</view
|
||||
>
|
||||
<view class="title-t" v-else>{{ menu.label }}</view>
|
||||
<view class="menu-ul">
|
||||
<view class="menu-li" v-for="(cdm, i) in menu.children" :key="i">
|
||||
<view class="menu_item" @click="linknavFn(cdm)">
|
||||
<view class="icon"></view>
|
||||
<view class="name">{{ cdm.label }}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
title: 'Hello',
|
||||
menuList:[
|
||||
{
|
||||
label:'监测数据管理',
|
||||
children:[
|
||||
{
|
||||
label:'气象监测',
|
||||
url:"/pages/index/meteorological"
|
||||
},
|
||||
{
|
||||
label:'智能监控',
|
||||
url:'/pages/index/monitor'
|
||||
},
|
||||
{
|
||||
label:'土壤监控',
|
||||
url:'/pages/index/soil-monitoring'
|
||||
},
|
||||
{
|
||||
label:'水质监控',
|
||||
url:'/pages/index/water-quality'
|
||||
},
|
||||
{
|
||||
label:'昆虫性诱监测',
|
||||
url:'/pages/index/insect-monitors'
|
||||
},
|
||||
{
|
||||
label:'虫情监测',
|
||||
url:'/pages/index/pests'
|
||||
},
|
||||
{
|
||||
label:'杀虫灯检测',
|
||||
url:'/pages/index/insecticidal-lamp'
|
||||
},
|
||||
],
|
||||
},
|
||||
// {
|
||||
// label:'基础数据管理',
|
||||
// children:[
|
||||
// {
|
||||
// label:'城镇数据',
|
||||
// },
|
||||
// {
|
||||
// label:'基地数据',
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
{
|
||||
label:'全市基础数据',
|
||||
parent:'基础数据管理',
|
||||
children:[
|
||||
{
|
||||
label:'城镇数据',
|
||||
url:'/pages/basics/town-base'
|
||||
},
|
||||
{
|
||||
label:'基地数据',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label:'农作物数据',
|
||||
parent:'基础数据管理',
|
||||
children:[
|
||||
{
|
||||
label:'城镇农作物',
|
||||
},
|
||||
{
|
||||
label:'基地农作物',
|
||||
}
|
||||
],
|
||||
},
|
||||
{
|
||||
label:'农作物产量',
|
||||
parent:'基础数据管理',
|
||||
children:[
|
||||
{
|
||||
label:'城镇产量',
|
||||
},
|
||||
{
|
||||
label:'基地产量',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label:'重点产业',
|
||||
parent:'基础数据管理',
|
||||
children:[
|
||||
{
|
||||
label:'稻虾价格',
|
||||
url:'/pages/estate/estate-price'
|
||||
},
|
||||
{
|
||||
label:'稻虾每周价格',
|
||||
url:'/pages/estate/estate-week-price'
|
||||
},
|
||||
{
|
||||
label:'稻虾产业',
|
||||
url:'/pages/estate/estate-industry'
|
||||
},
|
||||
{
|
||||
label:'稻虾流向',
|
||||
url:'/pages/estate/estate-flows'
|
||||
},
|
||||
{
|
||||
label:'大宗物资',
|
||||
url:'/pages/estate/estate-materiels'
|
||||
},
|
||||
]
|
||||
},
|
||||
{
|
||||
label:'设备管理',
|
||||
children:[
|
||||
{
|
||||
label:'设备管理',
|
||||
url:'/pages/device/index'
|
||||
},
|
||||
{
|
||||
label:'警报明细',
|
||||
url:'/pages/device/warning'
|
||||
}
|
||||
],
|
||||
},
|
||||
]
|
||||
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
linknavFn(item){
|
||||
console.log(item)
|
||||
uni.navigateTo({
|
||||
url:`${item.url}`
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
title: 'Hello',
|
||||
menuList: [
|
||||
{
|
||||
label: '监测数据管理',
|
||||
children: [
|
||||
{
|
||||
label: '气象监测',
|
||||
url: '/pages/index/meteorological',
|
||||
},
|
||||
{
|
||||
label: '智能监控',
|
||||
url: '/pages/index/monitor',
|
||||
},
|
||||
{
|
||||
label: '土壤监控',
|
||||
url: '/pages/index/soil-monitoring',
|
||||
},
|
||||
{
|
||||
label: '水质监控',
|
||||
url: '/pages/index/water-quality',
|
||||
},
|
||||
{
|
||||
label: '昆虫性诱监测',
|
||||
url: '/pages/index/insect-monitors',
|
||||
},
|
||||
{
|
||||
label: '虫情监测',
|
||||
url: '/pages/index/pests',
|
||||
},
|
||||
{
|
||||
label: '杀虫灯检测',
|
||||
url: '/pages/index/insecticidal-lamp',
|
||||
},
|
||||
],
|
||||
},
|
||||
// {
|
||||
// label:'基础数据管理',
|
||||
// children:[
|
||||
// {
|
||||
// label:'城镇数据',
|
||||
// },
|
||||
// {
|
||||
// label:'基地数据',
|
||||
// },
|
||||
// ],
|
||||
// },
|
||||
{
|
||||
label: '全市基础数据',
|
||||
parent: '基础数据管理',
|
||||
children: [
|
||||
{
|
||||
label: '城镇数据',
|
||||
url: '/pages/basics/town-base',
|
||||
},
|
||||
{
|
||||
label: '基地数据',
|
||||
url: '/pages/basics/basics-base',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '农作物数据',
|
||||
parent: '基础数据管理',
|
||||
children: [
|
||||
{
|
||||
label: '城镇农作物',
|
||||
},
|
||||
{
|
||||
label: '基地农作物',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '农作物产量',
|
||||
parent: '基础数据管理',
|
||||
children: [
|
||||
{
|
||||
label: '城镇产量',
|
||||
},
|
||||
{
|
||||
label: '基地产量',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '重点产业',
|
||||
parent: '基础数据管理',
|
||||
children: [
|
||||
{
|
||||
label: '稻虾价格',
|
||||
url: '/pages/estate/estate-price',
|
||||
},
|
||||
{
|
||||
label: '稻虾每周价格',
|
||||
url: '/pages/estate/estate-week-price',
|
||||
},
|
||||
{
|
||||
label: '稻虾产业',
|
||||
url: '/pages/estate/estate-industry',
|
||||
},
|
||||
{
|
||||
label: '稻虾流向',
|
||||
url: '/pages/estate/estate-flows',
|
||||
},
|
||||
{
|
||||
label: '大宗物资',
|
||||
url: '/pages/estate/estate-materiels',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
label: '设备管理',
|
||||
children: [
|
||||
{
|
||||
label: '设备管理',
|
||||
url: '/pages/device/index',
|
||||
},
|
||||
{
|
||||
label: '警报明细',
|
||||
url: '/pages/device/warning',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
}
|
||||
},
|
||||
onLoad() {},
|
||||
methods: {
|
||||
linknavFn(item) {
|
||||
console.log(item)
|
||||
uni.navigateTo({
|
||||
url: `${item.url}`,
|
||||
})
|
||||
},
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.banner-section{
|
||||
.banner_img{
|
||||
width: 100%;
|
||||
height: 280rpx;
|
||||
}
|
||||
.banner-section {
|
||||
.banner_img {
|
||||
width: 100%;
|
||||
height: 280rpx;
|
||||
}
|
||||
}
|
||||
.index-page{
|
||||
background-color: #f8f8f8;
|
||||
.content-box{
|
||||
padding-top: 30rpx;
|
||||
padding-bottom: 150rpx;
|
||||
}
|
||||
.index-page {
|
||||
background-color: #f8f8f8;
|
||||
.content-box {
|
||||
padding-top: 30rpx;
|
||||
padding-bottom: 150rpx;
|
||||
}
|
||||
}
|
||||
.menus-section{
|
||||
padding: 20rpx;
|
||||
font-size: 28rpx;
|
||||
margin-top: -18rpx;
|
||||
.title-t{
|
||||
margin-bottom: 24rpx;
|
||||
padding: 0 10rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
.menus-section {
|
||||
padding: 20rpx;
|
||||
font-size: 28rpx;
|
||||
margin-top: -18rpx;
|
||||
.title-t {
|
||||
margin-bottom: 24rpx;
|
||||
padding: 0 10rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.menu-ul{
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
.menu-li{
|
||||
flex: 0 0 25%;
|
||||
text-align: center;
|
||||
padding: 0 10rpx;
|
||||
margin-bottom: 18rpx;
|
||||
.menu_item{
|
||||
background-color: #fff;
|
||||
box-shadow:0 0 20rpx rgba(0,0,0,0.15);
|
||||
min-height: 90rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 10rpx 15rpx;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
.menu-ul {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
.menu-li {
|
||||
flex: 0 0 25%;
|
||||
text-align: center;
|
||||
padding: 0 10rpx;
|
||||
margin-bottom: 18rpx;
|
||||
.menu_item {
|
||||
background-color: #fff;
|
||||
box-shadow: 0 0 20rpx rgba(0, 0, 0, 0.15);
|
||||
min-height: 90rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 10rpx 15rpx;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Reference in New Issue