index.vue 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250
  1. <template>
  2. <view class="content">
  3. <view class="navgite">
  4. <image class="logo" src="/static/logo.png"></image>
  5. </view>
  6. <swiper :autoplay="true" interval="3000" duration="1000" :circular="true" previous-margin="36rpx"
  7. easing-function="linear">
  8. <swiper-item v-for="(item, index) in swiperList" :key="index">
  9. <view class="swiper-item">
  10. <image :src="item" />
  11. </view>
  12. </swiper-item>
  13. </swiper>
  14. <view class="about-us">
  15. <view class="text-title">
  16. 关于我们
  17. </view>
  18. <view class="text-area">
  19. 合肥仟微网络科技有限公司致力于互联网多领域软件应用开发、客户端开发、服务端开发、手机软件开发方向。仟微科技坚持以技术创新为核心,以用户需求为导向,关注用户体验,顺应市场发展方向,努力成为国内领先的互联网应用开发服务商,为企业客户提供最专业的应用产品开发支持和解决方案。仟微科技旗下自主产品目前已在政务、医疗、营销及电商等十多个行业落地。仟微科技团队成员来自腾讯科技、有赞科技等知名互联网企业,并拥有各自擅长的专业领域,同时拥有丰富的互联网工作及软件开发经验,为客户提供最优质的服务。
  20. </view>
  21. </view>
  22. <view class="partner">
  23. <view class="text-title">
  24. 企业文化
  25. </view>
  26. <view class="corporate-culture-content">
  27. <view class="left">
  28. <text>我们的使命</text>
  29. <text>以开源为源动力,以企业私域增长为核心,把客户当做合作伙伴,互创影响力,实现共同增长</text>
  30. </view>
  31. <view class="left">
  32. <text>我们的愿景</text>
  33. <text>让每个合作伙伴都成为私域增长专家</text>
  34. </view>
  35. <view class="left">
  36. <text>我们的价值观</text>
  37. <ul>
  38. <li><text>开源开放</text><text>坚持创新</text></li>
  39. <li><text>成就客户</text><text>互创价值</text></li>
  40. </ul>
  41. </view>
  42. </view>
  43. </view>
  44. <!-- <u-button type="primary" shape="circle" @click="finishRename">联系我们</u-button> -->
  45. <view class="call-us" @click="show = true">
  46. 联系我们
  47. </view>
  48. <u-popup :show="show" @close="close" @open="open" mode="center" :round="8">
  49. <view class="popClass">
  50. <view class="text-title">联系我们</view>
  51. <u-cell-group>
  52. <u-cell title="联系邮箱:xiarui1@linkwechat.cn" arrow-direction="down">
  53. <u-icon slot="icon" size="28" name="email-fill"></u-icon>
  54. </u-cell>
  55. <u-cell title="公司地址:安徽省合肥市高新区创新产业园二期J2栋C座24楼A-2403" arrow-direction="down">
  56. <u-icon slot="icon" size="28" name="map-fill"></u-icon>
  57. </u-cell>
  58. </u-cell-group>
  59. </view>
  60. </u-popup>
  61. </view>
  62. </template>
  63. <script>
  64. export default {
  65. data() {
  66. return {
  67. swiperList: ['/static/banner1.png', '/static/banner2.png', '/static/banner3.png'],
  68. show: false,
  69. }
  70. },
  71. onLoad() {
  72. },
  73. methods: {
  74. close() {
  75. this.show = false
  76. },
  77. open() {}
  78. }
  79. }
  80. </script>
  81. <style lang="scss" scoped>
  82. .popClass {
  83. width: 300px;
  84. padding: 10px;
  85. padding-bottom: 30px;
  86. }
  87. .call-us {
  88. width: 60%;
  89. height: 60rpx;
  90. text-align: center;
  91. line-height: 60rpx;
  92. cursor: pointer;
  93. background-color: #3e95ef;
  94. color: #fff;
  95. font-size: 18rpx;
  96. margin: 40rpx 0;
  97. border-radius: 6px;
  98. }
  99. .content {
  100. display: flex;
  101. flex-direction: column;
  102. align-items: center;
  103. justify-content: center;
  104. .navgite {
  105. width: 100%;
  106. display: flex;
  107. justify-content: space-between;
  108. padding: 20rpx 40rpx;
  109. .user {
  110. width: 60rpx;
  111. height: 60rpx;
  112. // background-color: #3e95ef;
  113. border-radius: 40rpx;
  114. margin-right: 20rpx;
  115. border: 1px solid #3e95ef;
  116. }
  117. }
  118. }
  119. .logo {
  120. width: 400rpx;
  121. height: 60rpx;
  122. // margin-right: auto;
  123. // margin-bottom: 50rpx;
  124. }
  125. .text-area {
  126. display: flex;
  127. justify-content: center;
  128. margin: 20rpx;
  129. padding: 40rpx;
  130. font-size: 20rpx;
  131. line-height: 40rpx;
  132. width: 80%;
  133. background: #ffffff;
  134. box-shadow: 0px 8px 26px 1px rgba(0, 0, 0, 0.08);
  135. border-radius: 4px 4px 4px 4px;
  136. border: 1px solid #f4f4f4;
  137. margin-top: 40rpx;
  138. }
  139. .partner {
  140. width: 100%;
  141. .corporate-culture-content {
  142. display: flex;
  143. flex-direction: column;
  144. align-items: center;
  145. width: 100%;
  146. .left {
  147. width: 80%;
  148. height: 118px;
  149. border-radius: 4rpx 4rpx 4rpx 4rpx;
  150. background-image: url("/static/m-3.png");
  151. background-size: 100%;
  152. background-repeat: no-repeat;
  153. display: flex;
  154. flex-direction: column;
  155. align-items: center;
  156. justify-content: center;
  157. margin-bottom: 10rpx;
  158. text:nth-child(1) {
  159. color: #ffffff;
  160. line-height: 60rpx;
  161. font-size: 28rpx;
  162. }
  163. text:nth-child(2) {
  164. max-width: 265px;
  165. display: block;
  166. font-weight: normal;
  167. color: #ffffff;
  168. text-align: center;
  169. font-size: 18rpx;
  170. font-family: PingFang SC-中等, PingFang SC;
  171. line-height: 34rpx;
  172. }
  173. }
  174. .left:nth-of-type(2) {
  175. background-image: url("/static/m-2.png");
  176. }
  177. .left:nth-of-type(3) {
  178. background-image: url("/static/m-3.png");
  179. ul {
  180. width: 36.5%;
  181. li {
  182. display: flex;
  183. justify-content: space-between;
  184. text {
  185. font-size: 18rpx;
  186. font-family: PingFang SC-中等, PingFang SC;
  187. font-weight: normal;
  188. color: #ffffff;
  189. line-height: 40rpx;
  190. }
  191. }
  192. }
  193. }
  194. }
  195. }
  196. .title {
  197. font-size: 36rpx;
  198. color: #8f8f94;
  199. }
  200. .text-title {
  201. margin: 20rpx;
  202. font-size: 16px;
  203. color: #2b2d3a;
  204. text-align: center;
  205. width: 100%;
  206. margin-top: 40rpx;
  207. margin-bottom: 40rpx;
  208. }
  209. swiper {
  210. // width: 726rpx;
  211. width: 100%;
  212. height: 200rpx;
  213. overflow: hidden;
  214. margin-top: 20rpx;
  215. .swiper-item {
  216. width: 684rpx;
  217. height: 200rpx;
  218. image {
  219. width: 100%;
  220. height: 100%;
  221. }
  222. }
  223. }
  224. </style>