问卷表单

2022-02-07 13:52:43 +08:00
parent a0846e1f12
commit 7db3fdaf00
2 changed files with 116 additions and 46 deletions
--- a/src/sass/AppAskForm/PreviewForm.vue
+++ b/src/sass/AppAskForm/PreviewForm.vue
@@ -21,7 +21,7 @@
        </div>
        <div class="components-item__filed">
          <template v-if="(item.type === 'radio')">
-            <u-radio-group v-model="item.value" wrap>
+            <u-radio-group :value="formInfo[`field_${index}`]" wrap>
              <u-radio :name="field.label" v-for="(field, i) in item.options" :key="i">
                <image :src="field.img[0].url" v-if="field.img.length"/>
                <span>{{ field.label }}</span>
@@ -30,7 +30,7 @@
          </template>
          <template v-if="(item.type === 'checkbox')">
            <u-checkbox-group wrap>
-              <u-checkbox :name="field.label" v-model="field.checked1" v-for="(field, i) in item.options" :key="i">
+              <u-checkbox :name="field.label" :value="formInfo[`field_${index}`].indexOf(field.label)" v-for="(field, i) in item.options" :key="i">
                <image :src="field.img[0].url" v-if="field.img.length"/>
                <span>{{ field.label }}</span>
              </u-checkbox>
@@ -38,24 +38,25 @@
          </template>
          <template v-if="(item.type === 'select')">
            <div class="components-item__select">
-              <span>{{ item.placeholder }}</span>
+              <span>{{ formInfo[`field_${index}`] || item.placeholder }}</span>
              <u-icon name="arrow-down" color="#DEDFDF"/>
            </div>
          </template>
          <template v-if="(item.type === 'upload')">
-            <div class="components-item__select components-item__textarea components-item__upload">
+            <image style="display: block; max-width: 100%;margin: 0 auto" v-if="formInfo[`field_${index}`]" :src="formInfo[`field_${index}`]" />
+            <div v-else class="components-item__select components-item__textarea components-item__upload">
              <image :src="`${$cdn}askform/upload.png`"/>
              <span>选择图片（2M以内）</span>
            </div>
          </template>
          <template v-if="(item.type === 'input')">
            <div class="components-item__select">
-              <span>{{ item.placeholder }}</span>
+              <span>{{ formInfo[`field_${index}`] || item.placeholder }}</span>
            </div>
          </template>
          <template v-if="(item.type === 'textarea')">
            <div class="components-item__select components-item__textarea">
-              <span>{{ item.placeholder }}</span>
+              <span>{{ formInfo[`field_${index}`]|| item.placeholder }}</span>
            </div>
          </template>
        </div>
@@ -97,38 +98,28 @@ export default {
      type: 0,
      id: '',
      touchStart: 0,
-      ...params
+      ...params,
+      formInfo: {}
    }
  },

-  mounted () {
+  onLoad (query) {
    document.title = '表单预览'
+    query.id && this.getInfo(query.id, query.formId)
  },

  methods: {
-    getInfo(id) {
-      uni.showLoading()
-      this.$http.post(`/app/appquestionnairetemplate/queryDetailById?id=${id}`).then(res => {
+    getInfo(id, formId) {
+      this.$http.post(`/app/appquestionnairetemplate/queryDataInfoById?id=${formId}&dataId=${id}`).then(res => {
        if (res.code == 0) {
-          this.form = {
-            ...res.data,
-            headPicture: res.data.headPicture
+          this.formInfo = res.data
+
+          this.targetList.forEach((item, index) => {
+            if (item.type === 'checkbox' && this.formInfo[`field_${index}`]) {
+              this.formInfo[`field_${index}`] = this.formInfo[`field_${index}`].split(',')
            }
-
-          this.type = res.data.type
-
-          this.targetList = res.data.fields.map(item => {
-            return JSON.parse(item.fieldInfo)
          })
-
-          this.pageShow = true
-        } else {
-          this.$u.toast(res.msg)
        }
-
-        uni.hideLoading()
-      }).catch(() => {
-        uni.hideLoading()
      })
    }
  }
--- a/src/sass/AppAskForm/Statistical.vue
+++ b/src/sass/AppAskForm/Statistical.vue
@@ -15,10 +15,11 @@
          </span>
        </div>
        <div class="topic-list">
-          <div class="topic-item" v-for="(item, index) in subjectList" :key="index">
+          <div class="topic-item" :class="[['radio', 'checkbox', 'select'].indexOf(item.fieldType) === -1 ? 'topic-item__active' : '']" v-for="(item, index) in subjectList" :key="index">
+            <template v-if="['radio', 'checkbox', 'select'].indexOf(item.fieldType) > -1">
              <h2>{{ item.fieldName }}（{{ item.fixedLabel }}）</h2>
              <div class="topic-item__wrapper">
-              <div class="option-item" v-for="(filed, i) in item.options" :key="i" v-show="['radio', 'checkbox', 'select'].indexOf(item.fieldType) > -1">
+                <div class="option-item" v-for="(filed, i) in item.options" :key="i">
                  <div class="option-item__left">
                    <h2>{{ filed.label }}：</h2>
                    <!-- <span>每周监测</span> -->
@@ -29,24 +30,29 @@
                  </div>
                </div>
              </div>
+            </template>
+            <template v-else>
+              <h2 class="topic-item__left">{{ item.fieldName }}（{{ item.fixedLabel }}）</h2>
+              <span>共{{ fieldDataCount[`field_${index}`] }}条数据</span>
+            </template>
          </div>
        </div>
      </div>
      <div class="user-list" v-show="currIndex === 1">
-        <div class="user-item" v-for="(item, index) in 10" :key="index">
+        <div class="user-item" v-for="(item, index) in list" :key="index">
          <div class="user-item__left">
            <image src="https://p26-passport.byteacctimg.com/img/user-avatar/6401428bcd3b2b9bfed4f31cca07b798~300x300.image" />
            <div class="right">
              <div class="right-top">
-                <h2>且听风吟</h2>
-                <span>微信用户</span>
+                <h2>{{ item.residentName }}</h2>
+                <span>{{ $dict.getLabel('wxUserType', item.userType) }}</span>
              </div>
-              <p>2021-10-10 10:30:00</p>
+              <p>{{ item.commitTime }}</p>
            </div>
          </div>
          <div class="user-item__right">
-            <p>分值: 10</p>
-            <div>查看表单</div>
+            <p>分值: {{ item.totalScore }}</p>
+            <div @click="toPreview(item.id)">查看表单</div>
          </div>
        </div>
      </div>
@@ -71,12 +77,18 @@
        total: 0,
        pageShow: false,
        form: {},
+        search: {
+          size: 15,
+          current: 1
+        },
+        isMore: false,
        fieldTypeCount: [],
        fieldValueDistribution: [],
        fieldDataCount: {},
        isShowForm: false,
        targetList: [],
-        formInfo: {}
+        formInfo: {},
+        list: []
      }
    },

@@ -87,6 +99,10 @@
      this.$nextTick(() => {
        this.getInfo()
        this.getFormInfo()
+
+        this.$dict.load(['wxUserType']).then(() => {
+          this.getList()
+        })
      })
    },

@@ -102,6 +118,42 @@
        })
      },

+      toPreview(id) {
+        localStorage.setItem("toPreviewForm", JSON.stringify({form: this.info, targetList: this.targetList}))
+        uni.navigateTo({url: `./PreviewForm?id=${id}&formId=${this.info.id}`})
+      },
+
+      getList() {
+        if (this.isMore) return
+        this.$http.post(`/app/appquestionnairetemplate/statisticsResident?id=${this.id}`, null, {
+          params: {
+            ...this.search
+          }
+        }).then(res => {
+          if (res.code == 0) {
+            if (this.search.current > 1) {
+              this.list = [...this.list, ...res.data.records]
+            } else {
+              this.list = res.data.records
+            }
+
+            uni.hideLoading()
+
+            if (res.data.records.length < 10) {
+              this.isMore = true
+
+              return false
+            }
+
+            this.search.current = this.search.current + 1
+          } else {
+            uni.hideLoading()
+          }
+        }).catch(() => {
+          uni.hideLoading()
+        })
+      },
+
      mapType(type) {
        return {
          upload: '上传图片',
@@ -151,6 +203,10 @@
          }
        })
      }
+    },
+
+    onReachBottom() {
+      this.getList()
    }
  }
 </script>
@@ -262,6 +318,29 @@
          font-size: 32px;
        }

+        &.topic-item__active {
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          margin: 40px 32px 0;
+          padding: 34px 32px;
+          background: #EFF7FF;
+          border-radius: 16px;
+          border: 1px solid #CCCCCC;
+
+          h2 {
+            flex: 1;
+            margin-right: 9px;
+            font-weight: 600;
+            font-size: 32px;
+            color: #333333;
+          }
+
+          span {
+            color: #666666;
+          }
+        }
+
        .option-item {
          display: flex;
          align-items: center;