投票小程序的界面怎么设计和弄一个实现

// 显示 loading 提示框
      wx.showLoading({
        title: '加载活动中'
      });
      // 数据库集合的聚合操作实例 
      voteActivity
      .doc(id)
      .get()
      .then(res => {
        // 获取集合数据，或获取根据查询条件筛选后的集合数据。
        let data = res.data || {};
        let activityInfo = data;
  
        // 隐藏 loading 提示框
        wx.hideLoading();
      })

// 连接云数据库
const db = wx.cloud.database();
// 获取集合的引用
const voteWorks = db.collection('voteWorks');
// 数据库操作符
const _ = db.command;

// 显示 loading 提示框
wx.showLoading({
  title: '拼命加载中'
});
// 数据库集合的聚合操作实例
voteWorks
  .where({
  _id: _.exists(true)
})
  .orderBy('name', 'desc')
  .get()
  .then(res => {
  // 获取集合数据，或获取根据查询条件筛选后的集合数据。
  let data = res.data || [];

  // 将数据从逻辑层发送到视图层，通俗的说，也就是更新数据到页面展示
  this.setData({
    participantList:data
  });

  // 隐藏 loading 提示框
  wx.hideLoading();
})