Blame view

app/pages/Spain/manu/manu.html 13.3 KB
7820380e   “wangming”   1
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
  <!DOCTYPE html>
  <html lang="en">
  
  <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>CCDC</title>
      <!-- 引入jQuery -->
          <script src="../../../../node_modules/jquery/dist/jquery.js"></script>
      <link rel="stylesheet" href="../../../static/common/index.css">
      <!--引入 element-ui 的样式,-->
      <!-- <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> -->
      <!-- 必须先引入vue,后使用element-ui -->
      <!-- <script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script> -->
      <!-- 引入element 的组件库-->
      <!-- <scrip src="https://unpkg.com/element-ui/lib/index.js"> -->
      <script src="../../../static/js/include.js"></script>
      <script src="../../../static/js/public.js"></script>
      <link rel="stylesheet" href="../../../static/common/swiper.css">
      <link rel="stylesheet" href="../../../static/css/team_lab/team_lab_canter.css">
      <link rel="stylesheet" href="../../../static/css/manu/manu.css">
      <link rel="stylesheet" href="../../../static/css/public/footer.css">
      <link rel="stylesheet" href="../../../static/css/indexSpain.css">
  </head>
  
  <body>
      <div id="app">
          <!-- 头部导航栏和标题 -->
          <div class="head" style="padding: 0;">
              <!-- logo -->
              <h1><img src="../../../static/imgs/home/logo.png" alt=""></h1>
              <!-- 导航栏 -->
              <ul>
                  <span class="to_li" style="left: 82.4%;"></span>
                  <li><a href="../index.html" target="_self">Inicio</a></li>
                  <li><a href="../about/about.html" target="_self">Sobre nosotros</a></li>
                  <li><a href="../product/product.html" target="_self">Productos de fluidos de perforación</a></li>
                  <li><a href="../system/system.html" target="_self">Sistemas de fluidos de perforación</a></li>
                  <li><a href="../technology/technology.html" target="_self">Tecnología de fluidos de perforación</a></li>
                  <li><a href="../team_lab/t_l_centers.html" target="_self">Laboratorio/Equipo</a></li>
                  <li><a href="../manu/manu.html" class="red_bold" target="_self">Fabricación</a></li>
                  <li><a href="../contact/contact.html" target="_self">Conéctese con nosotros</a></li>
              </ul>
              <!-- 后方标志 -->
              <ol>
                  <li><img src="../../../static/imgs/home/search.png" alt=""></li>
                  <li><img src="../../../static/imgs/home/translate.png" alt=""></li>
                  <li>
                      <span class="lan_change" data-title="English">EN</span>
                      <span class="lan_change" data-title="Russian">RU</span>
                      <span class="lan_change" data-title="Spain">ES</span>
                      <span class="lan_change" data-title="Chinese">CN</span>
                  </li>
              </ol>
          </div>
      </div>
      <div class="banner">
          <div>
              <p>FABRICACIÓN</p>
              <p>PIONERO EN SERVICIOS COMPLEJOS PARA YACIMIENTOS DE PETRÓLEO Y GAS</p>
          </div>
          <img src="../../../static/imgs/manu/banner.jpg" alt="">
      </div>
      <!-- 切换地方 -->
      <div class="change">
          <div class="tab-container">
              <!-- 标签页选项卡 -->
              <div class="tag">
                  <div class="main">
                      <span class="tab_to manuTab" style="left: 211px;"></span>
                      <div class="tab active" onclick="openTab(event,'tab1')">Base de producción</div>
                      <div class="tab" onclick="openTab(event,'tab2')">Taller</div>
                      <div class="tab" onclick="openTab(event,'tab3')">Laboratorio de inspección de calidad</div>
                      <div class="tab" onclick="openTab(event,'tab4')">Almacén</div>
                  </div>
              </div>
              <!-- 标签页内容 -->
              <div class="content">
                  <!-- 生产基地介绍 -->
                  <div id="tab1" class="tab-content" style="display:block;">
                      <p class="title show">Base de producción</p>
                      <include src="./base.html"></include>
                  </div>
                  <!-- 液体固体车间 -->
                  <div id="tab2" class="tab-content">
                      <p class="title">1. Taller de producción de agentes químicos líquidos</p>
                     <include src="./workshop.html"></include>
                  </div>
                  <!-- 质检实验室 -->
                  <div id="tab3" class="tab-content">
                      <p class="title show">Pequeño laboratorio de inspección de calidad</p>
                      <include src="./quality.html"></include>
                  </div>
                  <!-- 化剂立体储存仓库 -->
                  <div id="tab4" class="tab-content">
                     <p class="title">Almacén tridimensional de agentes químicos</p>
                     <include src="./warehouse.html"></include>
                  </div>
              </div>
          </div>
      </div>
  
      <!-- 尾部 -->
      <div class="fot">
          <!-- 尾部列表区域 -->
          <div class="all_ul">
              <div class="ul1">
                  <span>PRODUCTOS</span>
                  <ul>
0f4c2035   “wangming”   111
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
                      <li>
                          <a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/product/product_type.html?data=35&title=SECTION8">DRILDETER<sup>® </sup></a>
                      </li>
                      <li>
                          <a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/product/product_type.html?data=37&title=SECTION8_SERIES">DRILDETER<sup>® </sup> ABB PLUS</a>
                      </li>
                      <li>
                          <a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/product/product_type.html?data=36&title=SECTION8_SERIES">DRILDETER<sup>® </sup> ABB</a>
                      </li>
                      <li>
                          <a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/product/product_type.html?data=36&title=SECTION9">FOAMDRIL<sup>® </sup></a>
                      </li>
                      <li>
                          <a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/product/product_type.html?data=37&title=SECTION10">GERMCI<sup>® </sup></a>
                      </li>
7820380e   “wangming”   1
125
126
127
128
129
                  </ul>
              </div>
              <div class="ul1">
                  <span>SISTEMA</span>
                  <ul>
0f4c2035   “wangming”   111
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
                      <li>
                          <a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/system/system_detail.html?data=121">AMPOLDRIL<sup>® </sup> Hermafrodita <br> Líquido de perforación de polímeros</a>
                      </li>
                      <li>
                          <a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/system/system_detail.html?data=122">SOLITOLERDRIL<sup>® </sup> Sólidos de alta resistencia <br> Sistema de fluidos de perforación a base de agua</a>
                      </li>
                      <li>
                          <a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/system/system_detail.html?data=123">INHIBDRIL<sup>® </sup> Alto rendimiento <br> Sistema de fluidos de perforación a base de agua</a>
                      </li>
                      <li>
                          <a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/system/system_detail.html?data=126">AKUAFAST<sup>® </sup> Entorno de perforación rápida <br> Sistema de fluido de perforación de protección</a>
                      </li>
                      <li>
                          <a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/system/system_detail.html?data=127">AKUADRIL<sup>® </sup> Prevención del colapso y medio ambiente <br> Sistema de fluido de perforación de protección</a>
                      </li>
                      <li>
                          <a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/system/system_detail.html?data=128">AKUASEAL<sup>® </sup> Medio Ambiente de bajo riesgo <br> Sistema de fluido de perforación de protección</a>
7820380e   “wangming”   1
147
                      </li>
7820380e   “wangming”   1
148
149
150
151
152
                  </ul>
              </div>
              <div class="ul1">
                  <span>TECNOLOGÍA</span>
                  <ul>
0f4c2035   “wangming”   111
153
154
155
156
157
158
159
160
161
162
163
                      <li>
                          <a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/technology/technology_detail.html?data=124">LONGLARTEC<sup>® </sup>Tecnología de fluidos de perforación <br> Sección larga adecuada para grandes dimensiones</a>
                      </li>
                      <li>
                          <a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/technology/technology_detail.html?data=139">HIPRESATEC<sup>® </sup>Un control especial <br> Tecnología de tratamiento de agua salada de alta presión</a>
                      </li>
                      <li>
                          <a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/technology/technology_detail.html?data=140">BORENHANTEC<sup>® </sup>Refuerzo del pozo <br> Tecnología</a>
                      </li>
                      <li>
                          <a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/technology/technology_detail.html?data=141">HIFL-PLUGTEC<sup>® </sup>Solidificación de alta pérdida de líquido y <br> Tecnología de bloqueo</a>
7820380e   “wangming”   1
164
                      </li>
7820380e   “wangming”   1
165
166
167
168
169
                  </ul>
              </div>
              <div class="ul1">
                  <span>LABORATORIO/EQUIPO</span>
                  <ul>
0f4c2035   “wangming”   111
170
171
172
173
                      <li><a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/team_lab/t_l_centers.html">Centro de I+D</a></li>
                      <li><a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/team_lab/t_l_lab.html">Laboratorio</a></li>
                      <li><a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/team_lab/t_l_team.html">Equipo de servicio</a></li>
                      <li><a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/team_lab/t_l_station.html">Planta de purines líquidos</a></li>
7820380e   “wangming”   1
174
175
176
177
178
179
                      <!-- <li>Academic exchange</li> -->
                  </ul>
              </div>
              <div class="ul1">
                  <span>FABRICACIÓN</span>
                  <ul>
0f4c2035   “wangming”   111
180
181
182
183
                      <li><a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/manu/manu.html">Base de producción</a></li>
                      <li><a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/manu/manu.html">Taller</a></li>
                      <li><a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/manu/manu.html">Laboratorio de inspección de calidad</a></li>
                      <li><a href="http://www.ccdcdf.com:6080/pc/app/pages/Spain/manu/manu.html">Almacén</a></li>
7820380e   “wangming”   1
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
                  </ul>
              </div>
              <div class="ul1">
                  <span>CONÉCTESE CON NOSOTROS</span>
                  <ul>
                      <li>Tel: +86-028-86011661</li>
                      <li>Fax: +86-028-86013997</li>
                      <li>Emal: cqswc@cnpc.com.cn</li>
                      <li>No. 6 mengzhuiwan street, chengdu, sichuan, China</li>
                  </ul>
              </div>
          </div>
          <!-- 尾部logo区域 -->
          <div class="bot_logo">
              <div class="logo_text">
                  <div class="lef">
                      <img src="../../../static/imgs/logowhite.png" alt="">
                      <!-- <span>©2023 这里有文字这里有文字</span> -->
                  </div>
                  <p>ICP备20230200号-1</p>
              </div>
          </div>
      </div>
  </body>
  <link rel="stylesheet" href="../../../node_modules/swiper/swiper-bundle.min.css">
  <script src="../../../node_modules/swiper/swiper-bundle.min.js"></script>
  <script>
      var swiper = new Swiper('.Swiper1', {
          pagination: {
              el: ".swiper-pagination",
              clickable: true,
          },
      })
  </script>
  <script>
      //切换50
      function openTab(event, tabName) {
          // 获取所有标签页内容元素
          var tabContent = document.getElementsByClassName("tab-content");
  
          // 隐藏所有标签页内容
          for (var i = 0; i < tabContent.length; i++) {
              tabContent[i].style.display = "none";
          }
  
          // 移除所有标签页选项卡的 active 类
          var tabs = document.getElementsByClassName("tab");
          for (var i = 0; i < tabs.length; i++) {
              tabs[i].className = tabs[i].className.replace(" active", "");
          }
  
          // 显示当前选中标签页内容
          document.getElementById(tabName).style.display = "block";
  
          // 添加 active 类到当前选中标签页选项卡
          event.currentTarget.className += " active";
      }
  
      // 显示隐藏部分
      $(function () {//显示三行 多余隐藏 点击展开
          $('.innerCtn1').click(function () {
              $('.show').removeClass('out');
              $('.innerCtn1').css("display", "none")
          });
          $('.innerCtn2').click(function () {
              $('.show').removeClass('out');
              $('.innerCtn2').css("display", "none")
          });
          $('.innerCtn3').click(function () {
              $('.show').removeClass('out');
              $('.innerCtn3').css("display", "none")
          });
      });
      $('.tab').click(function(){
          let left_distance = $(this).position().left  + 14 + $(this).width()/2 - 20 
          $('.tab_to').css("left",left_distance)
          // console.log($(this).width())
          console.log($(this).position().left + 14 + $(this).width()/2 - 20)
      })
  </script>
  <!-- 引入HTML组件化JS -->
  <script src="../../static/js/include.js"></script>
  
  </html>