xiangyuan-app/src/pages/dig/task/building.vue

<template>
  <view class="main">
    <view class="img-banner">
      <image mode="aspectFill" src="https://mn.wenlvti.net/app_static/xiangan/banner_dig_building.jpg"></image>
    </view>
    <view class="task-list">
      <view v-if="canCollect('distribution')" class="item">
        <text class="iconfont icon-task-building-1"></text>
        <view class="info">
          <view class="title">建筑分布</view>
          <view class="desc">村落内传统建筑分布情况</view>
        </view>
        <view class="btn" @click="goForm('distribution', 0)">
          填写
        </view>
      </view>
      <view class="item">
        <text class="iconfont icon-task-building-2"></text>
        <view class="info">
          <view class="title">文物建筑</view>
          <view class="desc">历史、艺术、科学价值</view>
        </view>
        <view class="btn" @click="goForm('building', 1, 'nature')">
          填写
        </view>
      </view>
      <view class="item">
        <text class="iconfont icon-task-building-3"></text>
        <view class="info">
          <view class="title">历史建筑</view>
          <view class="desc">重大历史事件记录</view>
        </view>
        <view class="btn" @click="goForm('building', 2, 'nature')">
          填写
        </view>
      </view>
      <view class="item">
        <text class="iconfont icon-task-building-4"></text>
        <view class="info">
          <view class="title">重要传统建筑</view>
          <view class="desc">重要传统建筑的信息</view>
        </view>
        <view class="btn" @click="goForm('building', 3, 'nature')">
          填写
        </view>
      </view>
    </view>
  </view>
</template>

<script setup lang="ts">
import { useCollectStore } from '@/store/collect';
import { useTaskEntryForm } from '../composeable/TaskEntryForm';

const { goForm } = useTaskEntryForm();
const { canCollect } = useCollectStore();
</script>