fix:页面修改为VUE3模式。

This commit is contained in:
tianyongbao
2024-06-05 13:48:37 +08:00
parent 1b91ca7ebd
commit 568125d792
5 changed files with 193 additions and 195 deletions

View File

@@ -1,12 +1,10 @@
<template>
<u-cell :border="false">
<view slot="title" class="title">
{{ title }}
</view>
<view slot="value" class="value" :style="valueStyle">
{{ value }}
</view>
</u-cell>
</template>
<script>

View File

@@ -99,7 +99,7 @@
{
"path": "pages/work/heartJourney/addEdit",
"style": {
"navigationBarTitleText": "心路历程添加修改"
"navigationBarTitleText": "心路历程"
}
}
],

View File

@@ -1,8 +1,13 @@
<template>
<view class="container" style="paddingBottom:1rpx;">
<uni-navbar title="心路历程"></uni-navbar>
<u-navbar
leftIconSize="40rpx"
leftIconColor="#333333"
title="心路历程"
>
</u-navbar>
<view class="section">
<view class="section-title">心路历程</view>
<view class="section-title">{{ title}}</view>
<view class="form-view">
<u--form labelPosition="left" :model="form" :rules="rules" ref="uForm" label-width="auto"
:labelStyle="{ color: '#333333', fontSize: '30rpx' }">
@@ -43,101 +48,99 @@
</view>
</template>
<script>
import { listHeartJourney, getHeartJourney, delHeartJourney, addHeartJourney, updateHeartJourney } from '@/api/invest/heartJourney'
<script setup>
import {getHeartJourney, addHeartJourney, updateHeartJourney } from '@/api/invest/heartJourney'
import { getDicts } from '@/api/system/dict/data.js'
const { proxy } = getCurrentInstance()
import dayjs from 'dayjs'
export default {
data() {
return {
form: {
createTime: '',
name: '',
remark: '',
type: '',
createTime: '',
typeName: '',
id: '',
},
import {onLoad,onReady} from "@dcloudio/uni-app";
// 计算属性与监听属性是在vue中而非uniap中 需要注意!!!
import {reactive ,toRefs,ref,computed ,getCurrentInstance }from "vue";
const datePickShow = ref(false)
const showTeam = ref(false)
const title = ref("心路历程")
const journeyTypeList = ref([])
const data = reactive({
form: {},
rules: {
name: [{ type: 'string', required: true, message: '请输入标题', trigger: ['change', 'blur'] }],
createTime: [{ type: 'string', required: true, message: '请选择记录时间', trigger: ['change', 'blur'] }],
type: [{ type: 'string', required: true, message: '请选择类型', trigger: ['change', 'blur'] }],
remark: [{ type: 'string', required: true, message: '请输入内容', trigger: ['change', 'blur'] }],
},
datePickShow: false,
id: '',
showTeam: false,
journeyTypeList: []
}
},
onLoad(option) {
this.form.id = option.id
this.getDict()
},
onReady() {
this.$refs.uForm.setRules(this.rules)
},
methods: {
getDict() {
})
const { form, rules} = toRefs(data)
onLoad((option) => {
form.value.id = option.id
if(form.value.id!=null){
title.value="心路历程-修改"
}else{
title.value="心路历程-新增"
}
getDict()
})
onReady(() => {
proxy.$refs['uForm'].setRules(rules.value)
})
function getDict() {
// 工单状态
getDicts('journey_type').then(res => {
this.journeyTypeList =[res.data]
journeyTypeList.value =[res.data]
})
if(this.form.id!=null){
getHeartJourney(this.form.id).then(res => {
this.form = res.data
if(form.value.id!=null){
getHeartJourney(form.value.id).then(res => {
form.value = res.data
})
}
},
handleShowTeam() {
if (this.journeyTypeList[0].length === 0) {
this.$refs.uToast.show({
}
function handleShowTeam() {
if (journeyTypeList.value[0].length === 0) {
proxy.$refs['uToast'].show({
message: '类型为空 ', type: 'warning'
})
} else {
this.showTeam = true
showTeam.value = true
}
},
handleConfirm(e) {
this.form.typeName = e.value[0].dictLabel
this.form.type = e.value[0].dictValue
this.showTeam = false
},
handleCancel() {
this.showTeam = false
},
selectDate() {
this.datePickShow = true
this.$refs.createTimeRef.innerValue = new Date().getTime()
},
datePickConfirm(e) {
this.form.createTime = dayjs(e.value).format("YYYY-MM-DD HH:mm:ss")
this.datePickShow = false
},
submit() {
this.$refs.uForm.validate().then(() => {
if (this.form.id != null) {
updateHeartJourney({ ...this.form}).then(res => {
this.$refs.uToast.show({
}
function handleConfirm(e) {
form.value.typeName = e.value[0].dictLabel
form.value.type = e.value[0].dictValue
showTeam.value = false
}
function handleCancel() {
showTeam.value = false
}
function selectDate() {
datePickShow.value = true
proxy.$refs['createTimeRef'].innerValue = new Date().getTime()
}
function datePickConfirm(e) {
form.value.createTime = dayjs(e.value).format("YYYY-MM-DD HH:mm:ss")
datePickShow.value = false
}
function submit() {
proxy.$refs['uForm'].validate().then(() => {
if (form.value.id != null) {
updateHeartJourney(form.value).then(res => {
proxy.$refs['uToast'].show({
message: '修改成功', complete() {
uni.navigateTo({ url: `/pages/work/heartJourney/list` })
}
})
})
}else {
addHeartJourney({ ...this.form}).then(res => {
this.$refs.uToast.show({
addHeartJourney(form.value).then(res => {
proxy.$refs['uToast'].show({
message: '新增成功', complete() {
uni.navigateTo({ url: `/pages/work/heartJourney/list` })
}
})
})
}
})
},
}
}
</script>
@@ -149,7 +152,7 @@
border-radius: 8rpx;
.section-title {
width: 160rpx;
width: 360rpx;
color: #333333;
line-height: 44rpx;
font-size: 30rpx;

View File

@@ -1,38 +1,39 @@
<template>
<view class="container" style="paddingBottom:1rpx;">
<!-- <uni-navbar title="心路历程详情"></uni-navbar> -->
<u-navbar
leftIconSize="40rpx"
leftIconColor="#333333"
title="心路历程详情"
>
</u-navbar>
<view class="section">
<view class="section-title">{{ detailInfo.name }}</view>
<!-- <uni-cellItem title="标题:" :value="detailInfo.name"></uni-cellItem>
<!-- <view class="section-title">{{ detailInfo.name }}</view> -->
<uni-cellItem title="标题:" :value="detailInfo.name"></uni-cellItem>
<uni-cellItem title="记录时间:" :value="detailInfo.createTime"></uni-cellItem>
<uni-cellItem title="内容:"></uni-cellItem> -->
<uni-cellItem title="内容:"></uni-cellItem>
<view class="content">{{ detailInfo.remark }}</view>
</view>
<u-toast ref="uToast"></u-toast>
</view>
</template>
<script>
<script setup>
import { getHeartJourney} from '@/api/invest/heartJourney'
export default {
data() {
return {
detailInfo: {},
id: '',
}
},
onLoad(option) {
this.id = option.id
this.getInfo()
},
methods: {
getInfo() {
getHeartJourney(this.id).then(res => {
this.detailInfo = res.data
import {onLoad} from "@dcloudio/uni-app";
import {reactive ,toRefs,ref,computed }from "vue";
const id = ref('')
const data = reactive({
detailInfo: {}
})
const {detailInfo} = toRefs(data)
onLoad((option) => {
id.value = option.id
getInfo()
})
function getInfo() {
getHeartJourney(id.value).then(res => {
detailInfo.value = res.data
})
}
}
}
</script>

View File

@@ -64,78 +64,76 @@
</view>
</template>
<script>
<script setup>
import { listHeartJourney, delHeartJourney } from '@/api/invest/heartJourney'
import { getDicts } from '@/api/system/dict/data.js'
export default {
data() {
return {
import {onLoad,onShow} from "@dcloudio/uni-app";
// 计算属性与监听属性是在vue中而非uniap中 需要注意!!!
import {reactive ,toRefs,ref,computed }from "vue";
const pageNum = ref(1)
const listData = ref([])
const isShow = ref(false)
const status = ref('loadmore')
const journeyTypeList = ref([])
const settingPickShow = ref(false)
const settingColumns = ref([])
const data = reactive({
filterPanel: false,
listData: [],
pageNum: 1,
queryParams: {
name: '',
type: '',
},
status: 'loadmore',
journeyTypeList: [],
settingPickShow: false,
settingColumns: [],
columns: [],
isShow: false
}
},
computed: {
windowHeight() {
return uni.getSystemInfoSync().windowHeight - 50
})
const { filterPanel, queryParams} = toRefs(data)
const windowHeight = computed(() => {
uni.getSystemInfoSync().windowHeight - 50
})
onLoad(() => {
getDict()
getList()
});
onShow(() => {
if (isShow.value) {
getList()
isShow.value = false
}
},
onLoad() {
this.getDict()
this.getList()
},
onShow() {
if (this.isShow) {
this.getList()
this.isShow = false
});
function loadmore() {
pageNum.value += 1
if (status.value == 'loadmore') {
getList()
}
},
methods: {
loadmore() {
this.pageNum += 1
if (this.status == 'loadmore') {
this.getList()
}
},
getList() {
this.status = 'loading'
listHeartJourney({ pageSize: 10, pageNum: this.pageNum, ...this.queryParams }).then(res => {
this.listData = this.listData.concat(res.rows)
if (this.listData.length < res.total) {
this.status = 'loadmore'
function getList() {
status.value = 'loading'
listHeartJourney({ pageSize: 10, pageNum: pageNum.value, ...queryParams.value }).then(res => {
listData.value = listData.value.concat(res.rows)
if (listData.length < res.total) {
status.value = 'loadmore'
} else {
this.status = 'nomore'
status.value = 'nomore'
}
}).catch(() => {
this.status = 'nomore'
status.value = 'nomore'
})
},
getDict() {
}
function getDict() {
// 工单状态
getDicts('journey_type').then(res => {
this.journeyTypeList = res.data
journeyTypeList.value = res.data
})
},
settingConfirm(e) {
this.queryParams.settingId = e.value[0].settingId
this.queryParams.settingName = e.value[0].settingName
this.settingPickShow = false
},
settingCancel() {
this.settingPickShow = false
},
dictStr(val, arr) {
}
function settingConfirm(e) {
queryParams.value.settingId = e.value[0].settingId
queryParams.value.settingName = e.value[0].settingName
settingPickShow.value = false
}
function settingCancel() {
settingPickShow.value = false
}
function dictStr(val, arr) {
let str = ''
arr.map(item => {
if (item.dictValue === val) {
@@ -143,48 +141,48 @@ export default {
}
})
return str
},
selectStatus(item) {
this.queryParams.type = item.dictValue
this.journeyTypeList.map(ele => {
}
function selectStatus(item) {
queryParams.value.type = item.dictValue
journeyTypeList.value.map(ele => {
if (ele.dictValue == item.dictValue) {
ele.selected = true
this.$set(ele, 'selected', true)
Reflect.set(ele, 'selected', true)
} else {
this.$set(ele, 'selected', false)
Reflect.set(ele, 'selected', false)
}
})
},
searchSubmit() {
this.pageNum = 1
this.listData = []
this.getList()
this.filterPanel = false
},
searchBlur() {
this.pageNum = 1
this.listData = []
this.getList()
},
resetQuery() {
this.queryParams.name = '',
this.queryParams.type = ''
this.journeyTypeList.map(ele => {
this.$set(ele, 'selected', false)
}
function searchSubmit() {
pageNum.value = 1
listData.value = []
getList()
filterPanel.value = false
}
function searchBlur() {
pageNum.value = 1
listData.value = []
getList()
}
function resetQuery() {
queryParams.value.name = '',
queryParams.value.type = ''
journeyTypeList.value.map(ele => {
Reflect.set(ele, 'selected', false)
})
},
enterDetails(item) {
}
function enterDetails(item) {
uni.navigateTo({ url: `/pages/work/heartJourney/details?id=${item.id}` })
},
handleEdit(item) {
}
function handleEdit(item) {
uni.navigateTo({ url: `/pages/work/heartJourney/addEdit?id=${item.id}` })
this.isShow = true
},
handleAdd() {
isShow.value = true
}
function handleAdd() {
uni.navigateTo({ url: `/pages/work/heartJourney/addEdit` })
this.isShow = true
},
handleDelete(item) {
isShow.value = true
}
function handleDelete(item) {
uni.showModal({
title: '提示',
content: '你确定要删除吗',
@@ -197,10 +195,8 @@ export default {
}
}
});
}
},
}
}
</script>
<style lang="scss" scoped>