Skip to content

G
gdtel-gztel-school-center-ui
Commit 831e0a9b by 黄森林
Options

二维码图片上传大小限制和宽带修改

parent 459ca763
Showing with 102 additions and 37 deletions
src/api/school-center/productAPI.js
......@@ -6,6 +6,8 @@ let productList = (params) => postAction(prefix + "/product/list" , params);
let productDelete = (id) => postAction(prefix + "/product/delete/"+id);
let productInsert = (params) => postAction(prefix + "/product/insert" , params);
let productUpdate = (params) => postAction(prefix + "/product/update",params);
//适用学校
let universitySchool = (params) => postAction(prefix + "/university/universitySchool",params);
//大学宽带信息
let universityList = (params) => postAction(prefix + "/university/list" , params);
......@@ -13,6 +15,7 @@ let universityDelete = (id) => postAction(prefix + "/university/delete/"+id);
let universityInsert = (params) => postAction(prefix + "/university/insert" , params);
let universityUpdate = (params) => postAction(prefix + "/university/update",params);
//宽带订单
let orderViewList = (params) => postAction(prefix + "/orderView/list" , params);
let download = (params) => downFilePost(prefix + "/orderView/download/" , params);
......@@ -27,5 +30,6 @@ export {
universityInsert,
universityUpdate,
orderViewList,
download
download,
universitySchool
}
src/views/poster/PosterList.vue
......@@ -17,7 +17,6 @@
<a-button @click="search()" type="primary">查询</a-button>
<a-divider type="vertical"/>
<a-upload
action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
:beforeUpload="uploadPicture"
>
<a-button> <a-icon type="upload" /> 上传图片 </a-button>
......@@ -84,6 +83,7 @@
},
data(){
return {
pictureSize:2,//限制图片大小，M为单位
emptyText: {emptyText: '暂无数据'},
jumpPath:'http://hhrcode.winsun-aly.com/#/hhr/home?id=',
imgInfo:'',
......@@ -170,36 +170,45 @@
this.visiblepicture=true
},
uploadPicture(file) {
return new Promise(resolve => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => {
const img = document.createElement('img');
img.src = reader.result;
img.onload = () => {
const limitWidth = arguments[2] ? arguments[2] : 640;
const width = img.width > limitWidth ? limitWidth : img.width;
const height = img.width > limitWidth ? parseInt((img.height * limitWidth) / img.width) : img.height;
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
canvas.width = width
canvas.height = height
ctx.fillStyle = '#fff'
ctx.fillRect(0,0,canvas.width,canvas.height)
ctx.drawImage(img,0,0,width,height)
const picture = canvas.toDataURL('image/jpeg')
return uploadPicture({picture}).then(res => {
if(res == 'error'){
this.$message.error('删除失败！',5);
}
if(res.state == 'success'){
this.search()
this.$message.success(res.data,5);
}
})
let fileSize = file.size/1024/1024
console.log(fileSize)
if(fileSize > this.pictureSize){
this.$message.error('上传失败！图片大小不能超过'+this.pictureSize+'M',5);
return new Promise(resolve => {})
}else {
return new Promise(resolve => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => {
const img = document.createElement('img');
img.src = reader.result;
img.onload = () => {
const limitWidth = arguments[2] ? arguments[2] : 640;
const width = img.width > limitWidth ? limitWidth : img.width;
const height = img.width > limitWidth ? parseInt((img.height * limitWidth) / img.width) : img.height;
const canvas = document.createElement('canvas');
const ctx = canvas.getContext('2d');
canvas.width = width
canvas.height = height
ctx.fillStyle = '#fff'
ctx.fillRect(0,0,canvas.width,canvas.height)
ctx.drawImage(img,0,0,width,height)
const picture = canvas.toDataURL('image/jpeg')
console.log(picture.length)
return uploadPicture({picture}).then(res => {
if(res == 'error'){
this.$message.error('上传失败！',5);
this.search()
}
if(res.state == 'success'){
this.search()
this.$message.success(res.data,5);
}
})
};
};
};
});
});
}
},
addPoster(picture){
let url = this.jumpPath+this.$store.state.user.info.id
......
src/views/school-center/product/product.vue
......@@ -53,6 +53,27 @@
</s-table>
<!----弹框-->
<a-modal :title="add ?'添加宽带': '编辑宽带'" :visible="modifyvisible" @ok="createfunctionOk" @cancel="createfunctionCancel" html-type="submit" width="1024px">
<a-drawer
title="适用学校详情"
placement="right"
:closable="false"
@close="visibleT = false"
:visible="visibleT"
width=" 40%"
>
<p><span>学校名称：{{chouti.universityName}}</span></p>
<p><span>县分：{{chouti.universityRegion}}</span></p>
<p><span>装机地址：{{chouti.universityInstalledAddress}}</span></p>
<p><span>外线方式：{{chouti.universityExteriorLines}}</span></p>
<p><span>揽装工号：{{chouti.universityPackageNumber}}</span></p>
<p><span>地址ID：{{chouti.universityInstalledAddressId}}</span></p>
<p><span>用户类型：{{chouti.universityUserType}}</span></p>
<p><span>月租类型：{{chouti.universityMonthlyRentType}}</span></p>
<p><span>收费模式：{{chouti.universityChargeMode}}</span></p>
<p><span>计费属性：{{chouti.universityChargingAttribute}}</span></p>
<p><span>学校联系号码：{{chouti.universityContactPhone}}</span></p>
</a-drawer>
<a-form :form="Formtable">
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="宽带标题：">
<a-input placeholder="宽带标题" v-decorator="[ 'productTitle', {rules: [{ required: true, message: '宽带标题不能为空！' ,validator: 'click'}]} ]"></a-input>
......@@ -70,7 +91,11 @@
<a-input placeholder="包年包月情况" v-decorator="[ 'productRate', {rules: [{ required: true, message: '包年包月情况不能为空！' ,validator: 'click'}]} ]"></a-input>
</a-form-item>
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="适用学校：">
<a-input placeholder="适用学校" v-decorator="[ 'productUniversity', {rules: [{ required: true, message: '适用学校不能为空！' ,validator: 'click'}]} ]"></a-input>
<a-select v-model="universityName" style="width: 330px">
<a-select-option @click="universitySchoolName('请选择')" value="请选择">请选择</a-select-option>
<a-select-option @click="universitySchoolName(item)" v-for="item in universitySchool" :value="item.universityId">{{item.universityName}}</a-select-option>
</a-select>
<a @click="visibleT = true">详情</a>
</a-form-item>
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="套餐情况：">
<a-input :rows="10" v-model="modelData.productMealPrice"/>
......@@ -98,7 +123,7 @@
<script>
import STable from '@/components/table';
import {productList,productDelete,productInsert,productUpdate} from "@/api/school-center/productAPI"
import {productList,productDelete,productInsert,productUpdate,universitySchool} from "@/api/school-center/productAPI"
import {cloneObject} from '@/utils/util';
export default {
name: "product",
......@@ -107,6 +132,11 @@
},
data(){
return {
universityIdtrue:true,
universityName:'',
visibleT:false,
chouti:{},
universitySchool:[],
emptyText: {emptyText: '暂无数据'},
Formtable: this.$form.createForm(this),
modifyvisible: false,
......@@ -120,6 +150,7 @@
productState :'' // 宽带狀態
},
modelData:{
universityId:'',
productMealPrice:'',
productMeal:'',
productTitle:'',
......@@ -183,6 +214,15 @@
}
},
methods:{
universitySchoolName(item){
if(item == '请选择'){
this.modelData.productUniversity=item
}else {
this.modelData.productUniversity=item.universityName
this.modelData.universityId=item.universityId
this.chouti=item
}
},
search() {
this.$refs.table.refresh({search: true})
},
......@@ -195,16 +235,21 @@
})
},
modifyfunction(data){
universitySchool().then(res => {
this.universitySchool=res.data
})
if(data != undefined ){
this.productIntroduction=data.productIntroduction,
this.productSetMealIntroduction=data.productSetMealIntroduction,
this.modelData.productMealPrice=data.productMealPrice
this.modelData.productUniversity=data.productUniversity
this.universityName=data.productUniversity
this.modelData.universityId=data.universityId
this.modelData.productId=data.productId
setTimeout(()=>{
this.Formtable.setFieldsValue({
"productMeal":data.productMeal,
"productTitle":data.productTitle,
"productUniversity":data.productUniversity,
"productPrice":data.productPrice,
"productRegion":data.productRegion,
"productRate":data.productRate,
......@@ -212,18 +257,24 @@
})
},0)
this.add=false;
}else {
this.universityName='请选择'
}
this.modifyvisible=true;
},
createfunctionOk(){
if(this.modelData.universityId == '' || this.modelData.universityId == undefined || this.modelData.productUniversity=='请选择'){
this.$notification.error({message: '请选择适用学校', duration: 4})
return
}
let that = this;
that.Formtable.validateFields(['productMeal','productTitle','productPrice','productUniversity','productRegion','productRate','productState'], {force: true}, (err, values) => {
that.Formtable.validateFields(['productMeal','productTitle','productPrice','productRegion','productRate','productState'], {force: true}, (err, values) => {
if (err ) {
return;
}
that.modelData.productMeal=values.productMeal
that.modelData.productTitle=values.productTitle
that.modelData.productUniversity=values.productUniversity
that.modelData.productPrice=values.productPrice
that.modelData.productRegion=values.productRegion
that.modelData.productRate=values.productRate
......@@ -267,10 +318,11 @@
that.modelData.productId=''
that.modelData.productIntroduction=''
that.modelData.productSetMealIntroduction=''
that.modelData.productUniversity='',
that.modelData.universityId='',
this.Formtable.setFieldsValue({
productMeal:'',
productTitle:'',
productUniversity:'',
productPrice:'',
productRegion:'',
productRate:'',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment