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); ...@@ -6,6 +6,8 @@ let productList = (params) => postAction(prefix + "/product/list" , params);
let productDelete = (id) => postAction(prefix + "/product/delete/"+id); let productDelete = (id) => postAction(prefix + "/product/delete/"+id);
let productInsert = (params) => postAction(prefix + "/product/insert" , params); let productInsert = (params) => postAction(prefix + "/product/insert" , params);
let productUpdate = (params) => postAction(prefix + "/product/update",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); let universityList = (params) => postAction(prefix + "/university/list" , params);
...@@ -13,6 +15,7 @@ let universityDelete = (id) => postAction(prefix + "/university/delete/"+id); ...@@ -13,6 +15,7 @@ let universityDelete = (id) => postAction(prefix + "/university/delete/"+id);
let universityInsert = (params) => postAction(prefix + "/university/insert" , params); let universityInsert = (params) => postAction(prefix + "/university/insert" , params);
let universityUpdate = (params) => postAction(prefix + "/university/update",params); let universityUpdate = (params) => postAction(prefix + "/university/update",params);
//宽带订单 //宽带订单
let orderViewList = (params) => postAction(prefix + "/orderView/list" , params); let orderViewList = (params) => postAction(prefix + "/orderView/list" , params);
let download = (params) => downFilePost(prefix + "/orderView/download/" , params); let download = (params) => downFilePost(prefix + "/orderView/download/" , params);
...@@ -27,5 +30,6 @@ export { ...@@ -27,5 +30,6 @@ export {
universityInsert, universityInsert,
universityUpdate, universityUpdate,
orderViewList, orderViewList,
download download,
universitySchool
} }
src/views/poster/PosterList.vue
...@@ -17,7 +17,6 @@ ...@@ -17,7 +17,6 @@
<a-button @click="search()" type="primary">查询</a-button> <a-button @click="search()" type="primary">查询</a-button>
<a-divider type="vertical"/> <a-divider type="vertical"/>
<a-upload <a-upload
action="https://www.mocky.io/v2/5cc8019d300000980a055e76"
:beforeUpload="uploadPicture" :beforeUpload="uploadPicture"
> >
<a-button> <a-icon type="upload" /> 上传图片 </a-button> <a-button> <a-icon type="upload" /> 上传图片 </a-button>
...@@ -84,6 +83,7 @@ ...@@ -84,6 +83,7 @@
}, },
data(){ data(){
return { return {
pictureSize:2,//限制图片大小，M为单位
emptyText: {emptyText: '暂无数据'}, emptyText: {emptyText: '暂无数据'},
jumpPath:'http://hhrcode.winsun-aly.com/#/hhr/home?id=', jumpPath:'http://hhrcode.winsun-aly.com/#/hhr/home?id=',
imgInfo:'', imgInfo:'',
...@@ -170,36 +170,45 @@ ...@@ -170,36 +170,45 @@
this.visiblepicture=true this.visiblepicture=true
}, },
uploadPicture(file) { uploadPicture(file) {
return new Promise(resolve => { let fileSize = file.size/1024/1024
const reader = new FileReader(); console.log(fileSize)
reader.readAsDataURL(file); if(fileSize > this.pictureSize){
reader.onload = () => { this.$message.error('上传失败！图片大小不能超过'+this.pictureSize+'M',5);
const img = document.createElement('img'); return new Promise(resolve => {})
img.src = reader.result; }else {
img.onload = () => { return new Promise(resolve => {
const limitWidth = arguments[2] ? arguments[2] : 640; const reader = new FileReader();
const width = img.width > limitWidth ? limitWidth : img.width; reader.readAsDataURL(file);
const height = img.width > limitWidth ? parseInt((img.height * limitWidth) / img.width) : img.height; reader.onload = () => {
const canvas = document.createElement('canvas'); const img = document.createElement('img');
const ctx = canvas.getContext('2d'); img.src = reader.result;
canvas.width = width img.onload = () => {
canvas.height = height const limitWidth = arguments[2] ? arguments[2] : 640;
ctx.fillStyle = '#fff' const width = img.width > limitWidth ? limitWidth : img.width;
ctx.fillRect(0,0,canvas.width,canvas.height) const height = img.width > limitWidth ? parseInt((img.height * limitWidth) / img.width) : img.height;
ctx.drawImage(img,0,0,width,height) const canvas = document.createElement('canvas');
const picture = canvas.toDataURL('image/jpeg') const ctx = canvas.getContext('2d');
return uploadPicture({picture}).then(res => { canvas.width = width
if(res == 'error'){ canvas.height = height
this.$message.error('删除失败！',5); ctx.fillStyle = '#fff'
} ctx.fillRect(0,0,canvas.width,canvas.height)
if(res.state == 'success'){ ctx.drawImage(img,0,0,width,height)
this.search() const picture = canvas.toDataURL('image/jpeg')
this.$message.success(res.data,5); 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){ addPoster(picture){
let url = this.jumpPath+this.$store.state.user.info.id let url = this.jumpPath+this.$store.state.user.info.id
......
src/views/school-center/product/product.vue
...@@ -53,6 +53,27 @@ ...@@ -53,6 +53,27 @@
</s-table> </s-table>
<!----弹框--> <!----弹框-->
<a-modal :title="add ?'添加宽带': '编辑宽带'" :visible="modifyvisible" @ok="createfunctionOk" @cancel="createfunctionCancel" html-type="submit" width="1024px"> <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 :form="Formtable">
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="宽带标题："> <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> <a-input placeholder="宽带标题" v-decorator="[ 'productTitle', {rules: [{ required: true, message: '宽带标题不能为空！' ,validator: 'click'}]} ]"></a-input>
...@@ -70,7 +91,11 @@ ...@@ -70,7 +91,11 @@
<a-input placeholder="包年包月情况" v-decorator="[ 'productRate', {rules: [{ required: true, message: '包年包月情况不能为空！' ,validator: 'click'}]} ]"></a-input> <a-input placeholder="包年包月情况" v-decorator="[ 'productRate', {rules: [{ required: true, message: '包年包月情况不能为空！' ,validator: 'click'}]} ]"></a-input>
</a-form-item> </a-form-item>
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="适用学校："> <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>
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="套餐情况："> <a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="套餐情况：">
<a-input :rows="10" v-model="modelData.productMealPrice"/> <a-input :rows="10" v-model="modelData.productMealPrice"/>
...@@ -98,7 +123,7 @@ ...@@ -98,7 +123,7 @@
<script> <script>
import STable from '@/components/table'; 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'; import {cloneObject} from '@/utils/util';
export default { export default {
name: "product", name: "product",
...@@ -107,6 +132,11 @@ ...@@ -107,6 +132,11 @@
}, },
data(){ data(){
return { return {
universityIdtrue:true,
universityName:'',
visibleT:false,
chouti:{},
universitySchool:[],
emptyText: {emptyText: '暂无数据'}, emptyText: {emptyText: '暂无数据'},
Formtable: this.$form.createForm(this), Formtable: this.$form.createForm(this),
modifyvisible: false, modifyvisible: false,
...@@ -120,6 +150,7 @@ ...@@ -120,6 +150,7 @@
productState :'' // 宽带狀態 productState :'' // 宽带狀態
}, },
modelData:{ modelData:{
universityId:'',
productMealPrice:'', productMealPrice:'',
productMeal:'', productMeal:'',
productTitle:'', productTitle:'',
...@@ -183,6 +214,15 @@ ...@@ -183,6 +214,15 @@
} }
}, },
methods:{ methods:{
universitySchoolName(item){
if(item == '请选择'){
this.modelData.productUniversity=item
}else {
this.modelData.productUniversity=item.universityName
this.modelData.universityId=item.universityId
this.chouti=item
}
},
search() { search() {
this.$refs.table.refresh({search: true}) this.$refs.table.refresh({search: true})
}, },
...@@ -195,16 +235,21 @@ ...@@ -195,16 +235,21 @@
}) })
}, },
modifyfunction(data){ modifyfunction(data){
universitySchool().then(res => {
this.universitySchool=res.data
})
if(data != undefined ){ if(data != undefined ){
this.productIntroduction=data.productIntroduction, this.productIntroduction=data.productIntroduction,
this.productSetMealIntroduction=data.productSetMealIntroduction, this.productSetMealIntroduction=data.productSetMealIntroduction,
this.modelData.productMealPrice=data.productMealPrice this.modelData.productMealPrice=data.productMealPrice
this.modelData.productUniversity=data.productUniversity
this.universityName=data.productUniversity
this.modelData.universityId=data.universityId
this.modelData.productId=data.productId this.modelData.productId=data.productId
setTimeout(()=>{ setTimeout(()=>{
this.Formtable.setFieldsValue({ this.Formtable.setFieldsValue({
"productMeal":data.productMeal, "productMeal":data.productMeal,
"productTitle":data.productTitle, "productTitle":data.productTitle,
"productUniversity":data.productUniversity,
"productPrice":data.productPrice, "productPrice":data.productPrice,
"productRegion":data.productRegion, "productRegion":data.productRegion,
"productRate":data.productRate, "productRate":data.productRate,
...@@ -212,18 +257,24 @@ ...@@ -212,18 +257,24 @@
}) })
},0) },0)
this.add=false; this.add=false;
}else {
this.universityName='请选择'
} }
this.modifyvisible=true; this.modifyvisible=true;
}, },
createfunctionOk(){ createfunctionOk(){
if(this.modelData.universityId == '' || this.modelData.universityId == undefined || this.modelData.productUniversity=='请选择'){
this.$notification.error({message: '请选择适用学校', duration: 4})
return
}
let that = this; 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 ) { if (err ) {
return; return;
} }
that.modelData.productMeal=values.productMeal that.modelData.productMeal=values.productMeal
that.modelData.productTitle=values.productTitle that.modelData.productTitle=values.productTitle
that.modelData.productUniversity=values.productUniversity
that.modelData.productPrice=values.productPrice that.modelData.productPrice=values.productPrice
that.modelData.productRegion=values.productRegion that.modelData.productRegion=values.productRegion
that.modelData.productRate=values.productRate that.modelData.productRate=values.productRate
...@@ -267,10 +318,11 @@ ...@@ -267,10 +318,11 @@
that.modelData.productId='' that.modelData.productId=''
that.modelData.productIntroduction='' that.modelData.productIntroduction=''
that.modelData.productSetMealIntroduction='' that.modelData.productSetMealIntroduction=''
that.modelData.productUniversity='',
that.modelData.universityId='',
this.Formtable.setFieldsValue({ this.Formtable.setFieldsValue({
productMeal:'', productMeal:'',
productTitle:'', productTitle:'',
productUniversity:'',
productPrice:'', productPrice:'',
productRegion:'', productRegion:'',
productRate:'', 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