/> | /> | ||||
</n-form-item> | </n-form-item> | ||||
<n-form-item label="问题描述:"> | <n-form-item label="问题描述:"> | ||||
<span>{{ form.content }}</span> | |||||
<span>{{ form.questionDesc }}</span> | |||||
</n-form-item> | </n-form-item> | ||||
<n-form-item label="经纬度:"> | <n-form-item label="经纬度:"> | ||||
<span>{{ form.longitude }},{{ form.latitude }}</span> | |||||
<span>{{ form.lng }},{{ form.lat }}</span> | |||||
</n-form-item> | </n-form-item> | ||||
<n-form-item label="问题图片:"> | <n-form-item label="问题图片:"> | ||||
<img class="image_size" :src="form.fileImage" alt="" style="width: 108px; height: auto; margin: 0 5px 5px 0"> | |||||
<img class="image_size" :src="form.fileMarkerUrl" alt="" style="width: 108px; height: auto; margin: 0 5px 5px 0"> | |||||
</n-form-item> | </n-form-item> | ||||
</n-form> | </n-form> | ||||
</div> | </div> | ||||
</template> | </template> | ||||
<script> | <script> | ||||
import { toRefs, reactive, watch, inject } from 'vue' | import { toRefs, reactive, watch, inject } from 'vue' | ||||
import { QUESTION_TYPE } from '@/utils/dictionary.js' | |||||
export default { | export default { | ||||
name: 'OverLay', | name: 'OverLay', | ||||
props: { | props: { | ||||
setup(props, { emit }) { | setup(props, { emit }) { | ||||
const data = reactive({ | const data = reactive({ | ||||
form: {}, | form: {}, | ||||
typeList: [ | |||||
{ value: 1, label: '林斑' }, | |||||
{ value: 2, label: '病虫害' } | |||||
] | |||||
typeList: [] | |||||
}) | }) | ||||
/* 引入祖先组件注册的方法 */ | /* 引入祖先组件注册的方法 */ | ||||
const confirm = inject('confirm', null) | |||||
const ignore = inject('ignore', null) | |||||
const handleRow = inject('handleRow', null) | |||||
watch(() => props.data, () => { | watch(() => props.data, () => { | ||||
data.typeList = QUESTION_TYPE | |||||
data.form = Object.assign({}, props.data) | data.form = Object.assign({}, props.data) | ||||
}) | }) | ||||
const updateVisible = function() { | const updateVisible = function() { | ||||
emit('close') | emit('close') | ||||
} | } | ||||
function makeSure() { | function makeSure() { | ||||
confirm(data.form) | |||||
handleRow(data.form.id, data.form.type) | |||||
updateVisible() | updateVisible() | ||||
} | } | ||||
function pass() { | function pass() { | ||||
ignore(data.form) | |||||
handleRow(data.form.id, data.form.type) | |||||
updateVisible() | updateVisible() | ||||
} | } | ||||
return { | return { |
if (data.length) { | if (data.length) { | ||||
data.forEach((item) => { | data.forEach((item) => { | ||||
const pointItem = [] | const pointItem = [] | ||||
pointItem.push(parseFloat(item.longitude)) | |||||
pointItem.push(parseFloat(item.latitude)) | |||||
pointItem.push(parseFloat(item.lng)) | |||||
pointItem.push(parseFloat(item.lat)) | |||||
const featureItem = new Feature(new Point(fromLonLat(pointItem))) | const featureItem = new Feature(new Point(fromLonLat(pointItem))) | ||||
points.push(fromLonLat(pointItem)) | points.push(fromLonLat(pointItem)) | ||||
featureItem.setProperties({ item: item, type: 'problem' }, false) | featureItem.setProperties({ item: item, type: 'problem' }, false) |
</template> | </template> | ||||
<script> | <script> | ||||
import { defineComponent, computed, reactive, toRefs, provide } from 'vue' | |||||
import { defineComponent, computed, reactive, toRefs, watch } from 'vue' | |||||
import PositionMsg from '@/components/PositionMsg/index.vue' | import PositionMsg from '@/components/PositionMsg/index.vue' | ||||
export default defineComponent({ | export default defineComponent({ | ||||
}, | }, | ||||
setup(props, { emit }) { | setup(props, { emit }) { | ||||
const data = reactive({ | const data = reactive({ | ||||
problemList: [ | |||||
{ content: '河道内存在水生植被', | |||||
fileImage: 'https://image.t-aaron.com/XJRW20220725103839/2022-07-25-10-41-46_frame-1500-1680_type-水生植被_VMgRwh05s4clHXCu_s-live-XJRW20220725103839-b73c470768f74422b287981fc75c31c3_AI.jpg', | |||||
handlerImage: 'https://image.t-aaron.com/imagedir/kw6vv4m1yw_1658717157035.png', | |||||
handlerResult: '', | |||||
handlerTime: '2022-07-25 10:45:56', | |||||
latitude: '31.829037194418085', | |||||
location: '江苏省南京市江宁区秣陵街道东吉大道', | |||||
longitude: '118.770222690945', | |||||
name: 1, | |||||
status: 1, | |||||
type: 1, | |||||
userName: '运管单位' }, | |||||
{ content: '水生植被', | |||||
fileImage: 'https://image.t-aaron.com/XJRW20220725103839/2022-07-25-10-41-46_frame-1500-1680_type-水生植被_VMgRwh05s4clHXCu_s-live-XJRW20220725103839-b73c470768f74422b287981fc75c31c3_AI.jpg', | |||||
handlerImage: 'https://image.t-aaron.com/imagedir/kw6vv4m1yw_1658717157035.png', | |||||
handlerResult: '', | |||||
handlerTime: '2022-07-25 10:45:56', | |||||
latitude: '31.129037194418085', | |||||
location: '江苏省南京市江宁区秣陵街道东吉大道', | |||||
longitude: '118.880222690945', | |||||
name: 1, | |||||
status: 2, | |||||
type: 2, | |||||
userName: '运管单位' } | |||||
] | |||||
problemList: [] | |||||
}) | |||||
watch(() => props.data, (value) => { | |||||
data.problemList = [value] | |||||
}) | }) | ||||
const confirm = function(params) { | |||||
console.log(params, '确认++++++++++++') | |||||
} | |||||
const ignore = function(params) { | |||||
console.log(params, '忽略------------') | |||||
} | |||||
/* 注册确认方法 */ | |||||
provide('confirm', confirm) | |||||
/* 注册忽略方法 */ | |||||
provide('ignore', ignore) | |||||
/* 获取抽屉的信息 */ | /* 获取抽屉的信息 */ | ||||
const getDrawerOptions = computed(() => { | const getDrawerOptions = computed(() => { | ||||
return { | return { |
import ConfirmModal from './components/ConfirmModal.vue' | import ConfirmModal from './components/ConfirmModal.vue' | ||||
import PositionDrawer from './components/PositionDrawer.vue' | import PositionDrawer from './components/PositionDrawer.vue' | ||||
import { getQuestionList, generateReport } from '@/api/task/index.js' | import { getQuestionList, generateReport } from '@/api/task/index.js' | ||||
import { unref, reactive, toRefs } from 'vue' | |||||
import { unref, reactive, toRefs, provide } from 'vue' | |||||
export default { | export default { | ||||
name: 'QuestionPage', | name: 'QuestionPage', | ||||
components: { HeadSearch, DataTable, ConfirmModal, PositionDrawer }, | components: { HeadSearch, DataTable, ConfirmModal, PositionDrawer }, | ||||
data.handleRowConfirm(data.selectRowKeys) | data.handleRowConfirm(data.selectRowKeys) | ||||
} | } | ||||
/* 调用确认忽略方法 */ | |||||
function batchHandleRow(id, type) { | |||||
data.handleRowConfirm([id], type) | |||||
} | |||||
/* 注册忽略确认方法 */ | |||||
provide('handleRow', batchHandleRow) | |||||
/** | /** | ||||
* @description: 生成报告 | * @description: 生成报告 | ||||
* @return {*} | * @return {*} |