Skip to content

任超 / js.CadastralSystem

Go to a project
Toggle navigation
Toggle navigation pinning
84e6cb3e by 杨威
Options

工具条功能更新

1 parent 3d3e9b4d
Inline Side-by-side
Showing 1 changed file with 167 additions and 0 deletions
1 <template>
2 <div class="printTemplate">
3 <el-form :rules="rules" :model="formData" ref="printForm" label-width="80px">
4 <el-form-item label="标题:" prop="title">
5 <el-input v-model="formData.title"></el-input>
6 </el-form-item>
7 <el-form-item label="格式:" prop="format">
8 <el-select v-model="formData.format" placeholder="请选择格式">
9 <el-option
10 v-for="(item,index) in formats"
11 :key="index"
12 :label="item"
13 :value="item">
14 </el-option>
15 </el-select>
16 </el-form-item>
17 <el-form-item label="模板:" prop="layOut">
18 <el-select v-model="formData.layOut" placeholder="请选择格式">
19 <el-option
20 v-for="(item,index) in layouts"
21 :key="index"
22 :label="item.label"
23 :value="item.value">
24 </el-option>
25 </el-select>
26 </el-form-item>
27 <el-form-item label="作者" prop="author">
28 <el-input v-model="formData.author"></el-input>
29 </el-form-item>
30 <el-form-item v-show="!isSuccess">
31 <el-button type="primary" @click="onSubmit('printForm')">确定</el-button>
32 <el-button @click="resetForm('printForm')">重置</el-button>
33 </el-form-item>
34 <el-form-item v-show="isSuccess">
35 <el-button type="primary" @click="showResult">预览</el-button>
36 </el-form-item>
37 </el-form>
38 </div>
39 </template>
40
41 <script>
42 import mapTools from './js/mapTools.js'
43 export default{
44 props:{
45 viewId:{
46 type:String,
47 default:""
48 }
49 },
50 mixins:[mapTools],
51 data(){
52 return{
53 formData:{
54 title:"地图",
55 author:"",
56 layOut:"map-only",
57 format:"png32"
58 },
59 formats:[
60 "pdf","png32","png8","jpg","gif","eps","svg","svgz"
61 ],
62 layouts:[
63 {
64 label:"仅地图",
65 value:"map-only"
66 },
67 {
68 label:"A3横向",
69 value:"a3-landscape"
70 },
71 {
72 label:"A3纵向",
73 value:"a3-portrait"
74 },
75 {
76 label:"A4横向",
77 value:"a4-landscape"
78 },
79 {
80 label:"A4纵向",
81 value:"a4-portrait"
82 },
83 {
84 label:"letter横向",
85 value:"letter-ansi-a-landscape"
86 },
87 {
88 label:"letter纵向",
89 value:"letter-ansi-a-portrait"
90 },
91 {
92 label:"B开横向",
93 value:"tabloid-ansi-b-landscape"
94 },
95 {
96 label:"B纵向",
97 value:"tabloid-ansi-b-portrait"
98 }
99 ],
100 rules:{
101 title: [
102 { required: true, message: '请输入标题' },
103 { min: 2, max: 10, message: '长度在 2 到 10 个字符' }
104 ],
105 author:[
106 { min: 2, max: 10, message: '长度在 2 到 10 个字符' }
107 ],
108 layOut:[
109 { required: true, message: '请选择模板' }
110 ],
111 format:[
112 { required: true, message: '请选择格式' }
113 ]
114 },
115 serverUrl:"http://192.168.2.201:6080/arcgis/rest/services/Utilities/PrintingTools/GPServer/Export%20Web%20Map%20Task",
116 isSuccess:false,
117 retrurnUrl:""
118 }
119 },
120 mounted(){
121 this.initData();
122 },
123 methods:{
124 initData(){
125 this.isSuccess = false;
126 this.retrurnUrl = "";
127 this.formData = {
128 title:"地图",
129 author:"",
130 layOut:"map-only",
131 format:"png32"
132 }
133 },
134 onSubmit(formName){
135 var self = this;
136 this.$refs[formName].validate((valid) => {
137 if (valid) {
138 this.printMap(this.viewId,null,this.serverUrl,this.formData,function(res){
139 if(res.url){
140 self.isSuccess = true;
141 self.retrurnUrl = res.url;
142 }
143 });
144 } else {
145 console.log('error submit!!');
146 return false;
147 }
148 });
149 },
150 showResult(){
151 window.open(this.retrurnUrl);
152 this.isSuccess = false;
153 },
154 resetForm(formName) {
155 this.formData = {
156 title:"地图",
157 author:"",
158 layOut:"map-only",
159 format:"png32"
160 }
161 }
162 }
163 }
164 </script>
165
166 <style scoped lang="less">
167 </style>