修改中英文滚动条

scripts/dev-en.js

@@ -1,72 +1,67 @@
 var devcomponent_en = {
-    template: `
+
-    <div style="display: flex; flex-direction: column; height: 100vh; overflow: hidden;">
+
-        <!-- 筛选区域 -->
+	template:`
-        <div style="display: flex; margin-top: 5px; margin-bottom: 5px; flex-wrap: wrap; align-items: center; padding: 0 10px;">
+		<div>
+			<div style="display: flex;margin-top: 10px; flex-wrap: wrap; align-items: center;">
 				<el-radio-group v-model="radio1" @change="radio_change" style="display: inline-flex; flex-direction: row; flex-wrap: nowrap;">
 				<el-radio-button label="1">Well</el-radio-button>
-                <el-radio-button label="2">Instrument</el-radio-button>
+				<el-radio-button label="2">Equipment</el-radio-button>
 				</el-radio-group>
-
+				<!-- Well tab filter box, placed in the same row as the tab -->
-            <!-- Well location tab filter -->
 				<div v-if="radio1=='1'" style="display: flex; margin-left: 20px; align-items: center;">
-                <el-input v-model="input" placeholder="Please enter well name" clearable style="width: 200px;"></el-input>
+					<el-input v-model="input" placeholder="Enter well name" clearable style="width: 200px;"></el-input>
-                <el-button style="margin-left: 5px;" id="bt_serach" plain type="primary" icon="el-icon-search" @click="getWell(input)">Search</el-button>
+					<el-button style="margin-left: 5px;" id ="bt_serach" plain type="primary" icon="el-icon-search" @click="getWell(input)">Search</el-button>
-                <el-button style="margin-left: 5px;" id="bt_add" plain type="primary" icon="el-icon-circle-plus-outline" @click="add_dev_manage_dialog()">Add</el-button>
+					<el-button style="margin-left: 5px;" id ="bt_add" plain type="primary" icon="el-icon-circle-plus-outline" @click="add_dev_manage_dialog()">Add</el-button>
 				</div>
-
+				<!-- Equipment tab time filter box, in the same row as the tab -->
-            <!-- Equipment tab 第一行：时间筛选 -->
+				<div v-if="radio1=='2'" style="display: flex; margin-left: 20px; align-items: center; flex-wrap: wrap;">
-            <div v-if="radio1=='2'" style="display: flex; margin-left: 10px; align-items: center; flex-wrap: wrap;">
 					<el-date-picker
 						v-model="devSearchForm.in_time_start"
 						type="date"
-                    placeholder="Start Time"
+						placeholder="Start in-hole time"
 						value-format="yyyy-MM-dd"
 						:picker-options="startTimeOptions"
-                    style="width: 140px;">
+						style="width: 160px;">
 					</el-date-picker>
 					<el-date-picker
 						v-model="devSearchForm.in_time_end"
 						type="date"
-                    placeholder="End Time"
+						placeholder="End in-hole time"
 						value-format="yyyy-MM-dd"
 						:picker-options="endTimeOptions"
-                    style="width: 140px; margin-left: 5px;">
+						style="width: 160px; margin-left: 5px;">
 					</el-date-picker>
+			
 				</div>
 
-            <!-- Equipment tab 第二行：下拉筛选框 -->
+				<!-- Equipment tab filter box, in the same row as the tab -->
-            <div v-if="radio1=='2'" style="display: flex; align-items: center; margin-top: 5px; flex-wrap: wrap; white-space: nowrap; width: 100%; margin-left: 0;">
+				<div v-if="radio1=='2'" style="display: flex; align-items: center; margin-top: 10px; flex-wrap: wrap; white-space: nowrap;">
-                <el-select v-model="devSearchForm.wellnameList" placeholder="Well Name" filterable clearable multiple collapse-tags style="width: 200px; max-width: 380px;">
+					<el-select v-model="devSearchForm.wellnameList" placeholder="Enter well name" filterable clearable multiple collapse-tags style="width: 240px; max-width: 380px; margin-left: 0px;">
 						<el-option v-for="item in devWellnameOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
 					</el-select>
-                <el-select v-model="devSearchForm.sid" placeholder="Series No." filterable clearable multiple collapse-tags style="width: 160px; max-width: 320px; margin-left: 5px;">
+					<el-select v-model="devSearchForm.sid" placeholder="Enter Instrument Serial No." filterable clearable multiple collapse-tags style="width: 180px; max-width: 320px; margin-left: 5px;">
 						<el-option v-for="item in devSidOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
 					</el-select>
-                <el-select v-model="devSearchForm.iid" placeholder="Serial No." filterable clearable multiple collapse-tags style="width: 160px; max-width: 320px; margin-left: 5px;">
+					<el-select v-model="devSearchForm.iid" placeholder="Enter Instrument Series No." filterable clearable multiple collapse-tags style="width: 180px; max-width: 320px; margin-left: 5px;">
 						<el-option v-for="item in devIidOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
 					</el-select>
-                <el-select v-model="devSearchForm.engineerList" placeholder="Engineer" filterable clearable multiple collapse-tags style="width: 180px; max-width: 320px; margin-left: 5px;">
+					<el-select v-model="devSearchForm.engineerList" placeholder="Enter Engineer" filterable clearable multiple collapse-tags style="width: 200px; max-width: 320px; margin-left: 5px;">
 						<el-option v-for="item in devEngineerOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
 					</el-select>
-            </div>
+					<el-button style="margin-left: 5px;" plain type="primary" icon="el-icon-search" @click="getDevList()">Search</el-button>
-
+					<el-button style="margin-left: 5px;" plain type="primary" icon="el-icon-document-checked" @click="exportSeirDetail()">Exp Inst</el-button>
-            <!-- Equipment tab 第三行：按钮 -->
+					<el-button style="margin-left: 5px;" plain type="primary" icon="el-icon-document-checked" @click="exportWellDetail()">Exp Well</el-button>
-            <div v-if="radio1=='2'" style="display: flex; align-items: center; margin-top: 5px; flex-wrap: wrap; width: 100%;">
-                <el-button plain type="primary" icon="el-icon-search" @click="getDevList()">Search</el-button>
-                <el-button plain type="primary" icon="el-icon-document-checked" style="margin-left: 5px;" @click="exportSeirDetail()">Download Instrument List</el-button>
-                <el-button plain type="primary" icon="el-icon-document-checked" style="margin-left: 5px;" @click="exportWellDetail()">Download Well</el-button>
 				</div>
 			</div>
-
+			<div class="span" v-if='radio1=="1"' style="height: calc(100vh - 200px); overflow-x: auto;">
-        <!-- Well 表格区域 -->
-        <div class="span" v-if='radio1=="1"' style="flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden;">
 				<el-table
 				    :data="tableData"
+				    style="width: 100%;font-size:14px"
 				    height="100%"
-                style="width: 100%; font-size: 14px; flex: 1; display: flex; flex-direction: column;"
 					:cell-style="{background:'#304156'}"
-                border>
+					border
+					>
 				    <el-table-column
 				      prop="wellNameSource"
 				      label="Well Name"
@@ -75,12 +70,13 @@ var devcomponent_en = {
 				    </el-table-column>
 				    <el-table-column
 				      prop="welltime"
-                  label="Well Time"
+				      label="Well Creation Time"
 				     :width="170">
 				    </el-table-column>
+				    
 				    <el-table-column
 				      prop="welloperator"
-                  label="Operator"
+				      label="Operating User"
 				      :width="150"
 					  :show-overflow-tooltip="true">
 				    </el-table-column>
@@ -91,38 +87,35 @@ var devcomponent_en = {
 					  :show-overflow-tooltip="true">
 					</el-table-column>
 					<el-table-column
-                      label="Operation"
+					      label="Actions"
 					      width="120">
 					      <template slot-scope="scope">
-                          <el-button @click="show_pdf(scope.row)" type="text" size="medium">Detail</el-button>
+							  <el-button @click="show_pdf(scope.row)" type="text" size="medium">Details</el-button>
 							<el-button @click="export_pdf(scope.row)" type="text" size="medium">Export</el-button>
 						  </template>
 					    </el-table-column>
 				  </el-table>
-            
+			</div>
-            <!-- Well 分页栏 -->
+			<div class="block" v-if='radio1=="1"'>
-            <div class="block" style="background-color: #ECF5FF; padding: 5px 0; flex-shrink: 0;">
+			    <span class="demonstration" style="background-color: #ECF5FF;"></span>
 			    <el-pagination
 			      @size-change="handleSizeChange"
 			      @current-change="handleCurrentChange"
 			      :current-page="currentPage"
-                  :page-sizes="[50,100,200,300]"
+			      :page-sizes="[50,100, 200, 300]"
 			      :page-size="pagesize"
 			      layout="total, sizes, prev, pager, next, jumper"
-                  :total="recordTotal"
+			      :total="recordTotal" style="background-color: #ECF5FF;">
-                  style="background-color: #ECF5FF;">
 			    </el-pagination>
 			  </div>
-        </div>
+				<div class="span" v-if='radio1=="2"' style="height: calc(100vh - 250px); overflow-x: auto;">
-
-        <!-- Equipment 表格区域 -->
-         <div class="span" v-if='radio1=="2"' style="flex: 1; min-height: 0; display: flex; flex-direction: column; overflow: hidden;">
 					<el-table
 						:data="devListTableData"
+						style="width: 100%;font-size:14px"
 						height="100%"
-                style="width: 100%; font-size: 14px; flex: 1; display: flex; flex-direction: column;"
 						:cell-style="{background:'#304156'}"
-                border>
+						border
+					>
 				    <el-table-column
 				      prop="instrument_name"
 				      label="Instrument Name"
@@ -131,13 +124,14 @@ var devcomponent_en = {
 				    </el-table-column>
 				    <el-table-column
 				      prop="sid"
-                  label="Series No."
+				      label="Instrument Series No."
-                  :width="120">
+				     :width="200">
 				    </el-table-column>
+				    
 				    <el-table-column
 				      prop="iid"
-                  label="Serial No."
+				      label="Instrument Serial No."
-                  :width="120"
+				      :width="200"
 					  :show-overflow-tooltip="true">
 				    </el-table-column>
 					<el-table-column
@@ -148,12 +142,12 @@ var devcomponent_en = {
 					</el-table-column>
 					<el-table-column
 					      prop="in_time"
-                      label="In Time"
+					      label="In-hole Time"
 					      width="160">
 					    </el-table-column>
 					<el-table-column
 					      prop="out_time"
-                      label="Out Time"
+					      label="Out-of-hole Time"
 					      width="160">
 					    </el-table-column>
 					<el-table-column
@@ -164,12 +158,12 @@ var devcomponent_en = {
 					<el-table-column
 					      prop="duration_current"
 					      label="Current Time(h)"
-                      width="150">
+					      width="120">
 					    </el-table-column>
 					<el-table-column
 					      prop="duration_total"
 					      label="Total Time(h)"
-                      width="150">
+					      width="120">
 					    </el-table-column>
 					<el-table-column
 					      prop="location"
@@ -178,23 +172,20 @@ var devcomponent_en = {
 						  :show-overflow-tooltip="true">
 					    </el-table-column>
 				  </el-table>
-            
+			</div>
-            <!-- Equipment 分页栏 -->
+			<div class="block" v-if='radio1=="2"' style="margin-top: 5px; margin-bottom: 5px;">
-            <div class="block" style="background-color: #ECF5FF; padding: 5px 0; flex-shrink: 0;">
+			    <span class="demonstration" style="background-color: #ECF5FF;"></span>
 			    <el-pagination
 			      @size-change="handleDevSizeChange"
 			      @current-change="handleDevCurrentChange"
 			      :current-page="devCurrentPage"
-                  :page-sizes="[50,100,200,300]"
+			      :page-sizes="[50,100, 200, 300]"
 			      :page-size="devPagesize"
 			      layout="total, sizes, prev, pager, next, jumper"
-                  :total="devRecordTotal"
+			      :total="devRecordTotal" style="background-color: #ECF5FF;">
-                  style="background-color: #ECF5FF;">
 			    </el-pagination>
 			  </div>
-        </div>
 			  
-        <!-- Equipment asset dialog -->
 			<el-dialog
 			 title="Equipment Asset Information"
 			 :visible.sync="pdf_visible"
@@ -206,7 +197,8 @@ var devcomponent_en = {
 				    style="width: 100%;font-size:14px"
 				    :height="tHeight1"
 					:cell-style="{background:'#304156'}"
-                border>
+					border
+					>
 					<el-table-column
 					  prop="wellname"
 					  label="Well Name"
@@ -215,13 +207,13 @@ var devcomponent_en = {
 					</el-table-column>
 					<el-table-column
 					  prop="sid"
-                  label="Series No"
+					  label="Serial Number"
 					  :width="100"
 					  :show-overflow-tooltip="true">
 					</el-table-column>
 					<el-table-column
 					  prop="iid"
-                  label="Serial No"
+					  label="ID"
 					  :width="100">
 					</el-table-column>
 				    <el-table-column
@@ -240,55 +232,69 @@ var devcomponent_en = {
 				      label="Calibration Date"
 				     :width="100">
 				    </el-table-column>
+					
 					<el-table-column
 					  prop="total_wt"
-                  label="Total Working Time"
+					  label="Total Production Hours"
 					     :width="100">
 					</el-table-column>
+					
 					<el-table-column
 					  prop="cur_wt"
-                  label="Current Working Time"
+					  label="Current Session Hours"
 					 :width="100">
 					</el-table-column>
+					
+					<!--
+					<el-table-column
+					  prop="repair_cnt"
+					  label="Maintenance Count"
+					 :width="100">
+					</el-table-column>
+					-->
+					
 					<el-table-column
 					  prop="region"
 					  label="Region"
 					 :width="100">
 					</el-table-column>
+					
 					<el-table-column
 					  prop="location"
 					  label="Location"
 					 :width="100"
 					 :show-overflow-tooltip="true">
 					</el-table-column>
+					
 					<el-table-column
 					  prop="responsible"
 					  label="Responsible Person"
 					 :width="100"
 					 :show-overflow-tooltip="true">
 					</el-table-column>
+				    
 					<el-table-column
-                      label="Operation"
+					      label="Actions"
-                      width="140">
+					      width="100">
 					      <template slot-scope="scope">
-                          <el-button v-if="scope.row.flag" @click="update_dev_m_dialog(scope.row)" type="text" size="medium">Update</el-button>
+							  <el-button v-if="scope.row.flag" @click="update_dev_m_dialog(scope.row)" type="text" size="medium">Edit</el-button>
 							  <el-button v-if="scope.row.flag" @click="remove_dev_m(scope.row)" type="text" size="medium">Delete</el-button>
 							</template>
 					    </el-table-column>
 				  </el-table>
 			</el-dialog>
 			
-        <!-- Add device dialog -->
 			<el-dialog
-         title="Device Information"
+			 title="Equipment Information"
 			 :visible.sync="add_visible"
 			 :lock-scroll ="false"
 			 width="45%">
-         <el-form ref="bform" :model="form" :rules="rules" label-width="120px" :inline="false" class="demo-form-inline" size="medium">
+			 <el-form ref="bform" :model="form" :rules="rules" label-width="100px" :inline="false" class="demo-form-inline" size="medium">
+				  
 				  <el-row :gutter="10">
 					  <el-col :span="12">
 						  <el-form-item label="Well Name"  prop="wellname">
-                      <el-select v-model="form.wellname" filterable placeholder="Please select well name">
+						  <el-select v-model="form.wellname" filterable placeholder="Select well name">
 						      <el-option
 						        v-for="item in wellnames"
 						        :key="item.value"
@@ -299,14 +305,15 @@ var devcomponent_en = {
 						  </el-form-item>
 					  </el-col>
 					  <el-col :span="12">
-                          <el-form-item label="Series No" prop="sid">
+							  <el-form-item label="Serial Number" prop="sid">
 							  <el-input v-model="form.sid" ></el-input>
 							  </el-form-item>
 					  </el-col>
 				  </el-row>
+				  
 				  <el-row :gutter="10">
 					  <el-col :span="12">
-                      <el-form-item label="Serial No" prop="iid">
+						  <el-form-item label="ID" prop="iid">
 						  <el-input v-model="form.iid" ></el-input>
 						  </el-form-item>
 					  </el-col>
@@ -316,6 +323,7 @@ var devcomponent_en = {
 						  </el-form-item>
 					  </el-col>
 				  </el-row>
+							  
 				  <el-row :gutter="10">
 					  <el-col :span="12">
 						  <el-form-item label="Production Date" prop="p_date">
@@ -362,20 +370,21 @@ var devcomponent_en = {
 								value-format="yyyy-MM-dd">
 						    </el-date-picker>
 					    </el-form-item>
-                  </el-col>
 					  </el-row>
+							  
 				  <el-row :gutter="10">
 						  <el-col :span="12">
-                          <el-form-item label="Total Working Time" prop="total_wt">
+							  <el-form-item label="Total Production Hours" prop="total_wt">
 								<el-input v-model="form.total_wt" ></el-input>
 							  </el-form-item>
 						  </el-col>
 						  <el-col :span="12">
-                        <el-form-item label="Current Working Time" prop="cur_wt">
+						    <el-form-item label="Current Session Hours" prop="cur_wt">
 						  	<el-input v-model="form.cur_wt" ></el-input>
 						    </el-form-item>
 						  </el-col>
 				  </el-row>
+				  
 				  <el-row :gutter="10">
 					  <el-col :span="12">
 						  <el-form-item label="Location" prop="location">
@@ -388,31 +397,40 @@ var devcomponent_en = {
 					    </el-form-item>
 					  </el-col>
 				  </el-row>
+				  
 				  <el-row :gutter="10">
+					  <!--<el-col :span="12">
+						  <el-form-item label="Maintenance Count" prop="repair_cnt">
+							<el-input v-model="form.repair_cnt" ></el-input>
+						  </el-form-item>
+					  </el-col>
+					  -->
 					  <el-col :span="12">
 						<el-form-item label="Region" prop="region">
 						<el-input v-model="form.region" ></el-input>
 						</el-form-item>
 					  </el-col>
 				  </el-row>
+				  
 			 </el-form>
 			 <span slot="footer" class="dialog-footer">
 			 <el-button @click="add_visible = false">Cancel</el-button>
-         <el-button id ="bt_ok" plain type="primary" @click="add_dev_manage()">OK</el-button>
+			 <el-button id ="bt_ok" plain type="primary" @click="add_dev_manage()">Confirm</el-button>
 			 </span>
 			</el-dialog>
 			
-        <!-- Update device dialog -->
+			
 			<el-dialog
-         title="Device Information"
+			 title="Equipment Information"
 			 :visible.sync="update_visible"
 			 :lock-scroll ="false"
 			 width="45%">
-         <el-form ref="bform" :model="form" :rules="rules" label-width="120px" :inline="false" class="demo-form-inline" size="medium">
+			 <el-form ref="bform" :model="form" :rules="rules" label-width="100px" :inline="false" class="demo-form-inline" size="medium">
+				  
 				  <el-row :gutter="10">
 					  <el-col :span="12">
 						  <el-form-item label="Well Name"  prop="wellname">
-                      <el-select v-model="form.wellname" filterable placeholder="Please select well name" disabled >
+						  <el-select v-model="form.wellname" filterable placeholder="Select well name" disabled >
 						      <el-option
 						        v-for="item in wellnames"
 						        :key="item.value"
@@ -423,14 +441,15 @@ var devcomponent_en = {
 						  </el-form-item>
 					  </el-col>
 					  <el-col :span="12">
-                          <el-form-item label="Series No." prop="sid">
+							  <el-form-item label="Serial Number" prop="sid">
 							  <el-input v-model="form.sid" ></el-input>
 							  </el-form-item>
 					  </el-col>
 				  </el-row>
+				  
 				  <el-row :gutter="10">
 					  <el-col :span="12">
-                      <el-form-item label="Serial No." prop="iid">
+						  <el-form-item label="ID" prop="iid">
 						  <el-input v-model="form.iid" ></el-input>
 						  </el-form-item>
 					  </el-col>
@@ -440,6 +459,7 @@ var devcomponent_en = {
 						  </el-form-item>
 					  </el-col>
 				  </el-row>
+							  
 				  <el-row :gutter="10">
 					  <el-col :span="12">
 						  <el-form-item label="Production Date" prop="p_date">
@@ -486,20 +506,21 @@ var devcomponent_en = {
 								value-format="yyyy-MM-dd">
 					  	   </el-date-picker>
 					    </el-form-item>
-                  </el-col>
 					  </el-row>
+							  
 				  <el-row :gutter="10">
 						  <el-col :span="12">
-                          <el-form-item label="Total Working Time" prop="total_wt">
+							  <el-form-item label="Total Production Hours" prop="total_wt">
 								<el-input v-model="form.total_wt" ></el-input>
 							  </el-form-item>
 						  </el-col>
 						  <el-col :span="12">
-                        <el-form-item label="Current Working Time" prop="cur_wt">
+						    <el-form-item label="Current Session Hours" prop="cur_wt">
 						  	<el-input v-model="form.cur_wt" ></el-input>
 						    </el-form-item>
 						  </el-col>
 				  </el-row>
+				  
 				  <el-row :gutter="10">
 					  <el-col :span="12">
 						  <el-form-item label="Location" prop="location">
@@ -512,17 +533,24 @@ var devcomponent_en = {
 					    </el-form-item>
 					  </el-col>
 				  </el-row>
+				  
 				  <el-row :gutter="10">
+					  <!--<el-col :span="12">
+						  <el-form-item label="Maintenance Count" prop="repair_cnt">
+							<el-input v-model="form.repair_cnt" ></el-input>
+						  </el-form-item>
+					  </el-col>-->
 					  <el-col :span="12">
 						<el-form-item label="Region" prop="region">
 						<el-input v-model="form.region" ></el-input>
 						</el-form-item>
 					  </el-col>
 				  </el-row>
+				  
 			 </el-form>
 			 <span slot="footer" class="dialog-footer">
 			 <el-button @click="update_visible = false">Cancel</el-button>
-         <el-button id ="bt_ok" plain type="primary" @click="update_dev_manage()">OK</el-button>
+			 <el-button id ="bt_ok" plain type="primary" @click="update_dev_manage()">Confirm</el-button>
 			 </span>
 			</el-dialog>
 		</div>

scripts/dev.js

@@ -1,5 +1,4 @@
-//组件
+var devcomponent = {
-	var devcomponent = {
 		template:`
 		<div>
 			<div style="display: flex;margin-top: 10px; flex-wrap: wrap; align-items: center;">
@@ -53,11 +52,11 @@
 					<el-button style="margin-left: 5px;" plain type="primary" icon="el-icon-document-checked" @click="exportWellDetail()">导出井位明细</el-button>
 				</div>
 			</div>
-<div class="span" v-if='radio1=="1"' style="max-height: calc(100vh - 200px); overflow-x: auto;">
+			<div class="span" v-if='radio1=="1"' style="height: calc(100vh - 200px); overflow-x: auto;">
 				<el-table
 				    :data="tableData"
 				    style="width: 100%;font-size:14px"
-				    :height="tHeight"
+				    height="100%"
 					:cell-style="{background:'#304156'}"
 					border
 					>
@@ -561,14 +560,13 @@
 		console.log("screen width:",screenW);
 		console.log("screen height:",screenH);
 	  return {
-		tHeight:screenH-192,
+            tHeight1: screenH * 0.5,
-		tHeight1:screenH*0.5,
+            tableData: [],
-		tableData: Array(0),
+            input: '',
-		input:'',
             currentPage: 1,
-		pagesize:50,
+            pagesize: 50,
-		recordTotal:0,
+            recordTotal: 0,
-		radio1:'1',
+            radio1: '1',
 		
 		// 设备列表相关数据
 		devListTableData: [],
@@ -1254,7 +1252,6 @@
 			});
 			
 	},
-	
 	}	
 	}