chelvc-custom/src/pages/client/tabBar/mine/TapList.vue

<template>
  <view>
    <!-- 预约列表 -->
    <view class="appointList">
      <template>
        <u-cell
          v-for="item in isLinkList1"
          :key="item.id"
          :border="false"
          :icon="item.icon"
          :title="item.title"
          isLink
          :url="item.url"
        />
      </template>
    </view>

    <view class="other-out-box">
      <u-cell
        v-for="item in isLinkList2"
        :key="item.id"
        :border="false"
        :icon="item.icon"
        :title="item.title"
        :isLink="item.isLink"
        :url="item.url"
        @click="handleCellClick(item)"
      />
    </view>

    <u-modal
      :show="showSwitchDialog"
      :showCancelButton="true"
      :title="title"
      :content="content"
      @confirm="confirmSwitch"
      @cancel="showSwitchDialog = false"
    ></u-modal>
  </view>
</template>

<script>
export default {
  data() {
    return {
      isLinkList1: [
        {
          id: '0',
          icon: 'list-dot',
          title: '预约列表',
          url: '/pages/client/clientUser/mine/appoint/appoint',
        },
        {
          id: '1',
          icon: 'list',
          title: '询价列表',
          url: '/pages/client/clientUser/inquiryList',
        },
      ],
      isLinkList2: [
        {
          id: '0',
          icon: 'home-fill',
          title: '我的店铺',
          url: '',
          isLink: false,
        },
        {
          id: '1',
          icon: 'plus-people-fill',
          title: '我的团队',
          url: '/pages/client/clientUser/myGroup',
          isLink: true,
        },
        {
          id: '2',
          icon: 'server-man',
          title: '客服中心',
          url: '/pages/client/clientUser/serviceCenter',
          isLink: true,
        },
        {
          id: '3',
          icon: 'share-square',
          title: '意见反馈',
          url: '/pages/client/clientUser/mine/setting/feedback',
          isLink: true,
        },
        {
          id: '4',
          icon: 'thumb-up',
          title: '关于我们',
          url: '/pages/client/clientUser/mine/setting/aboutMine',
          isLink: true,
        },
      ],

      showSwitchDialog: false,
      title: '提醒',
      content: '您确定要从用户端切换到商家端吗?',
    };
  },

  methods: {
    handleCellClick(item) {
      console.log('item', item);
      if (item.id == 0) {
        this.showSwitchDialog = true;
      } else {
        console.log('点击了非链接项');
      }
    },

    confirmSwitch() {
      this.showSwitchDialog = false;
      uni.setStorageSync('tabbar_type', false);
      uni.navigateTo({
        url: '/pages/merchant/tabBar/mine/index',
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.appointList {
  margin: 20rpx;
  padding: 20rpx 10rpx;
  border-radius: 10rpx;
  background-color: #fff;
}

.other-out-box {
  margin: 20rpx;
  padding: 20rpx 10rpx;
  border-radius: 10rpx;
  margin-top: 0;
  box-sizing: border-box;
  background-color: $uni-bg-color;
}
</style>