You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
134 lines
3.5 KiB
134 lines
3.5 KiB
<template> |
|
<view class="inspection-task-input" @tap="show = true"> |
|
<view> |
|
<view v-if="text">{{ text }}</view> |
|
<view class="inspection-task-input_placeholder" v-else>请关联督察任务</view> |
|
</view> |
|
<view class="inspection-task-input_icon"> |
|
<uni-icons type="down" v-if="!text"></uni-icons> |
|
</view> |
|
</view> |
|
<view class="inspection-task-dialog" v-if="show"> |
|
<view class="flex search"> |
|
<view class="search-item flex justify-center" :search="searchFlag"> |
|
<view class="flex gap-8 search-item-conent"> |
|
<uni-easyinput prefixIcon="search" type="text" placeholder="搜索" :inputBorder="false" v-model="query.taskName" @focus="searchFlag = true" /> |
|
</view> |
|
</view> |
|
<view class="search-item flex justify-center" v-if="!searchFlag"> |
|
<view class="flex gap-8 search-item-conent"> |
|
<uni-icons customPrefix="customicons" type="filter" size="20" color="#666" /> |
|
<view>筛选</view> |
|
</view> |
|
</view> |
|
<view v-else> |
|
<view class="cancel-btn" @tap="cancleSearch">取消</view> |
|
</view> |
|
</view> |
|
<view class="inspection-task-container"> |
|
<view v-for="item in tasks" class="inspection-task-item" @tap="handleSelect(item)"> |
|
<view class="row"> |
|
<view class="col col-24"> |
|
<view class="label">任务名称：</view> |
|
<view class="content">{{ item.taskName }}</view> |
|
</view> |
|
<view class="col col-24"> |
|
<view class="label">参与人员：</view> |
|
<view class="content">{{ item.persons }}</view> |
|
</view> |
|
<view class="col col-24"> |
|
<view class="label">督察单位：</view> |
|
<view class="content">{{ item.supDepartName }}</view> |
|
</view> |
|
<view class="col col-24"> |
|
<view class="label">任务类型：</view> |
|
<view class="content">{{ item.supervisionType }}</view> |
|
</view> |
|
<view class="col col-24"> |
|
<view class="label">任务内容：</view> |
|
<view class="content">{{ item.taskContent }}</view> |
|
</view> |
|
<view class="col col-24"> |
|
<view class="label">督察时间：</view> |
|
<view class="content">{{ item.beginTime }} ~ {{ item.endTime }}</view> |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
<view class="footer col-24"> |
|
<button type="primary" @click="handleAdd">创建督察任务</button> |
|
</view> |
|
</view> |
|
</template> |
|
|
|
<script setup> |
|
import { ref, defineProps, defineEmits, onMounted } from 'vue'; |
|
import { listInspection } from '@/api/inspection' |
|
|
|
defineProps({ |
|
modelValue: { |
|
type: Object |
|
} |
|
}) |
|
const emit = defineEmits(['update:modelValue']); |
|
|
|
const show = ref(false); |
|
const query = ref({}); |
|
const searchFlag = ref(false) |
|
const tasks = ref([]); |
|
const text = ref('') |
|
|
|
function cancleSearch() { |
|
searchFlag.value = false |
|
} |
|
|
|
onMounted(() => { |
|
listInspection(query.value).then(data => { |
|
tasks.value = data.records |
|
}) |
|
}) |
|
|
|
function handleSelect(item) { |
|
text.value = item.taskName; |
|
emit('update:modelValue', item.id); |
|
show.value = false |
|
} |
|
</script> |
|
|
|
<style lang="scss"> |
|
.inspection-task-input { |
|
width: 100%; |
|
display: flex; |
|
justify-content: space-between; |
|
padding-right: 10px; |
|
.inspection-task-input_placeholder { |
|
font-size: 12px; |
|
color: grey; |
|
padding-left: 6px; |
|
} |
|
.inspection-task-input_icon { |
|
.uni-icons { |
|
color: #666 !important; |
|
} |
|
} |
|
} |
|
.inspection-task-dialog { |
|
background-color: #fff; |
|
position: fixed; |
|
top: 0; |
|
/* #ifdef H5 */ |
|
top: 44px; |
|
/* #endif */ |
|
left: 0; |
|
right: 0; |
|
bottom: 0; |
|
z-index: 9999; |
|
} |
|
.inspection-task-container { |
|
padding: 0 24rpx; |
|
.inspection-task-item { |
|
padding: 24rpx 0; |
|
box-shadow: inset 0 -1px 0 0 #DDDDDD; |
|
} |
|
} |
|
</style> |