现场维修
This commit is contained in:
jiang
parent
36566b7ee1
commit
4504cadc2b
1117
src/pages.json
1117
src/pages.json
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,327 @@
|
|||
<template>
|
||||
<view class="accept page-common">
|
||||
<div class="card">
|
||||
<uni-forms :modelValue="formData" label-width="170rpx" :border="true">
|
||||
<uni-forms-item label="单位名称：" name="unitId" required>
|
||||
<eselect
|
||||
style="width: 100%; height: 90rpx"
|
||||
ref="treeSelect"
|
||||
:options="unitList"
|
||||
@change="getProject"
|
||||
@clear="clearUnit"
|
||||
></eselect>
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="工程名称：" name="proId" required>
|
||||
<eselect
|
||||
style="width: 100%; height: 90rpx"
|
||||
ref="treeSelect2"
|
||||
:options="proList"
|
||||
@change="changePro"
|
||||
@clear="clearPro"
|
||||
></eselect>
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="现负责人：" name="fieldPerson" required>
|
||||
<uni-easyinput v-model="fieldPerson" maxlength="10" placeholder="请输入现场负责人名称" />
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="联系电话：" name="phone" required>
|
||||
<uni-easyinput v-model="phone" maxlength="11" placeholder="请输入联系电话" />
|
||||
</uni-forms-item>
|
||||
</uni-forms>
|
||||
</div>
|
||||
|
||||
<div class="btn">
|
||||
<button class="btn-cont" @click="clearForm">清空</button>
|
||||
<button class="btn-cont" @click="confirmAdd">确认</button>
|
||||
</div>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive } from 'vue'
|
||||
import { onLoad } from '@dcloudio/uni-app'
|
||||
import {
|
||||
getUnitList,
|
||||
getProjectList,
|
||||
insert,
|
||||
getAgreementInfoById,
|
||||
} from '@/services/fieldMaintenance/fieldMaintenance.js'
|
||||
import eselect from '@/components/tree-select/eselect.vue'
|
||||
const treeSelect = ref(null)
|
||||
const treeSelect2 = ref(null)
|
||||
const unitId = ref('')
|
||||
const proId = ref('')
|
||||
const agreementId = ref('')
|
||||
const unitList = ref([])
|
||||
const proList = ref([])
|
||||
const fieldPerson = ref('')
|
||||
const phone = ref('')
|
||||
|
||||
//单位
|
||||
const getUnit = () => {
|
||||
// proId.value=e.id;
|
||||
let obj = {
|
||||
projectId: proId.value,
|
||||
}
|
||||
getUnitList(obj)
|
||||
.then((res) => {
|
||||
console.log(res)
|
||||
unitList.value = res.data
|
||||
// getAgreement()
|
||||
if (unitId.value && proId.value) {
|
||||
getAgreement()
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
//工程
|
||||
const getProject = (e) => {
|
||||
console.log('🚀 ~ getProject ~ e:', e)
|
||||
unitId.value = e?.id || ''
|
||||
let obj = {
|
||||
unitId: unitId.value,
|
||||
// "isApp":true
|
||||
}
|
||||
getProjectList(obj)
|
||||
.then((res) => {
|
||||
proList.value = res.data
|
||||
// proId.value=""
|
||||
// treeSelect2.value.clearInput();
|
||||
agreementId.value = ''
|
||||
if (unitId.value && proId.value) {
|
||||
getAgreement()
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
const clearUnit = () => {
|
||||
unitId.value = ''
|
||||
agreementId.value = ''
|
||||
getUnit()
|
||||
getProject()
|
||||
}
|
||||
const clearPro = () => {
|
||||
proId.value = ''
|
||||
agreementId.value = ''
|
||||
getProject()
|
||||
getProject()
|
||||
}
|
||||
//工程选择
|
||||
const changePro = (e) => {
|
||||
console.log(e)
|
||||
proId.value = e.id
|
||||
getUnit()
|
||||
// getAgreement()
|
||||
}
|
||||
//协议
|
||||
const getAgreement = () => {
|
||||
let obj = {
|
||||
unitId: unitId.value,
|
||||
projectId: proId.value,
|
||||
}
|
||||
getAgreementInfoById(obj)
|
||||
.then((res) => {
|
||||
console.log(res)
|
||||
if (res.code == 200) {
|
||||
agreementId.value = res.data.agreementId
|
||||
} else {
|
||||
agreementId.value = ''
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
|
||||
//清空
|
||||
const clearForm = () => {
|
||||
unitId.value = ''
|
||||
proId.value = ''
|
||||
fieldPerson.value = ''
|
||||
phone.value = ''
|
||||
agreementId.value = ''
|
||||
treeSelect.value.clearInput()
|
||||
treeSelect2.value.clearInput()
|
||||
getUnit()
|
||||
// getProject()
|
||||
}
|
||||
//确认
|
||||
const confirmAdd = () => {
|
||||
if (agreementId.value == '') {
|
||||
uni.showToast({ title: '请确认单位名称,工程名称!', icon: 'none' })
|
||||
} else if (fieldPerson.value == '') {
|
||||
uni.showToast({ title: '请确认制单人!', icon: 'none' })
|
||||
} else if (phone.value == '') {
|
||||
uni.showToast({ title: '请确认联系电话!', icon: 'none' })
|
||||
} else {
|
||||
let obj = {
|
||||
agreementId: agreementId.value,
|
||||
fieldPerson: fieldPerson.value,
|
||||
phone: phone.value,
|
||||
}
|
||||
insert(obj)
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
uni.showToast({ title: '新增成功', icon: 'none' })
|
||||
uni.navigateBack({
|
||||
delta: 1, // 返回到已存在的页面
|
||||
})
|
||||
} else {
|
||||
uni.showToast({ title: res.msg, icon: 'none' })
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
}
|
||||
const leftClick = () => {
|
||||
console.log(1)
|
||||
uni.navigateBack({
|
||||
delta: 1, // 返回到已存在的页面
|
||||
})
|
||||
}
|
||||
const rightClick = () => {
|
||||
console.log(2)
|
||||
uni.navigateTo({ url: `/pages/back/backCodeAdd` })
|
||||
}
|
||||
onLoad((options) => {
|
||||
getUnit()
|
||||
getProject()
|
||||
// formData.value = JSON.parse(options.item)
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.accept {
|
||||
padding: 24rpx;
|
||||
height: 90vh;
|
||||
word-break: break-all;
|
||||
background-color: #f7f8fa;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
// 卡片样式
|
||||
.card {
|
||||
padding: 32rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
|
||||
margin-bottom: 24rpx;
|
||||
height: auto;
|
||||
|
||||
// 表单样式
|
||||
:deep(.uni-forms) {
|
||||
.uni-forms-item {
|
||||
padding: 24rpx 0;
|
||||
margin-bottom: 0;
|
||||
border-bottom: 2rpx solid #f5f5f5;
|
||||
|
||||
&:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.uni-forms-item__label {
|
||||
color: #8c8c8c;
|
||||
}
|
||||
|
||||
// 下拉选择框样式
|
||||
.uni-data-select {
|
||||
.uni-select {
|
||||
border: 2rpx solid #e8e8e8;
|
||||
border-radius: 12rpx;
|
||||
height: 88rpx;
|
||||
padding: 0 24rpx;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:focus-within {
|
||||
border-color: #3784fb;
|
||||
box-shadow: 0 0 0 2rpx rgba(55, 132, 251, 0.1);
|
||||
}
|
||||
|
||||
.uni-select__input-box {
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
}
|
||||
|
||||
.uni-select__input-text {
|
||||
font-size: 28rpx;
|
||||
color: #262626;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 输入框样式
|
||||
.uni-easyinput {
|
||||
.uni-easyinput__content {
|
||||
background-color: #f7f8fa;
|
||||
border: 2rpx solid #e8e8e8;
|
||||
border-radius: 12rpx;
|
||||
height: 88rpx;
|
||||
padding: 0 24rpx;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:focus-within {
|
||||
border-color: #3784fb;
|
||||
box-shadow: 0 0 0 2rpx rgba(55, 132, 251, 0.1);
|
||||
}
|
||||
|
||||
.uni-easyinput__content-input {
|
||||
font-size: 28rpx;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
color: #262626;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 底部按钮
|
||||
.btn {
|
||||
margin-top: auto;
|
||||
padding: 32rpx;
|
||||
// background: #fff;
|
||||
// box-shadow: 0 -4rpx 16rpx rgba(0, 0, 0, 0.05);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
gap: 24rpx;
|
||||
|
||||
.btn-cont {
|
||||
flex: 1;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
text-align: center;
|
||||
background: linear-gradient(135deg, #4b8eff 0%, #3784fb 100%);
|
||||
color: #fff;
|
||||
border-radius: 44rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:active {
|
||||
transform: scale(0.98);
|
||||
opacity: 0.9;
|
||||
box-shadow: 0 2rpx 8rpx rgba(55, 132, 251, 0.2);
|
||||
}
|
||||
|
||||
// 清空按钮样式
|
||||
&:first-child {
|
||||
background: #fff;
|
||||
color: #3784fb;
|
||||
border: 2rpx solid #3784fb;
|
||||
box-shadow: none;
|
||||
|
||||
&:active {
|
||||
background: #f7f8fa;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,567 @@
|
|||
<template>
|
||||
<view class="page-container">
|
||||
<!-- 搜索框 -->
|
||||
<uni-row :gutter="24" class="search-form">
|
||||
<uni-col :span="item.taskStatus == '0' ? 12 : 20">
|
||||
<uni-easyinput v-model="queryParams.keyWord" placeholder="请输入内容" />
|
||||
</uni-col>
|
||||
<uni-col :span="4">
|
||||
<view class="search" @click="onSearchBtn">搜索</view>
|
||||
</uni-col>
|
||||
<uni-col v-show="item.taskStatus == '0'" :span="4" style="padding-right: 0;">
|
||||
<view class="add" @click="goCode">编码</view>
|
||||
</uni-col>
|
||||
<uni-col v-show="item.taskStatus == '0'" :span="4" style="padding-right: 0;">
|
||||
<view class="add" @click="goNum">数量</view>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
|
||||
<!-- 列表区域 -->
|
||||
<scroll-view scroll-y class="scroll-container" @scrolltolower="onScrollTolower">
|
||||
<view v-for="(table, index) in tableList" :key="index" class="table-list-item">
|
||||
<div class="title">
|
||||
<div class="title-left">
|
||||
<span class="code">{{ table.typeName }}</span>
|
||||
</div>
|
||||
<div class="status-tag">
|
||||
<view v-show="item.taskStatus === '0'" @click.stop="deleteItem(table)" style="padding-right: 10rpx;">
|
||||
<uni-icons type="trash" size="24" color="#ff0000" />
|
||||
</view>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<view class="line"></view>
|
||||
<template v-for="field in fieldMap" :key="field.label">
|
||||
<uni-row :gutter="24">
|
||||
<uni-col :span="field.labelSpan">{{ field.label }}：</uni-col>
|
||||
<uni-col :span="field.valueSpan">
|
||||
<view class="cont">
|
||||
{{ field.formatter ? field.formatter(table[field.key]) : (table[field.key] ?? field.default ?? '无') }}
|
||||
</view>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
</template>
|
||||
</view>
|
||||
<view class="loading-text">{{ finish ? '没有更多数据了~' : '正在加载...' }}</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
computed
|
||||
} from 'vue'
|
||||
|
||||
import {
|
||||
getListDetails,
|
||||
deleteFieldApplyDetailsById,
|
||||
submitTask
|
||||
} from '@/services/fieldMaintenance/fieldMaintenance.js'
|
||||
import {
|
||||
onLoad,
|
||||
onShow
|
||||
} from '@dcloudio/uni-app'
|
||||
import {
|
||||
debounce
|
||||
} from 'lodash-es'
|
||||
const item = ref({})
|
||||
const total = ref(0)
|
||||
const tableList = ref([])
|
||||
|
||||
const queryParams = ref({
|
||||
parentId: '',
|
||||
keyWord: '',
|
||||
pageNum: 1,
|
||||
pageSize: 10
|
||||
})
|
||||
|
||||
const fieldMap = [{
|
||||
label: '规格型号',
|
||||
key: 'typeModel',
|
||||
labelSpan: 6,
|
||||
valueSpan: 18,
|
||||
default: '未填写'
|
||||
},
|
||||
{
|
||||
label: '维修数量',
|
||||
key: 'preNum',
|
||||
labelSpan: 6,
|
||||
valueSpan: 18,
|
||||
default: 0
|
||||
},
|
||||
{
|
||||
label: '单位',
|
||||
key: 'unitName',
|
||||
labelSpan: 6,
|
||||
valueSpan: 18,
|
||||
default: '个'
|
||||
},
|
||||
{
|
||||
label: '管理模式',
|
||||
key: 'manageType',
|
||||
labelSpan: 6,
|
||||
valueSpan: 18,
|
||||
default: '数量管理',
|
||||
formatter: val => {
|
||||
if (val == 0) return '编码管理'
|
||||
if (val == 1) return '数量管理'
|
||||
return '未知'
|
||||
}
|
||||
}
|
||||
]
|
||||
|
||||
|
||||
|
||||
onLoad((options) => {
|
||||
item.value = JSON.parse(options.item)
|
||||
queryParams.value.parentId = item.value.id
|
||||
|
||||
})
|
||||
|
||||
const submitItem = item => {
|
||||
submitTask({
|
||||
taskId: item.taskId
|
||||
}).then(res => {
|
||||
console.log(res)
|
||||
if (res.code == 200) {
|
||||
uni.showToast({
|
||||
title: '提交成功',
|
||||
icon: 'none'
|
||||
})
|
||||
getTableList(true)
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '提交失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
|
||||
//编码新增
|
||||
const goCode = () => {
|
||||
uni.navigateTo({
|
||||
url: `/pages/repair/fieldMaintenance/fieldCode?item=${JSON.stringify(item.value)}`
|
||||
})
|
||||
}
|
||||
//数量新增
|
||||
const goNum = () => {
|
||||
console.log(item.value)
|
||||
uni.navigateTo({
|
||||
url: `/pages/repair/fieldMaintenance/fieldNum?item=${JSON.stringify(item.value)}`
|
||||
})
|
||||
}
|
||||
|
||||
const deleteItem = item => {
|
||||
console.log(item)
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确定要删除该条记录吗？',
|
||||
confirmText: '删除',
|
||||
cancelText: '取消',
|
||||
success: res => {
|
||||
if (res.confirm) {
|
||||
// 用户点击了“删除”
|
||||
deleteFieldApplyDetailsById({
|
||||
parentId: item.parentId,
|
||||
typeId: item.typeId
|
||||
}).then(res => {
|
||||
console.log(res)
|
||||
if (res.code == 200) {
|
||||
uni.showToast({
|
||||
title: '刪除成功',
|
||||
icon: 'none'
|
||||
})
|
||||
getTableList(true)
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '刪除失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
// 用户点击了“取消”时不做任何处理
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const onSearchBtn = () => {
|
||||
queryParams.value.pageNum = 1
|
||||
tableList.value = []
|
||||
getTableList(true)
|
||||
}
|
||||
|
||||
const getTableList = () => {
|
||||
const res = getListDetails(queryParams.value).then(res => {
|
||||
total.value = res.data.total
|
||||
tableList.value.push(...res.data.rows)
|
||||
})
|
||||
}
|
||||
|
||||
onShow(() => {
|
||||
tableList.value = []
|
||||
total.value = 0
|
||||
getTableList()
|
||||
})
|
||||
|
||||
const onScrollTolower = debounce(() => {
|
||||
if (total.value > tableList.value.length) {
|
||||
queryParams.value.pageNum++
|
||||
getTableList()
|
||||
}
|
||||
}, 500)
|
||||
|
||||
const changeTab = index => {
|
||||
active.value = index
|
||||
queryParams.value.taskStatus = index === 1 ? 0 : 2
|
||||
queryParams.value.pageNum = 1
|
||||
getTableList(true)
|
||||
}
|
||||
|
||||
const handleAdded = () => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/repair/fieldMaintenance/added'
|
||||
})
|
||||
}
|
||||
|
||||
const handleItem = item => {
|
||||
uni.navigateTo({
|
||||
url: `/pages/repair/fieldMaintenance/detail?item=${JSON.stringify(item)}`
|
||||
})
|
||||
}
|
||||
|
||||
const finish = computed(() => total.value === tableList.value.length)
|
||||
|
||||
const maskClick = () => {}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.title-left {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.code {
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #3784fb;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
|
||||
.sub-code {
|
||||
font-size: 28rpx;
|
||||
/* 比主code小一点 */
|
||||
color: #8c8c8c;
|
||||
/* 灰色更柔和 */
|
||||
margin-top: 4rpx;
|
||||
/* 与主code有一点间距 */
|
||||
}
|
||||
}
|
||||
|
||||
.status-tag {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.page-container {
|
||||
display: flex;
|
||||
height: 100vh;
|
||||
padding: 24rpx;
|
||||
flex-direction: column;
|
||||
background-color: #f7f8fa;
|
||||
|
||||
.complete-btn {
|
||||
display: flex;
|
||||
padding: 20rpx 24rpx;
|
||||
justify-content: center;
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.05);
|
||||
|
||||
.btn {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 0 60rpx;
|
||||
position: relative;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
span {
|
||||
font-size: 32rpx;
|
||||
color: #8c8c8c;
|
||||
font-weight: 500;
|
||||
|
||||
&.active {
|
||||
color: #3784fb;
|
||||
font-weight: 600;
|
||||
|
||||
.second-active & {
|
||||
color: #fa8c16;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bt-line {
|
||||
width: 32rpx;
|
||||
height: 6rpx;
|
||||
background: #3784fb;
|
||||
margin-top: 12rpx;
|
||||
border-radius: 6rpx;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
.second-active & {
|
||||
background: #fa8c16;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-form {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: #fff;
|
||||
padding: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.05);
|
||||
|
||||
:deep(.uni-easyinput__content),
|
||||
:deep(.uni-date-editor) {
|
||||
background-color: #f7f8fa;
|
||||
border: 2rpx solid #e8e8e8;
|
||||
border-radius: 12rpx;
|
||||
height: 80rpx;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:focus-within {
|
||||
border-color: #3784fb;
|
||||
box-shadow: 0 0 0 2rpx rgba(55, 132, 251, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.uni-date) {
|
||||
width: 100%;
|
||||
|
||||
.uni-date-x {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.uni-date-editor--x {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.uni-date-range--x {
|
||||
width: 100%;
|
||||
|
||||
.uni-date-range--x-input {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 24rpx;
|
||||
|
||||
.uni-date-range--x-text {
|
||||
font-size: 28rpx;
|
||||
color: #262626;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.uni-date-x--border {
|
||||
width: 100%;
|
||||
border: 2rpx solid #e8e8e8;
|
||||
border-radius: 12rpx;
|
||||
background-color: #f7f8fa;
|
||||
height: 80rpx;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:focus-within {
|
||||
border-color: #3784fb;
|
||||
box-shadow: 0 0 0 2rpx rgba(55, 132, 251, 0.1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.uni-date-editor) {
|
||||
.uni-date-range {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
|
||||
.uni-date-range--text {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search {
|
||||
height: 80rpx;
|
||||
background: linear-gradient(135deg, #4b8eff 0%, #3784fb 100%);
|
||||
text-align: center;
|
||||
line-height: 80rpx;
|
||||
color: #fff;
|
||||
border-radius: 12rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:active {
|
||||
transform: translateY(2rpx);
|
||||
opacity: 0.9;
|
||||
}
|
||||
}
|
||||
|
||||
.add {
|
||||
height: 80rpx;
|
||||
background: linear-gradient(135deg, #00aa00 0%, #00aa7f 100%);
|
||||
text-align: center;
|
||||
line-height: 80rpx;
|
||||
color: #fff;
|
||||
border-radius: 12rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:active {
|
||||
transform: translateY(2rpx);
|
||||
opacity: 0.9;
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-container {
|
||||
padding: 0 2rpx;
|
||||
|
||||
.table-list-item {
|
||||
margin: 24rpx 0;
|
||||
padding: 32rpx;
|
||||
background-color: #fff;
|
||||
min-height: 300rpx;
|
||||
border-radius: 20rpx;
|
||||
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.06);
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:active {
|
||||
transform: scale(0.985);
|
||||
background-color: #fafbfc;
|
||||
}
|
||||
|
||||
.title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
// margin-bottom: 20rpx;
|
||||
|
||||
.title-left {
|
||||
.code {
|
||||
font-size: 32rpx;
|
||||
font-weight: 300;
|
||||
color: #3784fb;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
}
|
||||
|
||||
span.status {
|
||||
padding: 8rpx 28rpx;
|
||||
border-radius: 8rpx;
|
||||
font-size: 26rpx;
|
||||
font-weight: 600;
|
||||
|
||||
&.completed {
|
||||
background-color: rgba(82, 196, 26, 0.1);
|
||||
color: #52c41a;
|
||||
}
|
||||
|
||||
&.pending {
|
||||
background-color: rgba(250, 140, 22, 0.1);
|
||||
color: #fa8c16;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.line {
|
||||
margin: 24rpx 0;
|
||||
height: 2rpx;
|
||||
background: linear-gradient(90deg,
|
||||
rgba(232, 232, 232, 0) 0%,
|
||||
rgba(232, 232, 232, 1) 50%,
|
||||
rgba(232, 232, 232, 0) 100%);
|
||||
}
|
||||
|
||||
:deep(.uni-row) {
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.uni-col-6 {
|
||||
color: #8c8c8c;
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
.cont {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
line-height: 1.8;
|
||||
color: #262626;
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.loading-text {
|
||||
text-align: center;
|
||||
font-size: 26rpx;
|
||||
color: #8c8c8c;
|
||||
padding: 32rpx 0;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
}
|
||||
|
||||
// 优化滑动区域样式
|
||||
:deep(.uni-swipe_action) {
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.uni-swipe_content {
|
||||
margin: 0 !important;
|
||||
padding: 0;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.uni-swipe_button-group {
|
||||
height: 100%;
|
||||
|
||||
.uni-swipe_button {
|
||||
writing-mode: vertical-rl;
|
||||
padding: 0 24rpx;
|
||||
font-size: 28rpx !important;
|
||||
font-weight: 600;
|
||||
|
||||
// 查看按钮
|
||||
&:nth-child(1) {
|
||||
background: linear-gradient(to bottom, #3ad980, #34C759) !important;
|
||||
}
|
||||
|
||||
// 出库按钮
|
||||
&:nth-child(2) {
|
||||
background: linear-gradient(to bottom, #3b95ff, #007AFF) !important;
|
||||
}
|
||||
|
||||
&:active {
|
||||
opacity: 0.85;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,483 @@
|
|||
<template>
|
||||
<view class="page-container">
|
||||
<!-- 任务信息 -->
|
||||
<div class="card-container">
|
||||
<div class="card-header" @click="toggleCollapse">
|
||||
<span class="title">任务信息</span>
|
||||
<span style="color: #007AFF">{{ collapsed ? '展开' : '收起' }}</span>
|
||||
</div>
|
||||
|
||||
<view v-show="!collapsed">
|
||||
<uni-forms :model="item" label-width="170rpx" :border="true">
|
||||
<uni-forms-item label="单位：" name="unitName">
|
||||
<span class="form-item">{{ item.unitName }}</span>
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="工程：" name="proName">
|
||||
<span class="form-item">{{ item.proName }}</span>
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="单号：" name="code">
|
||||
<span class="form-item">{{ item.code }}</span>
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="人员：" name="fieldPerson">
|
||||
<span class="form-item">{{ item.fieldPerson }}</span>
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="电话：" name="phone">
|
||||
<span class="form-item">{{ item.phone }}</span>
|
||||
</uni-forms-item>
|
||||
</uni-forms>
|
||||
</view>
|
||||
</div>
|
||||
<div class="card-container" style="margin-top: 10px">
|
||||
<div class="card-header">
|
||||
<span class="title">接收方式</span>
|
||||
<uni-row :gutter="24">
|
||||
<uni-col :span="12">
|
||||
<view class="coding-btn" @click="onCodeIdentify">编码识别</view>
|
||||
</uni-col>
|
||||
<uni-col :span="12">
|
||||
<view class="coding-btn" @click="scanStart">二维码识别</view>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!-- 维修物资 -->
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<span class="title">维修物资</span>
|
||||
</div>
|
||||
|
||||
<uni-row :gutter="24" style="display: flex; align-items: center; margin-bottom: 10px">
|
||||
<uni-col :span="6">设备编码：</uni-col>
|
||||
<uni-col :span="12">
|
||||
<uni-easyinput placeholder="请输入内容" maxlength="30" v-model="maCode" />
|
||||
</uni-col>
|
||||
<uni-col :span="6">
|
||||
<view class="coding-btn search-btn" @click="getMaInfo">编码检索</view>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
|
||||
<scroll-view scroll-y class="scroll-container" @scrolltolower="onScrollTolower">
|
||||
<view v-for="(item, index) in typeList" :key="index" class="table-list-item">
|
||||
<div class="title">
|
||||
<div class="title-left">
|
||||
<span class="code">{{ item.typeName }}</span>
|
||||
</div>
|
||||
<div class="status-tag">
|
||||
<view @click.stop="deleteItem(item)" style="padding-right: 10rpx;">
|
||||
<uni-icons type="trash" size="24" color="#ff0000" />
|
||||
</view>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<view class="line"></view>
|
||||
<template v-for="field in fieldMap" :key="field.label">
|
||||
<uni-row :gutter="24">
|
||||
<uni-col :span="field.labelSpan">{{ field.label }}：</uni-col>
|
||||
<uni-col :span="field.valueSpan">
|
||||
<view class="cont">
|
||||
{{ field.formatter ? field.formatter(item[field.key]) : (item[field.key] ?? field.default ?? '无') }}
|
||||
</view>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
</template>
|
||||
<uni-row :gutter="24">
|
||||
<uni-col :span="8">配件数量：</uni-col>
|
||||
<uni-col :span="16">
|
||||
<view class="cont">
|
||||
<uni-data-select v-model="item.charge" placeholder="请选择规格型号" :localdata="charge"
|
||||
@change="selectMaCode">
|
||||
</uni-data-select>
|
||||
</view>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
<uni-row :gutter="24">
|
||||
<uni-col :span="8">配件数量：</uni-col>
|
||||
<uni-col :span="16">
|
||||
<view class="cont">
|
||||
<uni-easyinput type="number" v-model="item.count" @input="onChangeNumber(item)"
|
||||
placeholder="输入数值" style="flex: 1;" />
|
||||
</view>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</div>
|
||||
|
||||
<!-- 底部按钮 -->
|
||||
<div class="footer-btn">
|
||||
<button class="btn-cont" @click="submitNum">确认</button>
|
||||
</div>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
reactive
|
||||
} from 'vue'
|
||||
import {
|
||||
onLoad
|
||||
} from '@dcloudio/uni-app'
|
||||
import {
|
||||
getUseType,
|
||||
getMachine
|
||||
} from '@/services/fieldMaintenance/fieldMaintenance.js'
|
||||
import {
|
||||
baseURL
|
||||
} from '@/utils/http'
|
||||
import ScanQrCode from '@/pages/devicesSearch/ScanQrCode.vue'
|
||||
import {
|
||||
forEach
|
||||
} from 'lodash-es'
|
||||
const maCodeSelectList = ref([])
|
||||
const charge = ref([{
|
||||
value: 1,
|
||||
text: '是',
|
||||
}, {
|
||||
value: 0,
|
||||
text: '否',
|
||||
}])
|
||||
|
||||
const scanQrCodeRef = ref(null)
|
||||
const qrCode = ref('') //图片展示
|
||||
const item = ref({})
|
||||
const maCode = ref('') //编码
|
||||
const collapsed = ref(true)
|
||||
const typeList = ref([])
|
||||
const fieldMap = [{
|
||||
label: '规格型号',
|
||||
key: 'materialName',
|
||||
labelSpan: 8,
|
||||
valueSpan: 16
|
||||
}, {
|
||||
label: '设备状态',
|
||||
key: 'maStatusName',
|
||||
labelSpan: 8,
|
||||
valueSpan: 16
|
||||
}]
|
||||
|
||||
//根据编码获取设备类型
|
||||
const getMaInfo = () => {
|
||||
console.log(maCode.value)
|
||||
let param = {
|
||||
maCode: maCode.value,
|
||||
unitId: item.value.unitId,
|
||||
proId: item.value.proId,
|
||||
}
|
||||
getMachine(param)
|
||||
.then((res) => {
|
||||
console.log(res)
|
||||
if (res.code == 200) {
|
||||
res.data.forEach((item, index) => {
|
||||
item.id = generateUniqueId();
|
||||
typeList.value.push(item);
|
||||
});
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
const generateUniqueId = () => {
|
||||
return Date.now().toString(36) + Math.random().toString(36).substr(2, 5);
|
||||
};
|
||||
|
||||
const deleteItem = (item) => {
|
||||
typeList.value = typeList.value.filter(i => i.id !== item.id);
|
||||
};
|
||||
const onCodeIdentify = () => {
|
||||
console.log('编码识别--')
|
||||
uni.navigateTo({
|
||||
url: `/pages/back/backCodeScan?queryParams=${JSON.stringify(item.value)}`,
|
||||
})
|
||||
}
|
||||
// 二维码扫码
|
||||
const scanStart = async () => {
|
||||
qrCode.value = ''
|
||||
if (scanQrCodeRef.value) {
|
||||
scanQrCodeRef.value.scanQrCode()
|
||||
}
|
||||
}
|
||||
|
||||
const toggleCollapse = () => (collapsed.value = !collapsed.value)
|
||||
const onChangeNumber = (item) => {
|
||||
console.log(item)
|
||||
let maxNum = Number(item.num)
|
||||
// outboundNum.value
|
||||
setTimeout(() => {
|
||||
if (item.unitValue == 1) {
|
||||
item.count = Number(String(item.count).replace(/[^\d.]/g, ''))
|
||||
} else {
|
||||
item.count = Number(String(item.count).replace(/[^\d]/g, ''))
|
||||
}
|
||||
if (Number(item.count) <= 0) {
|
||||
item.count = 0;
|
||||
}
|
||||
if (Number(item.count) > maxNum) {
|
||||
uni.showToast({
|
||||
title: '已达到当前资最大在用数量！',
|
||||
icon: 'none',
|
||||
})
|
||||
item.count = maxNum;
|
||||
}
|
||||
}, 500)
|
||||
}
|
||||
|
||||
onLoad((options) => {
|
||||
item.value = JSON.parse(options.item)
|
||||
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.page-container {
|
||||
display: flex;
|
||||
height: 97vh;
|
||||
padding: 24rpx;
|
||||
flex-direction: column;
|
||||
background-color: #f7f8fa;
|
||||
|
||||
.card-container {
|
||||
padding: 24rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
|
||||
margin-bottom: 24rpx;
|
||||
|
||||
// 扫码按钮样式
|
||||
.coding-btn {
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
background: linear-gradient(135deg, #4b8eff 0%, #3784fb 100%);
|
||||
border-radius: 12rpx;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:active {
|
||||
transform: scale(0.98);
|
||||
opacity: 0.9;
|
||||
box-shadow: 0 2rpx 8rpx rgba(55, 132, 251, 0.2);
|
||||
}
|
||||
|
||||
// 检索按钮样式
|
||||
&.search-btn {
|
||||
background: #fff7eb;
|
||||
color: #fa8c16;
|
||||
border: 2rpx solid #fa8c16;
|
||||
box-shadow: none;
|
||||
|
||||
&:active {
|
||||
background: #fff3e0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.card-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
|
||||
.title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #262626;
|
||||
position: relative;
|
||||
padding-left: 24rpx;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
width: 6rpx;
|
||||
height: 28rpx;
|
||||
background: #3784fb;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.header-action {
|
||||
color: #007aff;
|
||||
padding-left: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.card {
|
||||
height: 77vh;
|
||||
padding: 24rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
|
||||
margin-bottom: 24rpx;
|
||||
overflow: hidden;
|
||||
/* 超出隐藏 */
|
||||
|
||||
.card-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
|
||||
.title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #262626;
|
||||
position: relative;
|
||||
padding-left: 24rpx;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
width: 6rpx;
|
||||
height: 28rpx;
|
||||
background: #3784fb;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.header-action {
|
||||
color: #007aff;
|
||||
padding-left: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-container {
|
||||
padding: 24rpx;
|
||||
height: 85%;
|
||||
|
||||
.table-list-item {
|
||||
margin: 24rpx 0;
|
||||
padding: 24rpx;
|
||||
background-color: #fff;
|
||||
min-height: 300rpx;
|
||||
border-radius: 20rpx;
|
||||
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.06);
|
||||
transition: all 0.3s ease;
|
||||
|
||||
.title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
// margin-bottom: 20rpx;
|
||||
|
||||
.title-left {
|
||||
.code {
|
||||
font-size: 32rpx;
|
||||
font-weight: 300;
|
||||
color: #3784fb;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
}
|
||||
|
||||
span.status {
|
||||
padding: 8rpx 28rpx;
|
||||
border-radius: 8rpx;
|
||||
font-size: 26rpx;
|
||||
font-weight: 600;
|
||||
|
||||
&.completed {
|
||||
background-color: rgba(82, 196, 26, 0.1);
|
||||
color: #52c41a;
|
||||
}
|
||||
|
||||
&.pending {
|
||||
background-color: rgba(250, 140, 22, 0.1);
|
||||
color: #fa8c16;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.line {
|
||||
margin: 24rpx 0;
|
||||
height: 2rpx;
|
||||
background: linear-gradient(90deg,
|
||||
rgba(232, 232, 232, 0) 0%,
|
||||
rgba(232, 232, 232, 1) 50%,
|
||||
rgba(232, 232, 232, 0) 100%);
|
||||
}
|
||||
|
||||
:deep(.uni-row) {
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.uni-col-6 {
|
||||
color: #8c8c8c;
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
.cont {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
line-height: 1.8;
|
||||
color: #262626;
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.loading-text {
|
||||
text-align: center;
|
||||
font-size: 26rpx;
|
||||
color: #8c8c8c;
|
||||
padding: 32rpx 0;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.form-item {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.count-input {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.footer-btn {
|
||||
margin-top: auto;
|
||||
padding: 32rpx;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 92%;
|
||||
z-index: 999;
|
||||
/* 保证在顶层 */
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
.btn-cont {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
text-align: center;
|
||||
background: linear-gradient(135deg, #4b8eff 0%, #3784fb 100%);
|
||||
color: #fff;
|
||||
border-radius: 44rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
||||
|
||||
&:active {
|
||||
transform: scale(0.98);
|
||||
opacity: 0.9;
|
||||
box-shadow: 0 2rpx 8rpx rgba(55, 132, 251, 0.2);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,472 @@
|
|||
<template>
|
||||
<view class="page-container">
|
||||
<!-- 任务信息 -->
|
||||
<div class="card-container">
|
||||
<div class="card-header" @click="toggleCollapse">
|
||||
<span class="title">任务信息</span>
|
||||
<span style="color: #007AFF">{{ collapsed ? '展开' : '收起' }}</span>
|
||||
</div>
|
||||
|
||||
<view v-show="!collapsed">
|
||||
<uni-forms :model="item" label-width="170rpx" :border="true">
|
||||
<uni-forms-item label="单位：" name="unitName">
|
||||
<span class="form-item">{{ item.unitName }}</span>
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="工程：" name="proName">
|
||||
<span class="form-item">{{ item.proName }}</span>
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="单号：" name="code">
|
||||
<span class="form-item">{{ item.code }}</span>
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="人员：" name="fieldPerson">
|
||||
<span class="form-item">{{ item.fieldPerson }}</span>
|
||||
</uni-forms-item>
|
||||
<uni-forms-item label="电话：" name="phone">
|
||||
<span class="form-item">{{ item.phone }}</span>
|
||||
</uni-forms-item>
|
||||
</uni-forms>
|
||||
</view>
|
||||
</div>
|
||||
|
||||
<!-- 维修物资 -->
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<span class="title">维修物资</span>
|
||||
</div>
|
||||
<div class="select-area">
|
||||
<uni-row :gutter="24" style="display: flex; align-items: center">
|
||||
<uni-col :span="10">
|
||||
<view>
|
||||
<uni-data-select v-model="typeId" placeholder="请选择物资类型" :localdata="maTypeSelectList"
|
||||
@change="getMaCode" filterable>
|
||||
</uni-data-select>
|
||||
</view>
|
||||
</uni-col>
|
||||
<uni-col :span="10">
|
||||
<view>
|
||||
<uni-data-select v-model="typeCode" placeholder="请选择规格型号" :localdata="maCodeSelectList"
|
||||
@change="selectMaCode">
|
||||
</uni-data-select>
|
||||
</view>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
</div>
|
||||
<scroll-view scroll-y class="scroll-container" @scrolltolower="onScrollTolower">
|
||||
<view v-for="(item, index) in typeList" :key="index" class="table-list-item">
|
||||
<div class="title">
|
||||
<div class="title-left">
|
||||
<span class="code">{{ item.materialName }}</span>
|
||||
</div>
|
||||
<div class="status-tag">
|
||||
<view @click.stop="deleteItem(item)" style="padding-right: 10rpx;">
|
||||
<uni-icons type="trash" size="24" color="#ff0000" />
|
||||
</view>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<view class="line"></view>
|
||||
<template v-for="field in fieldMap" :key="field.label">
|
||||
<uni-row :gutter="24">
|
||||
<uni-col :span="field.labelSpan">{{ field.label }}：</uni-col>
|
||||
<uni-col :span="field.valueSpan">
|
||||
<view class="cont">
|
||||
{{ field.formatter ? field.formatter(item[field.key]) : (item[field.key] ?? field.default ?? '无') }}
|
||||
</view>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
</template>
|
||||
<uni-row :gutter="24">
|
||||
<uni-col :span="8">配件数量：</uni-col>
|
||||
<uni-col :span="16">
|
||||
<view class="cont">
|
||||
<uni-data-select v-model="item.charge" placeholder="请选择规格型号" :localdata="charge"
|
||||
@change="selectMaCode">
|
||||
</uni-data-select>
|
||||
</view>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
<uni-row :gutter="24">
|
||||
<uni-col :span="8">配件数量：</uni-col>
|
||||
<uni-col :span="16">
|
||||
<view class="cont">
|
||||
<uni-easyinput type="number" v-model="item.preNum" @input="onChangeNumber(item)"
|
||||
placeholder="输入数值" style="flex: 1;" />
|
||||
</view>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</div>
|
||||
|
||||
<!-- 底部按钮 -->
|
||||
<div class="footer-btn">
|
||||
<button class="btn-cont" @click="submitNum">确认</button>
|
||||
</div>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
reactive
|
||||
} from 'vue'
|
||||
import {
|
||||
onLoad
|
||||
} from '@dcloudio/uni-app'
|
||||
import {
|
||||
getUseType,
|
||||
insertDetails
|
||||
} from '@/services/fieldMaintenance/fieldMaintenance.js'
|
||||
const maCodeSelectList = ref([])
|
||||
const charge = ref([{
|
||||
value: 1,
|
||||
text: '是',
|
||||
}, {
|
||||
value: 0,
|
||||
text: '否',
|
||||
}])
|
||||
const maTypeSelectList = ref([])
|
||||
const item = ref({})
|
||||
const typeId = ref("") //类型
|
||||
const typeCode = ref("") //规格型号
|
||||
const collapsed = ref(true)
|
||||
const typeList = ref([])
|
||||
const fieldMap = [{
|
||||
label: '规格型号',
|
||||
key: 'typeName',
|
||||
labelSpan: 8,
|
||||
valueSpan: 16
|
||||
},
|
||||
{
|
||||
label: '在用数',
|
||||
key: 'num',
|
||||
labelSpan: 8,
|
||||
valueSpan: 16
|
||||
}
|
||||
]
|
||||
const getMaType = () => {
|
||||
let obj = {
|
||||
"agreementId": item.value.agreementId,
|
||||
}
|
||||
getUseType(obj).then(res => {
|
||||
console.log(res)
|
||||
maTypeSelectList.value = res.data.map(option => {
|
||||
return {
|
||||
value: option.typeId,
|
||||
text: option.typeName,
|
||||
}
|
||||
});
|
||||
}).catch(error => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
//规格
|
||||
const getMaCode = () => {
|
||||
let obj = {
|
||||
"agreementId": item.value.agreementId,
|
||||
"typeId": typeId.value
|
||||
}
|
||||
getUseType(obj).then(res => {
|
||||
console.log(res)
|
||||
maCodeSelectList.value = res.data.map(option => {
|
||||
let obj = {
|
||||
...option,
|
||||
bmFileInfos: [],
|
||||
value: option.typeId,
|
||||
text: option.typeName,
|
||||
}
|
||||
return obj
|
||||
});
|
||||
}).catch(error => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
const generateUniqueId = () => {
|
||||
return Date.now().toString(36) + Math.random().toString(36).substr(2, 5);
|
||||
};
|
||||
|
||||
const deleteItem = (item) => {
|
||||
typeList.value = typeList.value.filter(i => i.itemId !== item.itemId);
|
||||
};
|
||||
|
||||
// 选择规格型号
|
||||
const selectMaCode = (e) => {
|
||||
const matched = maCodeSelectList.value.find(item => item.typeId == e);
|
||||
if (matched) {
|
||||
const itemCopy = JSON.parse(JSON.stringify(matched));
|
||||
itemCopy.itemId = generateUniqueId();
|
||||
itemCopy.preNum = 0;
|
||||
itemCopy.charge = 0;
|
||||
itemCopy.taskId = item.value.id;
|
||||
typeList.value.push(itemCopy);
|
||||
}
|
||||
console.log(typeList.value);
|
||||
};
|
||||
|
||||
const toggleCollapse = () => (collapsed.value = !collapsed.value)
|
||||
const onChangeNumber = (item) => {
|
||||
console.log(item)
|
||||
let maxNum = Number(item.num)
|
||||
// outboundNum.value
|
||||
setTimeout(() => {
|
||||
if (item.unitValue == 1) {
|
||||
item.preNum = Number(String(item.preNum).replace(/[^\d.]/g, ''))
|
||||
} else {
|
||||
item.preNum = Number(String(item.preNum).replace(/[^\d]/g, ''))
|
||||
}
|
||||
if (Number(item.preNum) <= 0) {
|
||||
item.preNum = 0;
|
||||
}
|
||||
if (Number(item.preNum) > maxNum) {
|
||||
uni.showToast({
|
||||
title: '已达到当前资最大在用数量！',
|
||||
icon: 'none',
|
||||
})
|
||||
item.preNum = maxNum;
|
||||
}
|
||||
}, 500)
|
||||
}
|
||||
|
||||
const submitNum = () => {
|
||||
console.log(item)
|
||||
const jsonData = JSON.stringify(typeList.value);
|
||||
console.log(jsonData)
|
||||
insertDetails(JSON.parse(jsonData)).then(res => {
|
||||
if(res.code==200){
|
||||
uni.showToast({ title: '编辑成功', icon: 'none' })
|
||||
uni.navigateBack({
|
||||
delta: 1 // 返回到已存在的页面
|
||||
});
|
||||
}else{
|
||||
uni.showToast({ title: res.msg, icon: 'none' })
|
||||
}
|
||||
}).catch(error => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
|
||||
onLoad((options) => {
|
||||
item.value = JSON.parse(options.item)
|
||||
getMaType()
|
||||
})
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.page-container {
|
||||
display: flex;
|
||||
height: 97vh;
|
||||
padding: 24rpx;
|
||||
flex-direction: column;
|
||||
background-color: #f7f8fa;
|
||||
|
||||
.card-container {
|
||||
padding: 24rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
|
||||
margin-bottom: 24rpx;
|
||||
|
||||
.card-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
|
||||
.title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #262626;
|
||||
position: relative;
|
||||
padding-left: 24rpx;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
width: 6rpx;
|
||||
height: 28rpx;
|
||||
background: #3784fb;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.header-action {
|
||||
color: #007aff;
|
||||
padding-left: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.card {
|
||||
height: 77vh;
|
||||
padding: 24rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.06);
|
||||
margin-bottom: 24rpx;
|
||||
overflow: hidden;
|
||||
/* 超出隐藏 */
|
||||
|
||||
.card-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
|
||||
.title {
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #262626;
|
||||
position: relative;
|
||||
padding-left: 24rpx;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
width: 6rpx;
|
||||
height: 28rpx;
|
||||
background: #3784fb;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.header-action {
|
||||
color: #007aff;
|
||||
padding-left: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-container {
|
||||
padding: 24rpx;
|
||||
height: 85%;
|
||||
|
||||
.table-list-item {
|
||||
margin: 24rpx 0;
|
||||
padding: 24rpx;
|
||||
background-color: #fff;
|
||||
min-height: 300rpx;
|
||||
border-radius: 20rpx;
|
||||
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.06);
|
||||
transition: all 0.3s ease;
|
||||
|
||||
.title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
// margin-bottom: 20rpx;
|
||||
|
||||
.title-left {
|
||||
.code {
|
||||
font-size: 32rpx;
|
||||
font-weight: 300;
|
||||
color: #3784fb;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
}
|
||||
|
||||
span.status {
|
||||
padding: 8rpx 28rpx;
|
||||
border-radius: 8rpx;
|
||||
font-size: 26rpx;
|
||||
font-weight: 600;
|
||||
|
||||
&.completed {
|
||||
background-color: rgba(82, 196, 26, 0.1);
|
||||
color: #52c41a;
|
||||
}
|
||||
|
||||
&.pending {
|
||||
background-color: rgba(250, 140, 22, 0.1);
|
||||
color: #fa8c16;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.line {
|
||||
margin: 24rpx 0;
|
||||
height: 2rpx;
|
||||
background: linear-gradient(90deg,
|
||||
rgba(232, 232, 232, 0) 0%,
|
||||
rgba(232, 232, 232, 1) 50%,
|
||||
rgba(232, 232, 232, 0) 100%);
|
||||
}
|
||||
|
||||
:deep(.uni-row) {
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.uni-col-6 {
|
||||
color: #8c8c8c;
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
.cont {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
line-height: 1.8;
|
||||
color: #262626;
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.loading-text {
|
||||
text-align: center;
|
||||
font-size: 26rpx;
|
||||
color: #8c8c8c;
|
||||
padding: 32rpx 0;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.form-item {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.count-input {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.footer-btn {
|
||||
margin-top: auto;
|
||||
padding: 32rpx;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 92%;
|
||||
z-index: 999;
|
||||
/* 保证在顶层 */
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
.btn-cont {
|
||||
width: 100%;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
text-align: center;
|
||||
background: linear-gradient(135deg, #4b8eff 0%, #3784fb 100%);
|
||||
color: #fff;
|
||||
border-radius: 44rpx;
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
||||
|
||||
&:active {
|
||||
transform: scale(0.98);
|
||||
opacity: 0.9;
|
||||
box-shadow: 0 2rpx 8rpx rgba(55, 132, 251, 0.2);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,577 @@
|
|||
<template>
|
||||
<view class="page-container">
|
||||
<!-- Tab 切换 -->
|
||||
<view class="complete-btn">
|
||||
<view class="btn" :class="{ active: active === 1 }" @click="changeTab(1)">
|
||||
<span>未完成</span>
|
||||
<view v-if="active === 1" class="bt-line"></view>
|
||||
</view>
|
||||
<view class="btn" style="margin-left: 120rpx" :class="{ active: active === 2 }" @click="changeTab(2)">
|
||||
<span>已完成</span>
|
||||
<view v-if="active === 2" class="bt-line"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 日期范围 -->
|
||||
<uni-row class="search-form">
|
||||
<uni-col :span="24">
|
||||
<uni-datetime-picker v-model="dateArray" type="daterange" placeholder="选择日期范围" @change="onChangeDate"
|
||||
@maskClick="maskClick" />
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
|
||||
<!-- 搜索框 -->
|
||||
<uni-row :gutter="24" class="search-form">
|
||||
<uni-col :span="16">
|
||||
<uni-easyinput v-model="queryParams.keyWord" placeholder="请输入内容" />
|
||||
</uni-col>
|
||||
<uni-col :span="4">
|
||||
<view class="search" @click="onSearchBtn">搜索</view>
|
||||
</uni-col>
|
||||
<uni-col :span="4">
|
||||
<view class="add" @click="handleAdded">新增</view>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
|
||||
<!-- 列表区域 -->
|
||||
<scroll-view scroll-y class="scroll-container" @scrolltolower="onScrollTolower">
|
||||
<view v-for="(item, index) in tableList" :key="index" class="table-list-item" @click="handleItem(item)">
|
||||
<div class="title">
|
||||
<div class="title-left">
|
||||
<span class="code">{{ item.code }}</span>
|
||||
</div>
|
||||
<div class="status-tag">
|
||||
<view @click.stop="submitItem(item)" v-show="item.taskStatus === '0'" style="padding-right: 10rpx;">
|
||||
<uni-icons type="paperplane" size="24" color="#00aa00" />
|
||||
</view>
|
||||
<view @click.stop="deleteItem(item)" v-show="item.taskStatus === '0'" style="padding-right: 10rpx;">
|
||||
<uni-icons type="trash" size="24" color="#ff0000" />
|
||||
</view>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<view class="line"></view>
|
||||
<template v-for="field in fieldMap" :key="field.label">
|
||||
<uni-row :gutter="24">
|
||||
<uni-col :span="field.labelSpan">{{ field.label }}：</uni-col>
|
||||
<uni-col :span="field.valueSpan">
|
||||
<view class="cont">{{ item[field.key] }}</view>
|
||||
</uni-col>
|
||||
</uni-row>
|
||||
</template>
|
||||
</view>
|
||||
<view class="loading-text">{{ finish ? '没有更多数据了~' : '正在加载...' }}</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
computed
|
||||
} from 'vue'
|
||||
|
||||
import {
|
||||
getList,
|
||||
deleteFieldApplyInfoById,
|
||||
submitTask
|
||||
} from '@/services/fieldMaintenance/fieldMaintenance.js'
|
||||
import {
|
||||
onShow
|
||||
} from '@dcloudio/uni-app'
|
||||
import {
|
||||
debounce
|
||||
} from 'lodash-es'
|
||||
|
||||
const total = ref(0)
|
||||
const active = ref(1)
|
||||
const tableList = ref([])
|
||||
const dateArray = ref([])
|
||||
|
||||
const queryParams = ref({
|
||||
startTime: '',
|
||||
endTime: '',
|
||||
keyWord: '',
|
||||
taskStatus: 0,
|
||||
pageNum: 1,
|
||||
pageSize: 3
|
||||
})
|
||||
|
||||
const fieldMap = [{
|
||||
label: '任务时间',
|
||||
key: 'createTime',
|
||||
labelSpan: 6,
|
||||
valueSpan: 18
|
||||
},
|
||||
{
|
||||
label: '维修物资',
|
||||
key: 'typeNames',
|
||||
labelSpan: 6,
|
||||
valueSpan: 18
|
||||
},
|
||||
{
|
||||
label: '单位名称',
|
||||
key: 'unitName',
|
||||
labelSpan: 6,
|
||||
valueSpan: 18
|
||||
},
|
||||
{
|
||||
label: '工程名称',
|
||||
key: 'proName',
|
||||
labelSpan: 6,
|
||||
valueSpan: 18
|
||||
},
|
||||
{
|
||||
label: '创建人',
|
||||
key: 'createBy',
|
||||
labelSpan: 6,
|
||||
valueSpan: 18
|
||||
},
|
||||
{
|
||||
label: '维修数量',
|
||||
key: 'num',
|
||||
labelSpan: 6,
|
||||
valueSpan: 18
|
||||
},
|
||||
]
|
||||
|
||||
const submitItem = item => {
|
||||
submitTask({
|
||||
taskId: item.taskId
|
||||
}).then(res => {
|
||||
if (res.code == 200) {
|
||||
uni.showToast({
|
||||
title: '提交成功',
|
||||
icon: 'none'
|
||||
})
|
||||
getTableList(true)
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '提交失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
const deleteItem = item => {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确定要删除该条记录吗？',
|
||||
confirmText: '删除',
|
||||
cancelText: '取消',
|
||||
success: res => {
|
||||
if (res.confirm) {
|
||||
// 用户点击了“删除”
|
||||
deleteFieldApplyInfoById({
|
||||
id: item.id,
|
||||
taskId: item.taskId
|
||||
}).then(res => {
|
||||
if (res.code == 200) {
|
||||
uni.showToast({
|
||||
title: '刪除成功',
|
||||
icon: 'none'
|
||||
})
|
||||
getTableList(true)
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '刪除失败',
|
||||
icon: 'none'
|
||||
})
|
||||
}
|
||||
}).catch(error => {
|
||||
console.log(error)
|
||||
})
|
||||
}
|
||||
// 用户点击了“取消”时不做任何处理
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
const onChangeDate = val => {
|
||||
const [start, end] = val
|
||||
queryParams.value.startTime = start
|
||||
queryParams.value.endTime = end
|
||||
}
|
||||
|
||||
const onSearchBtn = () => {
|
||||
queryParams.value.pageNum = 1
|
||||
tableList.value = []
|
||||
getTableList(true)
|
||||
}
|
||||
|
||||
const getTableList = async (isTap = false) => {
|
||||
const res = await getList(queryParams.value)
|
||||
total.value = res.data.total
|
||||
if (isTap) {
|
||||
tableList.value = res.data.rows
|
||||
} else {
|
||||
tableList.value.push(...res.data.rows)
|
||||
}
|
||||
}
|
||||
|
||||
onShow(() => {
|
||||
tableList.value = []
|
||||
total.value = 0
|
||||
getTableList(true)
|
||||
})
|
||||
|
||||
const onScrollTolower = debounce(() => {
|
||||
if (total.value > tableList.value.length) {
|
||||
queryParams.value.pageNum++
|
||||
getTableList()
|
||||
}
|
||||
}, 500)
|
||||
|
||||
const changeTab = index => {
|
||||
active.value = index
|
||||
queryParams.value.taskStatus = index === 1 ? 0 : 2
|
||||
queryParams.value.pageNum = 1
|
||||
getTableList(true)
|
||||
}
|
||||
|
||||
const handleAdded = () => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/repair/fieldMaintenance/added'
|
||||
})
|
||||
}
|
||||
|
||||
const handleItem = item => {
|
||||
uni.navigateTo({
|
||||
url: `/pages/repair/fieldMaintenance/detail?item=${JSON.stringify(item)}`
|
||||
})
|
||||
}
|
||||
|
||||
const finish = computed(() => total.value === tableList.value.length)
|
||||
|
||||
const maskClick = () => {}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.title-left {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.code {
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #3784fb;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
|
||||
.sub-code {
|
||||
font-size: 28rpx;
|
||||
/* 比主code小一点 */
|
||||
color: #8c8c8c;
|
||||
/* 灰色更柔和 */
|
||||
margin-top: 4rpx;
|
||||
/* 与主code有一点间距 */
|
||||
}
|
||||
}
|
||||
|
||||
.status-tag {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.page-container {
|
||||
display: flex;
|
||||
height: 100vh;
|
||||
padding: 24rpx;
|
||||
flex-direction: column;
|
||||
background-color: #f7f8fa;
|
||||
|
||||
.complete-btn {
|
||||
display: flex;
|
||||
padding: 20rpx 24rpx;
|
||||
justify-content: center;
|
||||
background: #fff;
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.05);
|
||||
|
||||
.btn {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 0 60rpx;
|
||||
position: relative;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
span {
|
||||
font-size: 32rpx;
|
||||
color: #8c8c8c;
|
||||
font-weight: 500;
|
||||
|
||||
&.active {
|
||||
color: #3784fb;
|
||||
font-weight: 600;
|
||||
|
||||
.second-active & {
|
||||
color: #fa8c16;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bt-line {
|
||||
width: 32rpx;
|
||||
height: 6rpx;
|
||||
background: #3784fb;
|
||||
margin-top: 12rpx;
|
||||
border-radius: 6rpx;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
.second-active & {
|
||||
background: #fa8c16;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search-form {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: #fff;
|
||||
padding: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.05);
|
||||
|
||||
:deep(.uni-easyinput__content),
|
||||
:deep(.uni-date-editor) {
|
||||
background-color: #f7f8fa;
|
||||
border: 2rpx solid #e8e8e8;
|
||||
border-radius: 12rpx;
|
||||
height: 80rpx;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:focus-within {
|
||||
border-color: #3784fb;
|
||||
box-shadow: 0 0 0 2rpx rgba(55, 132, 251, 0.1);
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.uni-date) {
|
||||
width: 100%;
|
||||
|
||||
.uni-date-x {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.uni-date-editor--x {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.uni-date-range--x {
|
||||
width: 100%;
|
||||
|
||||
.uni-date-range--x-input {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 0 24rpx;
|
||||
|
||||
.uni-date-range--x-text {
|
||||
font-size: 28rpx;
|
||||
color: #262626;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.uni-date-x--border {
|
||||
width: 100%;
|
||||
border: 2rpx solid #e8e8e8;
|
||||
border-radius: 12rpx;
|
||||
background-color: #f7f8fa;
|
||||
height: 80rpx;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:focus-within {
|
||||
border-color: #3784fb;
|
||||
box-shadow: 0 0 0 2rpx rgba(55, 132, 251, 0.1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
:deep(.uni-date-editor) {
|
||||
.uni-date-range {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
|
||||
.uni-date-range--text {
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.search {
|
||||
height: 80rpx;
|
||||
background: linear-gradient(135deg, #4b8eff 0%, #3784fb 100%);
|
||||
text-align: center;
|
||||
line-height: 80rpx;
|
||||
color: #fff;
|
||||
border-radius: 12rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:active {
|
||||
transform: translateY(2rpx);
|
||||
opacity: 0.9;
|
||||
}
|
||||
}
|
||||
|
||||
.add {
|
||||
height: 80rpx;
|
||||
background: linear-gradient(135deg, #00aa00 0%, #00aa7f 100%);
|
||||
text-align: center;
|
||||
line-height: 80rpx;
|
||||
color: #fff;
|
||||
border-radius: 12rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: 600;
|
||||
box-shadow: 0 6rpx 20rpx rgba(55, 132, 251, 0.2);
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:active {
|
||||
transform: translateY(2rpx);
|
||||
opacity: 0.9;
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-container {
|
||||
padding: 0 2rpx;
|
||||
|
||||
.table-list-item {
|
||||
margin: 24rpx 0;
|
||||
padding: 32rpx;
|
||||
background-color: #fff;
|
||||
min-height: 300rpx;
|
||||
border-radius: 20rpx;
|
||||
box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.06);
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:active {
|
||||
transform: scale(0.985);
|
||||
background-color: #fafbfc;
|
||||
}
|
||||
|
||||
.title {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.title-left {
|
||||
.code {
|
||||
font-size: 32rpx;
|
||||
font-weight: 600;
|
||||
color: #3784fb;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
}
|
||||
|
||||
span.status {
|
||||
padding: 8rpx 28rpx;
|
||||
border-radius: 8rpx;
|
||||
font-size: 26rpx;
|
||||
font-weight: 600;
|
||||
|
||||
&.completed {
|
||||
background-color: rgba(82, 196, 26, 0.1);
|
||||
color: #52c41a;
|
||||
}
|
||||
|
||||
&.pending {
|
||||
background-color: rgba(250, 140, 22, 0.1);
|
||||
color: #fa8c16;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.line {
|
||||
margin: 24rpx 0;
|
||||
height: 2rpx;
|
||||
background: linear-gradient(90deg,
|
||||
rgba(232, 232, 232, 0) 0%,
|
||||
rgba(232, 232, 232, 1) 50%,
|
||||
rgba(232, 232, 232, 0) 100%);
|
||||
}
|
||||
|
||||
:deep(.uni-row) {
|
||||
margin-bottom: 20rpx;
|
||||
|
||||
.uni-col-6 {
|
||||
color: #8c8c8c;
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
|
||||
.cont {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
line-height: 1.8;
|
||||
color: #262626;
|
||||
font-size: 28rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.loading-text {
|
||||
text-align: center;
|
||||
font-size: 26rpx;
|
||||
color: #8c8c8c;
|
||||
padding: 32rpx 0;
|
||||
letter-spacing: 1rpx;
|
||||
}
|
||||
}
|
||||
|
||||
// 优化滑动区域样式
|
||||
:deep(.uni-swipe_action) {
|
||||
border-radius: 20rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.uni-swipe_content {
|
||||
margin: 0 !important;
|
||||
padding: 0;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.uni-swipe_button-group {
|
||||
height: 100%;
|
||||
|
||||
.uni-swipe_button {
|
||||
writing-mode: vertical-rl;
|
||||
padding: 0 24rpx;
|
||||
font-size: 28rpx !important;
|
||||
font-weight: 600;
|
||||
|
||||
// 查看按钮
|
||||
&:nth-child(1) {
|
||||
background: linear-gradient(to bottom, #3ad980, #34C759) !important;
|
||||
}
|
||||
|
||||
// 出库按钮
|
||||
&:nth-child(2) {
|
||||
background: linear-gradient(to bottom, #3b95ff, #007AFF) !important;
|
||||
}
|
||||
|
||||
&:active {
|
||||
opacity: 0.85;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,121 @@
|
|||
import {
|
||||
http
|
||||
} from '@/utils/http'
|
||||
|
||||
// 退料任务列表接口
|
||||
export const getList = (data) => {
|
||||
return http({
|
||||
method: 'GET',
|
||||
url: '/material/field_apply_info/list',
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
|
||||
// 单位下拉选
|
||||
export const getUnitList = (data) => {
|
||||
return http({
|
||||
method: 'POST',
|
||||
url: '/material/select/getUnitList',
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
|
||||
// 工程下拉选
|
||||
export const getProjectList = (data) => {
|
||||
return http({
|
||||
method: 'POST',
|
||||
url: '/material/select/getProjectList',
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
|
||||
// 获取协议id
|
||||
export const getAgreementInfoById = (data) => {
|
||||
return http({
|
||||
method: 'POST',
|
||||
url: '/material/select/getAgreementInfoById',
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
|
||||
// 新增退料单-无设备
|
||||
export const insert = (data) => {
|
||||
return http({
|
||||
method: 'POST',
|
||||
url: '/material/field_apply_info/insert',
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
|
||||
//删除
|
||||
export const deleteFieldApplyInfoById = (data) => {
|
||||
return http({
|
||||
method: 'POST',
|
||||
url: '/material/field_apply_info/deleteFieldApplyInfoById',
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
|
||||
export const deleteFieldApplyDetailsById = (data) => {
|
||||
return http({
|
||||
method: 'POST',
|
||||
url: '/material/field_apply_info/deleteFieldApplyDetailsById',
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
|
||||
export const insertBack = (data) => {
|
||||
return http({
|
||||
method: 'POST',
|
||||
url: '/material/back_apply_info',
|
||||
data:data,
|
||||
})
|
||||
}
|
||||
|
||||
export const submitTask = (data) => {
|
||||
return http({
|
||||
method: 'POST',
|
||||
url: '/material/field_apply_info/submitTask',
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
|
||||
export const getListDetails = (data) => {
|
||||
return http({
|
||||
method: 'GET',
|
||||
url: '/material/field_apply_info/listDetails',
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
|
||||
export const getUseType = (data) => {
|
||||
return http({
|
||||
method: 'POST',
|
||||
url: '/material/select/getUseType',
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
|
||||
export const getMachine = (data) => {
|
||||
return http({
|
||||
method: 'GET',
|
||||
url: '/material/back_apply_info/getMachine',
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
|
||||
export const getMachineByQrCodeApi = (data) => {
|
||||
return http({
|
||||
method: 'GET',
|
||||
url: '/material/back_apply_info/getMachine',
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
|
||||
export const insertDetails =(data) =>{
|
||||
return http({
|
||||
method: 'POST',
|
||||
url: '/material/field_apply_info/insertDetails',
|
||||
data: data,
|
||||
})
|
||||
}
|
||||
Loading…
Reference in New Issue