You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
jin_ji_hu/src/views/ServiceAndDevelopment/index.vue

291 lines
14 KiB

<template>
<div class="L-public-main yewufazhan-box">
<div class="yewufazhanbox-left" v-loading="loading">
<div class="yewufazhanbox-header-box">
<div class="yewufazhan-title">文本编辑器</div>
<el-button @click="footbtn('一键生成')"></el-button>
</div>
<el-form :model="addFrom" size="small" ref="importFrom" :rules="rules" class="newArticle">
<el-row :gutter="20">
<el-col>
<el-form-item class="yewufazhanbox-input" prop="title">
<el-input v-model.trim="addFrom.title" placeholder="请输入报告模板标题"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col>
<el-form-item class="yewufazhanbox-input" prop="subheading">
<el-input v-model.trim="addFrom.subheading" placeholder="副标题"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item prop="content">
<myEditor height="480px" ref="myEditor" v-model="addFrom.content" @onFocus="onFocus" @onBlur="onBlur"></myEditor>
</el-form-item>
</el-col>
</el-row>
</el-form>
<div class="dialog-footer">
<el-form size="small">
<el-form-item class="dialog-from-item">
<el-button @click="footbtn('预览')" :disabled="isDisabled">预览</el-button>
<el-button type="primary" @click="footbtn('保存')"></el-button>
<el-button type="primary" @click="footbtn('导出')" :loading="exportLoading">导出</el-button>
</el-form-item>
</el-form>
</div>
</div>
<div class="yewufazhanbox-right">
<div class="yewufazhan-title-right">模板指标自定义选择</div>
<div class="yewufazhanbox-right-from">
<span>年份</span>
<el-date-picker v-model="nianfenvalue3" value-format="yyyy" format="yyyy" @change="timeChange" type="year" placeholder="选择年">
</el-date-picker>
</div>
<div class="yewufazhanbox-right-table">
<el-table :data="tableData" border header-align="center" stripe>
<el-table-column prop="dataName" label="数据项" width="180" align="center">
</el-table-column>
<el-table-column prop="years" label="统计年份" align="center">
</el-table-column>
<el-table-column prop="count" label="数值" align="center">
</el-table-column>
<el-table-column prop="shuzhi" label="操作" align="center">
<template slot-scope="scope">
<!-- <div class="yewufazhanbox-charu" @click="charu(scope.row)"></div> -->
<el-button type="text"class="yewufazhanbox-charu" @click="charu(scope.row)" :disabled="btnDisable">插入</el-button>
</template>
</el-table-column>
</el-table>
</div>
</div>
<el-dialog
title="查看详情"
:visible.sync="infoVisible"
:close-on-click-modal="false"
:close-on-press-escape="false"
@close="infoClose"
custom-class="info-dialog"
append-to-body
>
<div class="info-content">
<div class="info-title">{{ addFrom.title }}</div>
<div class="info-content-top">
<div>副标题{{ addFrom.subheading }}</div>
</div>
<div v-html="addFrom.content" class="info-content-content"></div>
</div>
<div slot="footer" class="dialog-footer">
<el-form size="small">
<el-form-item class="dialog-from-item">
<el-button size="mini" @click="infoClose"></el-button>
</el-form-item>
</el-form>
</div>
</el-dialog>
</div>
</template>
<script>
import myEditor from "@/views/components/myEditor/index.vue"
import { saveAs } from 'file-saver'
import { getToken } from '@/utils/auth'
import { blobValidate } from "@/utils/ruoyi";
import errorCode from '@/utils/errorCode'
import { templateMetrics, templateMetricsAdd } from "@/api/jin_ji_hu/ServiceDevelopment/index"
import axios from 'axios'
export default {
name: '',
components: { myEditor },
data() {
return {
VUE_APP_BASE_API:process.env.VUE_APP_BASE_API,
nianfenvalue3: "",
addFrom: {
title: "",
subheading: "",
content: "",
},
rules: {
title: [
{ required: true, message: '请输入报告模板标题', trigger: 'blur' }
],
// joinProject:[
// { required: true, message: '请填写政策等级', trigger: 'blur' }
// ],
subheading: [
{ required: true, message: '请输入副标题', trigger: 'blur' }
],
content: [
{ required: true, message: '请输入内容', trigger: 'blur' }
],
},
tableData: [],
btnDisable:true,
loading:false,
title : '苏州工业园区服务业发展情况',
subheading: "2023年4月",
content: "<p>一、总体实力显著增强</p><p>产业规模高速增长,综合贡献明显提升。</p><p>近年来,园区服务业保持持续增长态势,截至目前,园区服务业规上企业总计 677 家。2021年,园区实现服务业增加值 1674.4亿元占GDP 比重达 50.3%。2022年全年实现服务业增加值1753.18亿元,占 GDP 比重49.9%。2023年1-3月实现服务业增加值 405.95亿元同比增加4.2%。7大服务业核算行业(①多式联运和运输代理业、②装卸报运和仓储业、③互联网和相关服务、软件信息服务业、④租赁和商务服务业、(5居民服务、修理和其他服务业、⑥文化、体育和娱乐业、⑦科学研究和技术服务业)2022年全年营股1311.71亿元增速达22%:2023年1-3月实现营收 348.34亿元,同比增速 35%。根据苏州市新兴服务业行业分类(含金融服务、信息服务、物流服务、科技服务、商务中介服务、设计服务、人力资源服务、检验栓测认证、低碳绿色服务、现代商贸、文化消费、旅游康养等 12个类别)2022年国区新兴服务业营收达 1488.57 亿元,较上年增长 24%。</p><p>二、产业结构持续优化</p><p>产业结构还步优化生产性服务占主导。经过多年发展园区服务业产业结构逐渐多样化生产性服务业与生活性服务业基本形成7:3的格局。2022年生产性服务业增加值达到1199.5亿元占服务业增加值比重达68.筑。截至目前,园区生产性服务业规上企业总计 655家(含部分工业企业)。自 2019年苏州市开展全市生产恒服务业综合译价以来园区已连续两年考评优秀。37家国区企业入选苏州市生产性服务业领军企业占全市51%位全市第一并成为苏州首个实现生产性服务业9大重点领域(信息技术服务、研发设计、金融服务、检验检测认证、知识产权服务、节能环保服务、人力资源服务、现代供应蛙管理、商务服务)全度盖的区域。推动先进制造业和现代服务业深度融合发展2022年初园区获评江苏省两业融合深度融合试点地区。</p><p>城市活力不断提升,生活性服务显潜能。完成环金鸡湖商圈城市活力提升规划并正式发布,引导环金鸡湖商圈核心商业体差异定位、错位发展,金鸡湖景区获评第一批省级现代服务业高质量发展集聚示范区。积极引入北京及上海周边外溢资源,推动园区载体与国内优质品牌对接,加快发展“首店经济”(首店经济是指一个区域利用特有的资源优势,吸引国内外品牌在区域首次开设门店,目前国区大力推动“中国首店”“苏州首店”落户园区)。通过开展“云购金鸡湖”等活动,持续打造金鸡湖系列 IP宣传园区特色消费场景在后疫情时代不断激发生活性服务业发展能。</p>",
infoVisible:false,
isDisabled:true,
// 导出遮罩层
exportLoading: false,
}
},
watch:{
addFrom:{
handler(newvalue){
if(newvalue.title && newvalue.subheading && newvalue.content) {
let str = this.getText(newvalue.content);
if(!this.isNull(str)) {
this.isDisabled = false;
}
} else {
this.isDisabled = true;
}
},
deep:true
}
},
created() { },
mounted() {
let date = new Date();
let year = date.getFullYear();
this.nianfenvalue3 = year + ''
this.getList();
},
methods: {
getText(str){
return str.replace(/<[^<>]+>/g, "").replace(/&nbsp;/gi, "");
},
isNull(str){
if ( str == "" ) return true;
var regu = "^[ ]+$";
var re = new RegExp(regu);
return re.test(str);
},
// 插入
charu(item){
// console.log(item);
this.$refs.myEditor.interposition(item.count)
// 在选区插入文本 : editor.insertText('xxx') editor.dangerouslyInsertHtml(`<h1>标题</h1><p>文本 <b>加粗</b></p>`)
},
// 底部按钮
footbtn(type) {
if (type == '预览') {
this.infoVisible = true;
} else if (type == '保存') {
templateMetricsAdd(this.addFrom).then(res=>{
if(res.code == 200) {
this.$refs.importFrom.resetFields();
this.$message({
type: "success",
message: "新增成功!",
});
}
})
} else if (type == '一键生成') {
this.$confirm("是否覆盖当前内容 ?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
}).then(() => {
this.loading = true;
setTimeout(()=>{
this.addFrom.title = this.title;
this.addFrom.subheading = this.subheading;
this.addFrom.content = this.content;
this.loading = false;
},2000)
})
.catch(() => {
});
} else if (type == '导出') {
if(!this.isDisabled) {
this.$confirm("是否确认导出发展模板?", "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
/**
*
* {
...this.formInline
},
*/
.then(() => {
this.exportLoading = true;
axios({
method: 'get',
url: this.VUE_APP_BASE_API + "/jjh/templateMetrics/downloadLocal",
responseType: 'blob',
headers: { 'Authorization': 'Bearer ' + getToken() }
}).then((res) => {
console.log(res);
const isBlob = blobValidate(res.data);
if (isBlob) {
const blob = new Blob([res.data])
saveAs(blob, decodeURIComponent(res.headers['download-filename']))
} else {
this.printErrMsg(res.data);
}
})
// this.download(
// "/jjh/templateMetrics/downloadLocal",
// "发展模板" + new Date().getTime() + ".xlsx"
// );
this.exportLoading = false;
})
.catch((err) => {
console.log(err);
});
} else {
this.$message({
type: "warning",
message: "请填写内容",
});
}
}
},
async printErrMsg(data) {
const resText = await data.text();
const rspObj = JSON.parse(resText);
const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode['default']
Message.error(errMsg);
},
// 查询模板指标自定义选择
getList(){
templateMetrics({year:this.nianfenvalue3}).then(res=>{
this.tableData = res.data;
})
},
// 选择年份变化
timeChange(time){
this.getList()
},
onFocus(){
this.btnDisable = false;
},
onBlur(){
this.btnDisable = true;
},
// 关闭详情
infoClose(){
this.infoVisible = false;
},
},
computed: {}
}
</script>
<style scoped lang='scss'></style>