feat: 联系我们

src/api/url/index.js

@@ -22,4 +22,6 @@ export default {
   haveAuth: '/postcard/api/investClueInfo/haveAuth',
   // 查询咨询列表
   queryInvestInfos: '/postcard/api/investClueInfo/page',
+  // 联系我们列表
+  queryContacts: '/postcard/api/scSourceInfo/contact',
 }

src/pages.json

@@ -8,9 +8,9 @@
   },
   "pages": [
     {
-      "path": "pages/investment/investment-list",
+      "path": "pages/investment/index",
       "style": {
-        "navigationBarTitleText": "咨询列表"
+        "navigationBarTitleText": "投资舒城"
       }
     },
     {
@@ -31,12 +31,6 @@
         "navigationBarTitleText": "招商引资"
       }
     },
-    {
-      "path": "pages/investment/index",
-      "style": {
-        "navigationBarTitleText": "投资舒城"
-      }
-    },
     {
       "path": "pages/detail/industrialDetail",
       "style": {
@@ -49,6 +43,12 @@
         "navigationBarTitleText": "载体详情"
       }
     },
+    {
+      "path": "pages/investment/investment-list",
+      "style": {
+        "navigationBarTitleText": "咨询列表"
+      }
+    },
     {
       "path": "pages/detail/landDetail",
       "style": {

src/pages/investment/index.vue

 <template>
-  <div class="invest-us">
-    <div>
-      <u-tabs :list="tabList" @click="handleTab"></u-tabs>
-    </div>
-    <div class="body">
-      <div>
-        持续推进简政放权，为企业提供高效快捷的“一站式”服务;坚持
-        重点招商引资项目调度推进机制。
+  <div class="invest-us" :style="tabIndex === 1 ? 'background: #f4f4f4' : ''">
+    <u-sticky bgColor="#fff">
+      <div style="background: white">
+        <u-tabs :list="tabList" @click="handleTab"></u-tabs>
       </div>
+    </u-sticky>
+    <div class="body">
+      <template v-if="tabIndex === 0">
+        <div>
+          持续推进简政放权，为企业提供高效快捷的“一站式”服务;坚持
+          重点招商引资项目调度推进机制。
+        </div>
 
-      <div class="notice-text">
-        您可以留下您的咨询内容，我们收到后会第一时间联系您
-      </div>
-      <div>
-        <u--form
-          labelPosition="top"
-          label-width="auto"
-          :model="formData"
-          :rules="rules"
-          ref="formRef"
-        >
-          <u-form-item label="咨询类别" prop="type" borderBottom required>
-            <u--input
-              v-model="formData.type"
-              readonly
-              border="none"
-              suffixIcon="arrow-right"
-              :suffixIconStyle="{ fontSize: '30rpx' }"
-              placeholder="请输入类别"
-              @tap="changeShowPicker(true)"
-            ></u--input>
-          </u-form-item>
-          <u-form-item label="所属企业" prop="company" borderBottom required>
-            <u--input
-              v-model="formData.company"
-              border="none"
-              placeholder="请输入企业"
-            ></u--input>
-          </u-form-item>
-          <u-form-item label="姓名" prop="name" borderBottom required>
-            <u--input
-              v-model="formData.name"
-              border="none"
-              placeholder="请输入姓名"
-            ></u--input>
-          </u-form-item>
-          <u-form-item label="联系电话" prop="phone" borderBottom required>
-            <u--input
-              v-model="formData.phone"
-              type="number"
-              border="none"
-              placeholder="请输入联系电话"
-            ></u--input>
-          </u-form-item>
-          <u-form-item label="邮箱" prop="email" borderBottom>
-            <u--input
-              v-model="formData.email"
-              border="none"
-              placeholder="请输入邮箱"
-            ></u--input>
-          </u-form-item>
-          <u-form-item label="需求描述" prop="desc" borderBottom>
-            <u--textarea
-              v-model="formData.desc"
-              border="none"
-              placeholder="请输入需求描述"
-            ></u--textarea>
-          </u-form-item>
-        </u--form>
-        <div class="submit-btn" @tap="handleSubmit">提交</div>
-        <div class="to-list" @tap="handleToList">
-          <div>
-            <image
-              class="customer-icon"
-              src="@/static/img/customer.png"
-            ></image>
+        <div class="notice-text">
+          您可以留下您的咨询内容，我们收到后会第一时间联系您
+        </div>
+        <div>
+          <u--form
+            labelPosition="top"
+            label-width="auto"
+            :model="formData"
+            :rules="rules"
+            ref="formRef"
+          >
+            <u-form-item label="咨询类别" prop="type" borderBottom required>
+              <u--input
+                v-model="formData.type"
+                readonly
+                border="none"
+                suffixIcon="arrow-right"
+                :suffixIconStyle="{ fontSize: '30rpx' }"
+                placeholder="请输入类别"
+                @tap="changeShowPicker(true)"
+              ></u--input>
+            </u-form-item>
+            <u-form-item label="所属企业" prop="company" borderBottom required>
+              <u--input
+                v-model="formData.company"
+                border="none"
+                placeholder="请输入企业"
+              ></u--input>
+            </u-form-item>
+            <u-form-item label="姓名" prop="name" borderBottom required>
+              <u--input
+                v-model="formData.name"
+                border="none"
+                placeholder="请输入姓名"
+              ></u--input>
+            </u-form-item>
+            <u-form-item label="联系电话" prop="phone" borderBottom required>
+              <u--input
+                v-model="formData.phone"
+                type="number"
+                border="none"
+                placeholder="请输入联系电话"
+              ></u--input>
+            </u-form-item>
+            <u-form-item label="邮箱" prop="email" borderBottom>
+              <u--input
+                v-model="formData.email"
+                border="none"
+                placeholder="请输入邮箱"
+              ></u--input>
+            </u-form-item>
+            <u-form-item label="需求描述" prop="desc" borderBottom>
+              <u--textarea
+                v-model="formData.desc"
+                border="none"
+                placeholder="请输入需求描述"
+              ></u--textarea>
+            </u-form-item>
+          </u--form>
+          <div class="submit-btn" @tap="handleSubmit">提交</div>
+          <div class="to-list" @tap="handleToList">
+            <div>
+              <image
+                class="customer-icon"
+                src="@/static/img/customer.png"
+              ></image>
+            </div>
+            <div>咨询列表</div>
           </div>
-          <div>咨询列表</div>
         </div>
-      </div>
+      </template>
+      <template v-else>
+        <div class="contact-cell">
+          <div
+            class="contact-item"
+            v-for="item of contactList"
+            :key="item.value"
+          >
+            <div>{{ item.name }}</div>
+            <div @tap="handleCall(item.value)">
+              <image
+                class="phone-icon"
+                src="@/static/img/phone-blue.png"
+              ></image>
+            </div>
+          </div>
+        </div>
+      </template>
     </div>
     <u-picker
       :show="showPicker"
@@ -147,6 +168,7 @@ export default {
       typeList: [],
       showPicker: false,
       selectedType: "",
+      contactList: [],
     };
   },
   computed: {
@@ -179,6 +201,21 @@ export default {
     init() {
       this.initField();
       this.initTypeList();
+      this.initContacts();
+    },
+    initContacts() {
+      this.$fetch({
+        url: API.queryContacts,
+        data: {},
+        methods: "get",
+      }).then((res) => {
+        this.contactList = res.map((obj) => {
+          return Object.entries(obj).map(([name, value]) => ({
+            name,
+            value,
+          }))[0];
+        });
+      });
     },
     initTypeList() {
       this.$fetch({
@@ -196,7 +233,7 @@ export default {
     changeShowPicker(b) {
       this.showPicker = b;
     },
-    handleTab(index) {
+    handleTab({ index }) {
       this.tabIndex = index;
     },
     handleParams() {
@@ -278,6 +315,11 @@ export default {
         url: `/pages/investment/investment-list`,
       });
     },
+    handleCall(phone) {
+      uni.makePhoneCall({
+        phoneNumber: phone,
+      });
+    },
   },
 };
 </script>
@@ -351,5 +393,28 @@ export default {
       height: 48rpx;
     }
   }
+  .contact-cell {
+    .contact-item {
+      background-color: white;
+      padding: 0 60rpx;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      height: 156rpx;
+      & ~ .contact-item {
+        margin-top: 40rpx;
+      }
+      .item-title {
+        font-size: 32rpx;
+        font-family: HiraginoSansGB, HiraginoSansGB;
+        font-weight: normal;
+        color: #333333;
+      }
+      .phone-icon {
+        width: 74rpx;
+        height: 74rpx;
+      }
+    }
+  }
 }
 </style>