243 lines
6.5 KiB
Vue
243 lines
6.5 KiB
Vue
|
|
<template>
|
|||
|
|
<view class="page" :class="{ big: isH5 }">
|
|||
|
|
<view class="panel">
|
|||
|
|
<view class="title">新增干预记录</view>
|
|||
|
|
<view class="subtitle">任务ID {{ taskId || '-' }}</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="panel">
|
|||
|
|
<view class="label">记录内容</view>
|
|||
|
|
<textarea class="textarea" v-model="content" placeholder="例如:2025-12-10 14:00 与李四咨询,疏导刑期焦虑"></textarea>
|
|||
|
|
|
|||
|
|
<view class="label" style="margin-top: 18rpx;">附件</view>
|
|||
|
|
<view class="attach-actions">
|
|||
|
|
<button class="btn ghost" :disabled="uploading" @click="pickImage">选择图片</button>
|
|||
|
|
<button class="btn ghost" :disabled="uploading" @click="pickFile">选择文件</button>
|
|||
|
|
</view>
|
|||
|
|
<view v-if="attachments.length" class="attach-list">
|
|||
|
|
<view class="attach-item" v-for="(a, idx) in attachments" :key="idx">
|
|||
|
|
{{ a.originalFilename || a.newFileName || a.fileName || a.url }}
|
|||
|
|
<text class="del" @tap.stop="removeAttachment(idx)">删除</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view v-if="errorMsg" class="error">{{ errorMsg }}</view>
|
|||
|
|
<button class="btn primary" :disabled="saving" @click="onSave">{{ saving ? '保存中…' : '保存记录' }}</button>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import { uploadCommonFile } from '../../api/common/upload'
|
|||
|
|
import { addInterventionRecord } from '../../api/psychology/interventionRecord'
|
|||
|
|
|
|||
|
|
export default {
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
isH5: false,
|
|||
|
|
taskId: '',
|
|||
|
|
content: '',
|
|||
|
|
attachments: [],
|
|||
|
|
uploading: false,
|
|||
|
|
saving: false,
|
|||
|
|
errorMsg: ''
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
onLoad(options) {
|
|||
|
|
try {
|
|||
|
|
const info = uni.getSystemInfoSync()
|
|||
|
|
const p = info ? (info.uniPlatform || info.platform) : ''
|
|||
|
|
this.isH5 = p === 'web' || p === 'h5'
|
|||
|
|
} catch (e) {
|
|||
|
|
this.isH5 = false
|
|||
|
|
}
|
|||
|
|
this.taskId = options && options.taskId ? options.taskId : ''
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
removeAttachment(idx) {
|
|||
|
|
this.attachments.splice(idx, 1)
|
|||
|
|
},
|
|||
|
|
pickImage() {
|
|||
|
|
uni.chooseImage({
|
|||
|
|
count: 9,
|
|||
|
|
success: (res) => {
|
|||
|
|
const files = (res && res.tempFilePaths) ? res.tempFilePaths : []
|
|||
|
|
this.uploadMany(files)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
pickFile() {
|
|||
|
|
uni.chooseMessageFile({
|
|||
|
|
count: 9,
|
|||
|
|
type: 'file',
|
|||
|
|
success: (res) => {
|
|||
|
|
const files = (res && res.tempFiles) ? res.tempFiles.map(f => f.path) : []
|
|||
|
|
this.uploadMany(files)
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
uploadMany(paths) {
|
|||
|
|
if (!paths || paths.length === 0) return
|
|||
|
|
this.errorMsg = ''
|
|||
|
|
this.uploading = true
|
|||
|
|
const uploads = paths.map(p => uploadCommonFile(p))
|
|||
|
|
Promise.all(uploads).then((results) => {
|
|||
|
|
this.uploading = false
|
|||
|
|
results.forEach((r) => {
|
|||
|
|
const data = r && r.data ? r.data : null
|
|||
|
|
if (!data || data.code !== 200) {
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
this.attachments.push({
|
|||
|
|
url: data.url,
|
|||
|
|
fileName: data.fileName,
|
|||
|
|
newFileName: data.newFileName,
|
|||
|
|
originalFilename: data.originalFilename
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
}).catch((e) => {
|
|||
|
|
this.uploading = false
|
|||
|
|
this.errorMsg = e && e.message ? e.message : '上传失败'
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
onSave() {
|
|||
|
|
this.errorMsg = ''
|
|||
|
|
if (!this.taskId) {
|
|||
|
|
this.errorMsg = '缺少 taskId'
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if (!this.content || !this.content.trim()) {
|
|||
|
|
this.errorMsg = '请输入记录内容'
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
this.saving = true
|
|||
|
|
addInterventionRecord({
|
|||
|
|
taskId: Number(this.taskId),
|
|||
|
|
content: this.content,
|
|||
|
|
attachments: this.attachments
|
|||
|
|
}).then((res) => {
|
|||
|
|
this.saving = false
|
|||
|
|
const data = res && res.data ? res.data : null
|
|||
|
|
if (!data || data.code !== 200) {
|
|||
|
|
this.errorMsg = (data && data.msg) ? data.msg : '保存失败'
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
uni.showToast({ title: '已保存', icon: 'success' })
|
|||
|
|
setTimeout(() => {
|
|||
|
|
uni.navigateBack()
|
|||
|
|
}, 400)
|
|||
|
|
}).catch((e) => {
|
|||
|
|
this.saving = false
|
|||
|
|
this.errorMsg = e && e.message ? e.message : '网络错误'
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style>
|
|||
|
|
.page {
|
|||
|
|
min-height: 100vh;
|
|||
|
|
padding: 32rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
background: #f6f7fb;
|
|||
|
|
}
|
|||
|
|
.page.big {
|
|||
|
|
padding: 14rpx 14rpx 120rpx;
|
|||
|
|
background-image:
|
|||
|
|
radial-gradient(1100rpx 520rpx at 50% 14%, rgba(43, 107, 255, 0.30) 0%, rgba(6, 16, 40, 0.0) 65%),
|
|||
|
|
linear-gradient(180deg, rgba(5, 11, 24, 0.90) 0%, rgba(8, 20, 45, 0.85) 42%, rgba(6, 16, 40, 0.92) 100%),
|
|||
|
|
url('/static/bg.png');
|
|||
|
|
background-size: auto, auto, cover;
|
|||
|
|
background-position: center, center, center;
|
|||
|
|
background-repeat: no-repeat, no-repeat, no-repeat;
|
|||
|
|
}
|
|||
|
|
.panel {
|
|||
|
|
background: #ffffff;
|
|||
|
|
border-radius: 20rpx;
|
|||
|
|
padding: 24rpx;
|
|||
|
|
border: 1px solid rgba(0, 0, 0, 0.05);
|
|||
|
|
margin-bottom: 24rpx;
|
|||
|
|
}
|
|||
|
|
.title {
|
|||
|
|
font-size: 36rpx;
|
|||
|
|
font-weight: 700;
|
|||
|
|
color: #1f2329;
|
|||
|
|
}
|
|||
|
|
.subtitle {
|
|||
|
|
margin-top: 10rpx;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #646a73;
|
|||
|
|
line-height: 36rpx;
|
|||
|
|
}
|
|||
|
|
.label {
|
|||
|
|
font-size: 26rpx;
|
|||
|
|
color: #1f2329;
|
|||
|
|
margin-bottom: 10rpx;
|
|||
|
|
}
|
|||
|
|
.textarea {
|
|||
|
|
background: #f7f8fa;
|
|||
|
|
border-radius: 16rpx;
|
|||
|
|
padding: 18rpx;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
box-sizing: border-box;
|
|||
|
|
min-height: 180rpx;
|
|||
|
|
}
|
|||
|
|
.attach-actions {
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
margin-top: 8rpx;
|
|||
|
|
}
|
|||
|
|
.btn {
|
|||
|
|
width: 48%;
|
|||
|
|
border-radius: 16rpx;
|
|||
|
|
}
|
|||
|
|
.btn.primary {
|
|||
|
|
width: 100%;
|
|||
|
|
margin-top: 18rpx;
|
|||
|
|
background: #1677ff;
|
|||
|
|
color: #fff;
|
|||
|
|
}
|
|||
|
|
.btn.ghost {
|
|||
|
|
background: rgba(22, 119, 255, 0.12);
|
|||
|
|
color: #1677ff;
|
|||
|
|
}
|
|||
|
|
.attach-list {
|
|||
|
|
margin-top: 14rpx;
|
|||
|
|
border: 1px dashed rgba(0, 0, 0, 0.12);
|
|||
|
|
border-radius: 16rpx;
|
|||
|
|
padding: 14rpx;
|
|||
|
|
}
|
|||
|
|
.attach-item {
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #1f2329;
|
|||
|
|
line-height: 40rpx;
|
|||
|
|
display: flex;
|
|||
|
|
justify-content: space-between;
|
|||
|
|
}
|
|||
|
|
.del {
|
|||
|
|
color: #ff4d4f;
|
|||
|
|
margin-left: 12rpx;
|
|||
|
|
}
|
|||
|
|
.error {
|
|||
|
|
margin-top: 14rpx;
|
|||
|
|
font-size: 24rpx;
|
|||
|
|
color: #ff4d4f;
|
|||
|
|
line-height: 36rpx;
|
|||
|
|
}
|
|||
|
|
.page.big .panel,
|
|||
|
|
.page.big .attach-list {
|
|||
|
|
border: 1px solid rgba(116, 216, 255, 0.22);
|
|||
|
|
background: linear-gradient(180deg, rgba(10, 18, 38, 0.75) 0%, rgba(5, 10, 22, 0.55) 100%);
|
|||
|
|
box-shadow: 0 12rpx 24rpx rgba(0, 0, 0, 0.35);
|
|||
|
|
}
|
|||
|
|
.page.big .title,
|
|||
|
|
.page.big .label { color: rgba(235, 248, 255, 0.92); }
|
|||
|
|
.page.big .subtitle { color: rgba(201, 242, 255, 0.65); }
|
|||
|
|
.page.big .textarea { background: rgba(7, 13, 28, 0.35); border: 1px solid rgba(116, 216, 255, 0.18); color: rgba(235, 248, 255, 0.92); }
|
|||
|
|
.page.big .btn.primary { background: linear-gradient(90deg, rgba(116, 216, 255, 0.95) 0%, rgba(43, 107, 255, 0.92) 100%); color: #0b1226; }
|
|||
|
|
.page.big .btn.ghost { background: rgba(7, 13, 28, 0.35); color: rgba(201, 242, 255, 0.86); border: 1px solid rgba(116, 216, 255, 0.18); }
|
|||
|
|
.page.big .attach-item { color: rgba(235, 248, 255, 0.88); }
|
|||
|
|
.page.big .attach-list { border-style: solid; }
|
|||
|
|
</style>
|