rpa
/
eladmin-web
5
0
Förgrening 0
Kod Ärenden 0 Pull-förfrågningar 0 Släpp 0 Wiki Aktiviteter
Rap 原分销系统代码Web
Du kan inte välja fler än 25 ämnen Ämnen måste starta med en bokstav eller siffra, kan innehålla bindestreck ('-') och vara max 35 tecken långa.
2 Incheckningar
2 Grenar
3.1MB
Träd: 4319823210
Grenar Taggar
${ item.name }
Skapa branchen ${ searchTerm }
från '4319823210'
${ noResults }
eladmin-web/.svn/pristine/f4/f4fc021f9a6cdd11a5a347a3a25...

725 lines
21KB
Rå Blame Historik 

  1. <template>

  2. 	<div class="app-container">

  3.   	<div style="margin-bottom:10px">

  4.   		<el-button type="success" @click="addBtn">新增</el-button>

  5. 		<el-button type="success" @click="importBtn">导入</el-button>

  6. 		<el-button type="success" @click="exportTempBtn">模版下载</el-button>

  7.   	</div>

  8.     <!--搜索-->

  9.     <el-form class="mt_15" ref="form" inline size="small">

  10.   		<el-form-item label="所属国家简称">

  11.     		<el-input v-model.trim="searchParm.contntryShort" clearable placeholder='所属国家简称'></el-input>

  12.   		</el-form-item>

  13.   		<el-form-item label="IP地址">

  14.     		<el-input v-model.trim="searchParm.ipAddress" clearable placeholder='IP地址'></el-input>

  15.   		</el-form-item>

  16.   		<el-form-item label="父ip地址">

  17.     		<el-input v-model.trim="searchParm.parentIpAddress" clearable placeholder='父ip地址'></el-input>

  18.   		</el-form-item>

  19.   		<el-form-item label="端口">

  20.     		<el-input v-model.trim="searchParm.port" clearable placeholder='端口'></el-input>

  21.   		</el-form-item>

  22.   		<el-form-item label="名称">

  23.     		<el-input v-model.trim="searchParm.name" clearable placeholder='名称'></el-input>

  24.   		</el-form-item>

  25. 		<el-form-item label="密码">

  26.     		<el-input v-model.trim="searchParm.pwd" clearable placeholder='密码'></el-input>

  27.   		</el-form-item>

  28. 		<el-form-item label="mac地址">

  29.     		<el-input v-model.trim="searchParm.mac" clearable placeholder='mac地址'></el-input>

  30.   		</el-form-item>

  31. 		<el-form-item label="VPS类型">

  32. 			<el-select v-model.trim="searchParm.vpsType" placeholder="请选择">

  33. 			    <el-option

  34. 			      v-for="item in searchVpsTypeList"

  35. 			      :key="item.value"

  36. 			      :label="item.label"

  37. 			      :value="item.value">

  38. 			    </el-option>

  39. 			</el-select>

  40.   		</el-form-item>

  41. 		<el-form-item label="经销商">

  42.     		<el-select v-model.trim="searchParm.dealer" placeholder="请选择">

  43. 			    <el-option

  44. 			      v-for="item in searchDealerList"

  45. 			      :key="item.value"

  46. 			      :label="item.label"

  47. 			      :value="item.value">

  48. 			    </el-option>

  49. 			</el-select>

  50.   		</el-form-item>

  51. 		<el-form-item label="状态">

  52.     		<el-select v-model.trim="searchParm.status" placeholder="请选择">

  53. 			    <el-option

  54. 			      v-for="item in searchStatusList"

  55. 			      :key="item.value"

  56. 			      :label="item.label"

  57. 			      :value="item.value">

  58. 			    </el-option>

  59. 			</el-select>

  60.   		</el-form-item>

  61.   		<el-form-item>

  62.     		<el-button type="primary" @click="goSearch">搜索</el-button>

  63.     		<el-button type="warning" @click="resetForm">重置</el-button>

  64.   		</el-form-item>

  65. 	</el-form>

  66.     <!--表格渲染-->

  67.     <el-table ref="table" border size="small" :data="list" :header-cell-style="{textAlign:'center'}" :cell-style="{textAlign:'center'}">

  68.       <el-table-column label="序号" type="index" width="50" />

  69.       <el-table-column label="所属国家简称" prop="contntryShort" />

  70.       <el-table-column label="IP地址" prop="ipAddress" />

  71.       <el-table-column label="父ip地址" prop="parentIpAddress" />

  72.       <el-table-column label="端口" prop="port" />

  73. 	  <el-table-column label="名称" prop="name" />

  74.       <el-table-column label="密码" prop="pwd" />

  75.       <el-table-column label="VPS类型" prop="vpsType">

  76. 		<template slot-scope="scope">

  77.       		{{ scope.row.vpsType | getVpsType}}

  78.       	</template>

  79. 	  </el-table-column>

  80.       <el-table-column label="经销商" prop="dealer">

  81. 		<template slot-scope="scope">

  82.       		{{ scope.row.dealer | getDealer}}

  83.       	</template>

  84. 	  </el-table-column>

  85. 	  <el-table-column label="mac地址" prop="mac" />

  86.       <el-table-column label="状态" prop="status">

  87. 		<template slot-scope="scope">

  88.       		{{ scope.row.status | getStatus}}

  89.       	</template>

  90. 	  </el-table-column>

  91.       <el-table-column label="创建时间" prop="createdAt" />

  92.       <el-table-column label="修改时间" prop="updatedAt" />

  93.       <el-table-column label="操作" width="220">

  94.       	<template slot-scope="scope">

  95.     		<el-button type="info" @click="getBtnById(scope.row.id)">查看</el-button>

  96.       		<el-button type="warning" @click="editById(scope.row)">修改</el-button>

  97.       		<el-button type="danger" @click="delById(scope.row.id)">删除</el-button>

  98.       	</template>

  99.       </el-table-column>

  100.     </el-table>

  101.     <!--分页-->

  102.     <div class="mt_15">

  103. 	    <el-pagination

  104. 	      @size-change="handleSizeChange"

  105. 	      @current-change="handleCurrentChange"

  106. 	      :current-page="searchParm.page"

  107. 	      :page-sizes="[10, 20, 30, 40, 50]"

  108. 	      :page-size="searchParm.pageSize"

  109. 	      layout="total, sizes, prev, pager, next, jumper"

  110. 	      :total="total">

  111. 	    </el-pagination>

  112.   </div>

  113.   

  114.   <!--新增弹窗-->

  115.   <el-dialog :visible.sync="dialogAddVisible" :title="dialogAddTitle" center width="45%">

  116.   	<div class="dialog-content">

  117.   		 <el-form ref="addParm" size="small" :model="addParm" :rules="rules" label-width="130px">

  118.   		 	<el-form-item label="所属国家简称" prop="contntryShort">

  119. 	    		<el-input v-model.trim="addParm.contntryShort" clearable></el-input>

  120. 	  		</el-form-item>

  121. 	  		<el-form-item label="IP地址" prop="ipAddress">

  122. 	    		<el-input v-model.trim="addParm.ipAddress" clearable></el-input>

  123. 	  		</el-form-item>

  124. 	  		<el-form-item label="父ip地址" prop="parentIpAddress">

  125. 	    		<el-input v-model.trim="addParm.parentIpAddress" clearable></el-input>

  126. 	  		</el-form-item>

  127. 	  		<el-form-item label="端口" prop="port">

  128. 	    		<el-input v-model.trim="addParm.port" clearable></el-input>

  129. 	  		</el-form-item>

  130. 			<el-form-item label="名称" prop="name">

  131. 	    		<el-input v-model.trim="addParm.name" clearable></el-input>

  132. 	  		</el-form-item>

  133. 			<el-form-item label="密码" prop="pwd">

  134. 	    		<el-input v-model.trim="addParm.pwd" clearable></el-input>

  135. 	  		</el-form-item>

  136. 			<el-form-item label="mac地址" prop="mac">

  137. 	    		<el-input v-model.trim="addParm.mac" clearable></el-input>

  138. 	  		</el-form-item>

  139. 	  		<el-form-item label="link" prop="link">

  140. 	    		<el-input v-model.trim="addParm.link" clearable></el-input>

  141. 	  		</el-form-item>

  142. 			<el-form-item label="VPS类型">

  143. 				<el-select v-model.trim="addParm.vpsType" placeholder="请选择">

  144. 			    	<el-option

  145. 			     	 v-for="item in vpsTypeList"

  146. 			      	:key="item.value"

  147. 			      	:label="item.label"

  148. 			      	:value="item.value">

  149. 			    	</el-option>

  150. 				</el-select>`

  151.   			</el-form-item>

  152. 			<el-form-item label="经销商">

  153.     			<el-select v-model.trim="addParm.dealer" placeholder="请选择">

  154. 			    	<el-option

  155. 			     	 v-for="item in dealerList"

  156. 			     	 :key="item.value"

  157. 			     	 :label="item.label"

  158. 			      	:value="item.value">

  159. 			    </el-option>

  160. 			</el-select>

  161.   			</el-form-item>

  162. 		</el-form>

  163.   	</div>

  164.   	<span slot="footer">

  165.   		<el-button type="info" @click="sureAddCancle('addParm')">取消</el-button>

  166.       <el-button type="primary" @click="sureAdd('addParm')">确认</el-button>

  167.   	</span>

  168.   </el-dialog>

  169.   

  170.   

  171.   <!--修改弹窗-->

  172.   <el-dialog :visible.sync="dialogEditVisible" :title="dialogEditTitle" center width="45%">

  173.   	<div class="dialog-content">

  174.   		 <el-form ref="editParm" size="small" :model="editParm" :rules="rules" label-width="130px">

  175.   		 	<el-form-item label="所属国家简称" prop="contntryShort">

  176. 	    		<el-input v-model.trim="editParm.contntryShort" clearable></el-input>

  177. 	  		</el-form-item>

  178. 	  		<el-form-item label="IP地址" prop="ipAddress">

  179. 	    		<el-input v-model.trim="editParm.ipAddress" clearable></el-input>

  180. 	  		</el-form-item>

  181. 	  		<el-form-item label="父ip地址" prop="parentIpAddress">

  182. 	    		<el-input v-model.trim="editParm.parentIpAddress" clearable></el-input>

  183. 	  		</el-form-item>

  184. 	  		<el-form-item label="端口" prop="port">

  185. 	    		<el-input v-model.trim="editParm.port" clearable></el-input>

  186. 	  		</el-form-item>

  187. 			<el-form-item label="名称" prop="name">

  188. 	    		<el-input v-model.trim="editParm.name" clearable></el-input>

  189. 	  		</el-form-item>

  190. 			<el-form-item label="密码" prop="pwd">

  191. 	    		<el-input v-model.trim="editParm.pwd" clearable></el-input>

  192. 	  		</el-form-item>

  193. 			<el-form-item label="mac地址" prop="mac">

  194. 	    		<el-input v-model.trim="editParm.mac" clearable></el-input>

  195. 	  		</el-form-item>

  196. 	  		<el-form-item label="link" prop="link">

  197. 	    		<el-input v-model.trim="editParm.link" clearable></el-input>

  198. 	  		</el-form-item>

  199. 			<el-form-item label="VPS类型">

  200. 				<el-select v-model.trim="editParm.vpsType" placeholder="请选择">

  201. 			    	<el-option

  202. 			     	 v-for="item in vpsTypeList"

  203. 			      	:key="item.value"

  204. 			      	:label="item.label"

  205. 			      	:value="item.value">

  206. 			    	</el-option>

  207. 				</el-select>`

  208.   			</el-form-item>

  209. 			<el-form-item label="经销商">

  210.     			<el-select v-model.trim="editParm.dealer" placeholder="请选择">

  211. 			    	<el-option

  212. 			     	 v-for="item in dealerList"

  213. 			     	:key="item.value"

  214. 			      	:label="item.label"

  215. 			      	:value="item.value">

  216. 			    </el-option>

  217. 			</el-select>

  218.   			</el-form-item>

  219. 			<el-form-item label="状态">

  220.     			<el-select v-model.trim="editParm.status" placeholder="请选择">

  221. 			    	<el-option

  222. 			    	  v-for="item in statusList"

  223. 			     	:key="item.value"

  224. 			      	:label="item.label"

  225. 			      	:value="item.value">

  226. 			   		 </el-option>

  227. 				</el-select>

  228.   			</el-form-item>

  229. 		</el-form>

  230.   	</div>

  231.   	<span slot="footer">

  232.   		<el-button type="info" @click="sureEditCancle(editParm)">取消</el-button>

  233.    		<el-button type="primary" @click="sureEdit('editParm')">确认</el-button>

  234.   	</span>

  235.   </el-dialog>

  236.   

  237.   <!--详情弹窗-->

  238.   <el-dialog :visible.sync="dialogDetailVisible" :title="dialogDetailTitle" center width="45%">

  239.   	<div class="dialog-content">

  240.   		 <el-form ref="form" size="small" label-width="130px">

  241.   		 	<el-form-item label="所属国家简称" prop="contntryShort">

  242. 	    		<el-input v-model.trim="detailParm.contntryShort" :disabled="true"></el-input>

  243. 	  		</el-form-item>

  244. 	  		<el-form-item label="IP地址" prop="ipAddress">

  245. 	    		<el-input v-model.trim="detailParm.ipAddress" :disabled="true"></el-input>

  246. 	  		</el-form-item>

  247. 	  		<el-form-item label="父ip地址" prop="parentIpAddress">

  248. 	    		<el-input v-model.trim="detailParm.parentIpAddress" :disabled="true"></el-input>

  249. 	  		</el-form-item>

  250. 	  		<el-form-item label="端口" prop="port">

  251. 	    		<el-input v-model.trim="detailParm.port" :disabled="true"></el-input>

  252. 	  		</el-form-item>

  253. 			<el-form-item label="名称" prop="name">

  254. 	    		<el-input v-model.trim="detailParm.name" :disabled="true"></el-input>

  255. 	  		</el-form-item>

  256. 			<el-form-item label="密码" prop="pwd">

  257. 	    		<el-input v-model.trim="detailParm.pwd" :disabled="true"></el-input>

  258. 	  		</el-form-item>

  259. 			<el-form-item label="mac地址" prop="mac">

  260. 	    		<el-input v-model.trim="detailParm.mac" :disabled="true"></el-input>

  261. 	  		</el-form-item>

  262. 	  		<el-form-item label="link" prop="link">

  263. 	    		<el-input v-model.trim="detailParm.link" :disabled="true"></el-input>

  264. 	  		</el-form-item>

  265. 			<el-form-item label="VPS类型">

  266. 				<el-select v-model.trim="detailParm.vpsType" disabled>

  267. 			    	<el-option

  268. 			     	 v-for="item in vpsTypeList"

  269. 			      	:key="item.value"

  270. 			      	:label="item.label"

  271. 			      	:value="item.value">

  272. 			    	</el-option>

  273. 				</el-select>`

  274.   			</el-form-item>

  275. 			<el-form-item label="经销商">

  276.     			<el-select v-model.trim="detailParm.dealer"  disabled placeholder="请选择">

  277. 			    	<el-option

  278. 			     	 v-for="item in dealerList"

  279. 			     	 :key="item.value"

  280. 			     	 :label="item.label"

  281. 			      	:value="item.value">

  282. 			    </el-option>

  283. 			</el-select>

  284.   			</el-form-item>

  285. 			<el-form-item label="状态" prop="status">

  286.     			<el-select v-model.trim="detailParm.status" disabled placeholder="请选择">

  287. 			    	<el-option

  288. 			    	  v-for="item in statusList"

  289. 			     	 :key="item.value"

  290. 			     	 :label="item.label"

  291. 			     	 :value="item.value">

  292. 			   		 </el-option>

  293. 				</el-select>

  294.   			</el-form-item>

  295. 		</el-form>

  296.   	</div>

  297.   </el-dialog>

  298. 

  299.   <!--Vpn信息导入  importBtn-->

  300.   <el-dialog :visible.sync="dialogImportVisible" :title="dialogImportTitle" center width="23%">

  301.   	<div class="dialog-content">                 

  302. 	  		<el-upload

  303. 				  class="upload-demo"

  304. 				  drag

  305. 				  ref="upload"

  306. 				  :action="uploadFileUrl"

  307. 				  :headers="uploadHeaders"

  308. 				  :show-file-list = "false"

  309. 				  :on-success="uploadSuccess"

  310. 				  :before-upload="beforeAvatarUpload"

  311. 				  multiple>

  312. 				  <i class="el-icon-upload"></i>

  313. 				  <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>

  314. 				  <div class="el-upload__tip" slot="tip">只能上传xlsl文件，且不超过10M</div>

  315. 				</el-upload>

  316.   	</div>

  317.   </el-dialog>

  318.   

  319.   </div>

  320. </template>

  321. <script>

  322. 	import { getList, add, delById, getById, editById} from '@/api/group/vpn'

  323. export default {

  324. 	filters: {

  325. 	  getVpsType: function (value) {

  326. 	   if(value == 1) {

  327. 	   	return '传统';

  328. 	   }

  329. 	  },

  330. 	  getDealer: function (value) {

  331. 	   if(value == 1) {

  332. 	   	return 'V2';

  333. 	   }

  334. 	  },

  335. 	  getStatus: function (value) {

  336. 	   if(value == 1) {

  337. 	   	return '可用';

  338. 	   } else if (value == 2) {

  339. 	   	return '禁用';

  340. 	   }

  341. 	  }

  342. 	},

  343. //	数据

  344.   data() {

  345.     return {

  346.     	searchParm: {

  347.     		page: 1,

  348.     		pageSize: 10,

  349.     		sort:'created_at',

  350.     		order:'desc',

  351. 			contntryShort:null,

  352.     		ipAddress:null,

  353.     		parentIpAddress:null,

  354.     		port:null,

  355.     		name:null,

  356. 			pwd:null,

  357.     		vpsType:null,

  358.     		dealer:null,

  359.     		mac:null,

  360. 			status:null,

  361.     	},

  362.     	total:0,

  363.       list: [],

  364. 	  uploadHeaders:{ Authorization: this.$store.getters.token },

  365.       dialogAddVisible: false,

  366.       dialogAddTitle: '新增',

  367.       dialogDetailVisible: false,

  368.       dialogDetailTitle: '详情',

  369.       dialogEditVisible: false,

  370.       dialogEditTitle: '修改',

  371. 	  dialogImportVisible: false,

  372.       dialogImportTitle:'导入',

  373. 	  uploadFileUrl: process.env.VUE_APP_BASE_API + '/api/ctVpn/import',

  374. 	  tempUrl: process.env.VUE_APP_BASE_API + '/api/ctVpn/exportTemp',

  375. 	  vpsTypeList:[

  376. 	        {

  377. 			value:1,

  378. 			label:"传统"

  379. 		}],

  380. 	  searchVpsTypeList:[{

  381. 			value: null,

  382. 			label: '全部'

  383. 		},

  384. 		{

  385. 			value:1,

  386. 			label:"传统"

  387. 		}],

  388. 		searchDealerList:[{

  389. 				value: null,

  390. 				label: '全部'

  391. 			},

  392. 			{

  393. 	          value: 1,

  394. 	          label: 'V2'

  395. 	    }],

  396. 		dealerList:[

  397. 			{

  398. 				value: 1,

  399. 				label: 'V2'

  400. 		}],

  401. 		searchStatusList:[{

  402. 				value: null,

  403. 				label: '全部'

  404. 			},

  405. 			{

  406. 				value: 1,

  407. 				label: '可用'

  408. 			},

  409. 			{

  410. 				value: 2,

  411. 				label: '禁用'

  412. 		}],

  413. 		statusList:[{

  414. 				value: 1,

  415. 				label: '可用'

  416. 			},

  417. 			{

  418. 				value: 2,

  419. 				label: '禁用'

  420. 		}],

  421.       addParm: {

  422. 		id:null,

  423. 		contntryShort:null,

  424.     	ipAddress:null,

  425.     	parentIpAddress:null,

  426.     	port:null,

  427.     	name:null,

  428. 		pwd:null,

  429.     	vpsType:null,

  430.     	dealer:null,

  431.     	mac:null,

  432.     	link:null,

  433. 		status:null,

  434.       },

  435.       detailParm: {

  436.       	id:null,

  437. 		contntryShort:null,

  438.     	ipAddress:null,

  439.     	parentIpAddress:null,

  440.     	port:null,

  441.     	name:null,

  442. 		pwd:null,

  443.     	vpsType:null,

  444.     	dealer:null,

  445.     	mac:null,

  446.     	link:null,

  447. 		status:null,

  448.       },

  449.       editParm: {

  450.       	id:null,

  451. 		contntryShort:null,

  452.     	ipAddress:null,

  453.     	parentIpAddress:null,

  454.     	port:null,

  455.     	name:null,

  456. 		pwd:null,

  457.     	vpsType:null,

  458.     	dealer:null,

  459.     	mac:null,

  460.     	link:null,

  461. 		status:null,

  462.       },

  463.       rules: {

  464.       	contntryShort: [

  465.             { required: true, message: '请输入国家简称', trigger: 'blur' }

  466.           ],

  467.       	ipAddress: [

  468.             { required: true, message: '请输入IP地址', trigger: 'blur' }

  469.           ],

  470.         parentIpAddress: [

  471.             { required: true, message: '请输入父ip地址', trigger: 'blur' }

  472.           ],

  473.         port: [

  474.             { required: true, message: '请输入端口', trigger: 'blur' },

  475. 			{pattern: /^[+]?(0|([1-9]\d*))?$/, message: "请输入正确数字", trigger: "blur"}

  476.           ],

  477.         name: [

  478.             { required: true, message: '请输入名称', trigger: 'blur' }

  479.           ],

  480. 		pwd: [

  481.             { required: true, message: '请输入密码', trigger: 'blur' }

  482.           ],

  483. 		vpsType: [

  484.             { required: true, message: '请输入VPS类型', trigger: 'blur' }

  485.           ],

  486. 		dealer: [

  487.             { required: true, message: '请输入经销商', trigger: 'blur' }

  488.           ],

  489. 		mac: [

  490.             { required: true, message: '请输入mac地址', trigger: 'blur' }

  491.           ],

  492.       	link: [

  493.         	{ required: true, message: '请输入Link信息', trigger: 'blur' }

  494.       	],

  495. 		status: [

  496.             { required: true, message: '请输入状态', trigger: 'blur' }

  497.           ]

  498.     	}

  499. 	}

  500.   },

  501.   // 调用

  502.   created() {

  503. 	this.goSearch()

  504.   },

  505. 	//方法

  506.   methods: {

  507. 	//重置

  508.   	resetForm() {

  509. 		this.searchParm.contntryShort = null;

  510.         this.searchParm.ipAddress = null;

  511.         this.searchParm.parentIpAddress = null;

  512.         this.searchParm.port = null;

  513.         this.searchParm.name = null;

  514.         this.searchParm.pwd = null;

  515. 		this.searchParm.vpsType = null;

  516.         this.searchParm.dealer = null;

  517.         this.searchParm.mac = null;

  518.         this.searchParm.status = null;

  519.         this.goSearch()

  520.     },

  521. 	//	查询

  522. 	goSearch() {

  523. 		this.searchParm.page=1

  524. 		this.getDataList()

  525. 	},

  526. 	//导入成功

  527. 	uploadSuccess(res, file) {

  528.   		this.dialogImportVisible = false;

  529.     	if(res.code==200) {

  530. 			console.log(res.data);

  531. 			if(res.data != null) {

  532. 				window.location.href = res.data;

  533. 				this.$message.error('导入失败!');

  534. 			}

  535.     		else{

  536. 				this.$message.success('导入成功!');

  537. 			}

  538. 			

  539. 		}

  540. 		this.goSearch();

  541.   	},

  542. 	beforeAvatarUpload(file) {

  543. 	    console.log(file);

  544. 	    const isLt10M = file.size / 1024 / 1024 <10;

  545. 	    if (!isLt10M) {

  546. 	      this.$message.error('上传Excel文件大小不能超过 10MB!');

  547. 	    }

  548. 	    return isLt10M;

  549. 	 },

  550. 	// 导入

  551. 	importBtn() {

  552. 		this.dialogImportVisible = true

  553. 	},

  554. 	//vpn模板

  555. 	exportTempBtn() {

  556. 		console.log(this.tempUrl)

  557. 		window.location.href = this.tempUrl;

  558. 	},

  559. 	// 新增

  560. 	addBtn(){

  561. 		this.addParm = {

  562. 			id:null,

  563. 			contntryShort:'',

  564.     		ipAddress:'',

  565.     		parentIpAddress:'',

  566.     		port:'',

  567.     		name:'',

  568. 			pwd:'',

  569.     		vpsType:null,

  570.     		dealer:null,

  571.     		mac:'',

  572.     		link:'',

  573. 			status:null,

  574.       }

  575. 		this.dialogAddTitle='新增'

  576. 		this.dialogAddVisible = true;

  577. 		this.$refs.addParm.clearValidate();

  578. 	},

  579. 	//	根据id删除

  580. 	delById(id){

  581. 		this.$confirm('确认删除?','提示',{

  582. 			confirmButtonText: '确定',

  583.       		cancelButtonText: '取消',

  584.       		type: 'warning'

  585. 		}).then(() => {

  586. 			delById({id}).then(res => {

  587. 				if(res.code==200) {

  588. 					this.$message.success('删除成功!')

  589. 					this.getDataList()

  590. 				}

  591. 			}).catch(err => {

  592. 				console.log(err)

  593. 			})

  594. 		}).catch(() => {

  595. 			this.$message.info('取消删除')

  596. 		})

  597. 	},

  598. 	//	修改

  599. 	editById(data){

  600. 		getById({id: data.id}).then(res => {

  601. 			if(res.code==200) {

  602. 				this.editParm.id = res.data.id;

  603. 				this.editParm.contntryShort = res.data.contntryShort;

  604. 				this.editParm.ipAddress = res.data.ipAddress;

  605. 				this.editParm.parentIpAddress = res.data.parentIpAddress;

  606. 				this.editParm.port = res.data.port;

  607. 				this.editParm.name = res.data.name;

  608. 				this.editParm.pwd = res.data.pwd;

  609. 				this.editParm.vpsType = res.data.vpsType;

  610. 				this.editParm.dealer = res.data.dealer;

  611. 				this.editParm.mac = res.data.mac;

  612. 				this.editParm.link = res.data.link;

  613. 				this.editParm.status = res.data.status;

  614. 				this.dialogEditVisible = true;

  615. 				this.$refs.editParm.clearValidate();

  616. 			}

  617. 		}).catch(err => {

  618. 			console.log(err)

  619. 		})

  620. 	},

  621. 	// 确认修改

  622. 	sureEdit(editParm){

  623. 		this.$refs[editParm].validate((valid) => {

  624. 		  if (valid) {

  625. 			editById(this.editParm).then(res => {

  626. 				if(res.code==200) {

  627. 					console.log(res);

  628. 					this.$refs.editParm.clearValidate();

  629. 					this.dialogEditVisible = false

  630. 					this.$message.success('修改成功!');

  631. 					this.getDataList();

  632. 				}

  633. 			}).catch(err => {

  634. 				console.log(err)

  635. 			})

  636. 		  } else {

  637. 			console.log('error submit!!');

  638. 			return false;

  639. 		  }

  640. 		});

  641. 	},

  642. 	// 确认新增

  643. 	sureAdd(addParm){

  644. 		

  645. 		this.$refs[addParm].validate((valid) => {

  646. 		  if (valid) {

  647. 			add(this.addParm).then(res => {

  648. 				if(res.code==200) {

  649. 					this.dialogAddVisible = false

  650. 					this.$message.success('新增成功!');

  651. 					this.$refs.addParm.clearValidate();

  652. 					this.getDataList()

  653. 				}

  654. 			}).catch(err => {

  655. 					console.log(err)

  656. 			})

  657. 		  } else {

  658. 			console.log('error submit!!');

  659. 			return false;

  660. 		  }

  661. 		});

  662. 	},

  663. 	sureAddCancle(addParm) {

  664. 		this.dialogAddVisible=flase;

  665. 		this.$refs.addParm.clearValidate();

  666. 	},

  667. 	sureEditCancle(editParm) {

  668. 		this.dialogEditVisible=false;

  669. 		this.$refs.editParm.clearValidate();

  670. 	},

  671. 	// 查看根据id

  672. 	getBtnById(id){

  673. 		getById({id}).then(res => {

  674. 			if(res.code==200) {

  675. 				this.detailParm.id = res.data.id;

  676. 				this.detailParm.contntryShort = res.data.contntryShort;

  677. 				this.detailParm.ipAddress = res.data.ipAddress;

  678. 				this.detailParm.parentIpAddress = res.data.parentIpAddress;

  679. 				this.detailParm.port = res.data.port;

  680. 				this.detailParm.name = res.data.name;

  681. 				this.detailParm.pwd = res.data.pwd;

  682. 				this.detailParm.vpsType = res.data.vpsType;

  683. 				this.detailParm.dealer = res.data.dealer;

  684. 				this.detailParm.mac = res.data.mac;

  685. 				this.detailParm.link = res.data.link;

  686. 				this.detailParm.status = res.data.status;

  687. 				this.dialogDetailVisible = true

  688. 				

  689. 			}

  690. 		}).catch(err => {

  691. 			console.log(err)

  692. 		})

  693. 	},

  694. 	// 分页获取表格数据

  695. 	getDataList(){

  696. 		getList(this.searchParm).then(res => {

  697. 				console.log(res)

  698. 				if(res.code==200) {

  699. 					console.log(res)

  700. 					this.list = res.data.list;

  701. 					this.total = res.data.total;

  702. 				}

  703. 			}).catch(err => {

  704. 				console.log(err)

  705. 			})

  706. 	},

  707. 	

  708. 	//	分页

  709. 	handleSizeChange(val) {

  710.    		console.log(`每页 ${val} 条`);

  711.    		this.searchParm.pageSize = val;

  712.    		this.getDataList();

  713.   	},

  714.   	handleCurrentChange(val) {

  715.     	console.log(`当前页: ${val}`);

  716.     	this.searchParm.page = val;

  717.     	this.getDataList();

  718.   	}

  719.   }

  720. }

  721. </script>

  722. 

  723. <style rel="stylesheet/scss" lang="scss" scoped>

  724. </style>