Commit 25f7177c authored by sheng du's avatar sheng du
Browse files

文件下载功能修改

parent 8dbdfc9a
...@@ -13,9 +13,11 @@ ...@@ -13,9 +13,11 @@
"dayjs": "^1.9.7", "dayjs": "^1.9.7",
"echarts": "^5.4.3", "echarts": "^5.4.3",
"element-ui": "^2.14.0", "element-ui": "^2.14.0",
"file-saver": "^2.0.5",
"gho-menu": "^1.0.1", "gho-menu": "^1.0.1",
"loadash": "^1.0.0", "loadash": "^1.0.0",
"mockjs": "^1.1.0", "mockjs": "^1.1.0",
"qrcode": "^1.5.3",
"vue": "^2.6.11", "vue": "^2.6.11",
"vue-functional-data-merge": "^3.1.0", "vue-functional-data-merge": "^3.1.0",
"vue-router": "^3.2.0", "vue-router": "^3.2.0",
......
export const appName = ""; export const appName = "";
export const downloadUrl = "http://172.16.0.113:8082";
\ No newline at end of file
...@@ -12,6 +12,8 @@ import plugins from "./plugins"; ...@@ -12,6 +12,8 @@ import plugins from "./plugins";
import * as utils from "./utils"; // import * as utils from "./utils"; //
import echarts from "./utils/echarts"; // npm install echarts --save import echarts from "./utils/echarts"; // npm install echarts --save
import * as config from "@/config";
// require("./mock"); // require("./mock");
import dayjs from "dayjs"; import dayjs from "dayjs";
...@@ -31,7 +33,7 @@ dayjs.updateLocale("zh-cn", { ...@@ -31,7 +33,7 @@ dayjs.updateLocale("zh-cn", {
"星期六", "星期六",
], ],
}); });
Vue.prototype.$config = config;
Vue.prototype.$utils = utils; Vue.prototype.$utils = utils;
Vue.prototype.$echarts = echarts; Vue.prototype.$echarts = echarts;
Vue.use(plugins); Vue.use(plugins);
......
import testCardPhoto from "@/assets/img/test-card-photo.png"; import testCardPhoto from "@/assets/img/test-card-photo.png";
import testBusiness from "@/assets/img/test-business.png"; import testBusiness from "@/assets/img/test-business.png";
export default { export default {
namespaced: true, namespaced: true,
state: { state: {
...@@ -22,6 +23,143 @@ export default { ...@@ -22,6 +23,143 @@ export default {
time: "2023-01-13", time: "2023-01-13",
}, },
], ],
enterpriseServiceData: [
{
id: 1,
theme: "关于企业变更登记(税务信息变更)“一件事”的申请",
status: "正常",
time: "2023-07-13 17:14:43",
fileName: "1公司登记(备案)申请书.doc",
file: "/assets/1公司登记(备案)申请书.doc",
},
{
id: 2,
theme: "关于公司创业担保贷款申请",
status: "准予许可",
time: "2023-04-25 15:28:36",
fileName: "2创业担保贷款申请表.png",
file: "/assets/1资产评估办事流程.png",
},
{
id: 3,
theme: "关于负责限额以下村镇建设工程的质量安全监管的申请",
status: "不予许可",
time: "2023-03-15 14:22:16",
fileName: "3村镇建设工程的质量安全监管流程.png",
file: "/assets/3村镇建设工程的质量安全监管流程.png",
},
],
serviceData: [
{
id: 1,
theme: "关于李云农药经营许可(核发) 的申请",
status: "正常",
time: "2023-07-13 17:14:43",
fileName: "1农药生产情况报告.doc",
file: "/assets/1农药生产情况报告.doc",
},
{
id: 2,
theme: "关于李云生育服务证登记的申请",
status: "准予许可",
time: "2023-04-25 15:28:36",
fileName: "2重庆市生育登记服务表.png",
file: "/assets/2重庆市生育登记服务表.png",
},
{
id: 3,
theme: "关于李云不动产登记的申请",
status: "不予许可",
time: "2023-03-15 14:22:16",
fileName: "3不动产登记申请书.doc",
file: "/assets/3不动产登记申请书.doc",
},
{
id: 4,
theme: "关于李云区县境内水路客运经营许可",
status: "准予许可",
time: "2023-02-18 14:28:15",
fileName: "4变更经营范围书面申请.doc",
file: "/assets/4变更经营范围书面申请.doc",
},
],
SpaceIndexMain: [
{
id: 1,
materialName: "申请在校求职创业补贴相关资料",
opdateTime: "2023-01-13 12:25:23",
fileName: "1创业补贴相关材料.docx",
file: "/assets/1创业补贴相关材料.docx",
},
{
id: 2,
materialName: "高等学校等毕业生接收手续办理相关资料",
opdateTime: "2023-01-08 09:23:46",
fileName: "2毕业生和其他流动人口接收手续.jpg",
file: "/assets/2毕业生和其他流动人口接收手续.jpg",
},
{
id: 3,
materialName: "受理公费师范生跨省任教申请相关资料",
opdateTime: "2023-01-07 09:15:42",
fileName: "3重庆市公费师范毕业生跨省就业申请表.doc",
file: "/assets/3重庆市公费师范毕业生跨省就业申请表.doc",
},
{
id: 4,
materialName: "档案的接收和转递的相关资料",
opdateTime: "2023-01-06 14:28:13",
fileName: "4流动人员人事档案管理登记表及托管申请或调档函.doc",
file: "/assets/4流动人员人事档案管理登记表及托管申请或调档函.doc",
},
{
id: 5,
materialName: "职业指导相关资料",
opdateTime: "2023-01-04 11:18:23",
fileName: "5职业指导.png",
file: "/assets/5职业指导.png",
},
],
enterpriseMaterials: [
{
id: 1,
materialName: "对资产评估行业的监督检查相关材料",
opdateTime: "2023-01-13 12:25:23",
fileName: "1资产评估办事流程.png",
file: "/assets/1资产评估办事流程.png",
},
{
id: 2,
materialName: "企业变更登记(税务信息变更)“一件事”的相关材料",
opdateTime: "2023-01-08 09:23:46",
fileName: "2公司登记(备案)申请书.doc",
file: "/assets/2公司登记(备案)申请书.doc",
},
{
id: 3,
materialName: "非经营性互联网信息服务备案核准相关资料",
opdateTime: "2023-01-07 09:15:42",
fileName: "3非经营性互联网信息服务备案核准 .pdf",
file: "/assets/3非经营性互联网信息服务备案核准 .pdf",
},
{
id: 4,
materialName: "区块链信息服务备案的相关资料",
opdateTime: "2023-01-06 14:28:13",
fileName: "4区块链信息服务备案.png",
file: "/assets/4区块链信息服务备案.png",
},
{
id: 5,
materialName: "互联网新技术新应用安全评估的相关资料",
opdateTime: "2023-01-04 11:18:23",
fileName: "5安全自评估报告.pdf",
file: "/assets/5安全自评估报告.pdf",
},
],
}, },
actions: { actions: {
//修改列表数据 //修改列表数据
......
...@@ -14,6 +14,7 @@ ...@@ -14,6 +14,7 @@
</template> </template>
<script> <script>
import { mapState } from "vuex";
// import * as api from "@/api"; // import * as api from "@/api";
export default { export default {
name: "enterpriseMaterialsMain", name: "enterpriseMaterialsMain",
...@@ -55,28 +56,6 @@ export default { ...@@ -55,28 +56,6 @@ export default {
placeholder: "请输入", placeholder: "请输入",
}, },
], ],
testData: [
{
materialName: "对资产评估行业的监督检查相关材料",
opdateTime: "2023-01-13 12:25:23",
},
{
materialName: "企业变更登记(税务信息变更)“一件事”的相关材料",
opdateTime: "2023-01-08 09:23:46",
},
{
materialName: "非经营性互联网信息服务备案核准相关资料",
opdateTime: "2023-01-07 09:15:42",
},
{
materialName: "区块链信息服务备案的相关资料",
opdateTime: "2023-01-06 14:28:13",
},
{
materialName: "互联网新技术新应用安全评估的相关资料",
opdateTime: "2023-01-04 11:18:23",
},
],
fetcher: async () => { fetcher: async () => {
// console.log(this); // console.log(this);
// console.log(params); // console.log(params);
...@@ -89,6 +68,13 @@ export default { ...@@ -89,6 +68,13 @@ export default {
}, },
}; };
}, },
computed: {
// import { mapState } from "vuex";
...mapState({
testData: (state) => state.tabledata.enterpriseMaterials,
}),
},
watch: {}, watch: {},
methods: { methods: {
renderBtns(e) { renderBtns(e) {
...@@ -106,8 +92,8 @@ export default { ...@@ -106,8 +92,8 @@ export default {
</div> </div>
); );
}, },
openDetail() { openDetail(row) {
this.$router.push("/enterpriseMaterials/materiaDetail"); this.$router.push(`/enterpriseMaterials/materiaDetail?id=${row.id}`);
}, },
}, },
}; };
......
...@@ -5,19 +5,20 @@ ...@@ -5,19 +5,20 @@
<div class="content-title">基础信息</div> <div class="content-title">基础信息</div>
<el-descriptions title="" :column="1" style="padding-left:30px"> <el-descriptions title="" :column="1" style="padding-left:30px">
<el-descriptions-item label="材料名称" <el-descriptions-item label="材料名称">{{
>材料名称:对资产评估行业的监督检查相关材料</el-descriptions-item detail.materialName
> }}</el-descriptions-item>
<el-descriptions-item label="上传时间" <el-descriptions-item label="上传时间">{{
>2023-01-13 12:25:23</el-descriptions-item detail.opdateTime
> }}</el-descriptions-item>
</el-descriptions> </el-descriptions>
<div class="content-title">材料文件</div> <div class="content-title">材料文件</div>
<div class="file-box flex-between"> <div class="file-box flex-between">
<span>对资产评估行业的监督检查意见表</span> <span>{{ detail.fileName }}</span>
<div class="flex download"> <div class="flex download">
<i class="el-icon-download"></i> <i class="el-icon-download"></i>
<span>下载</span> <span @click="downliadFile(detail.file)">下载</span>
</div> </div>
</div> </div>
</ScrollView> </ScrollView>
...@@ -25,6 +26,7 @@ ...@@ -25,6 +26,7 @@
</template> </template>
<script> <script>
import { mapState } from "vuex";
// import * as api from "@/api"; // import * as api from "@/api";
export default { export default {
name: "enterpriseMaterialsMateriaDetail", name: "enterpriseMaterialsMateriaDetail",
...@@ -36,10 +38,27 @@ export default { ...@@ -36,10 +38,27 @@ export default {
}, },
components: {}, components: {},
data() { data() {
return {}; return {
detail: {},
};
},
computed: {
// import { mapState } from "vuex";
...mapState({
testData: (state) => state.tabledata.enterpriseMaterials,
}),
},
mounted() {
let { id } = this.$route.query;
if (id) this.detail = this.testData.find((item) => item.id == id);
}, },
watch: {}, watch: {},
methods: {}, methods: {
downliadFile(url) {
window.open(window.location.origin + url);
},
},
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<ScrollView style="overflow-x: hidden;"> <ScrollView style="overflow-x: hidden;">
<div class="block-title"> <div class="block-title">
<div class="title">申请信息</div> <div class="title">申请信息</div>
<div class="status">状态: 准予许可</div> <div class="status">状态: {{ detail.status }}</div>
</div> </div>
<div class="content-title">基础信息</div> <div class="content-title">基础信息</div>
<el-descriptions title="" :column="2"> <el-descriptions title="" :column="2">
...@@ -16,9 +16,9 @@ ...@@ -16,9 +16,9 @@
>7cc3bc07-d86d-4701-ace..</el-descriptions-item >7cc3bc07-d86d-4701-ace..</el-descriptions-item
> >
<el-descriptions-item label="受理人员">贺正勇</el-descriptions-item> <el-descriptions-item label="受理人员">贺正勇</el-descriptions-item>
<el-descriptions-item label="事项名称" <el-descriptions-item label="事项名称">{{
>企业变更登记(税务信息变更)“一件事”</el-descriptions-item detail.theme
> }}</el-descriptions-item>
<el-descriptions-item label="申请人类型">企业</el-descriptions-item> <el-descriptions-item label="申请人类型">企业</el-descriptions-item>
...@@ -43,9 +43,9 @@ ...@@ -43,9 +43,9 @@
<el-descriptions-item label="所属机关">区税务局</el-descriptions-item> <el-descriptions-item label="所属机关">区税务局</el-descriptions-item>
<el-descriptions-item label="法定代表人">鲍哲松</el-descriptions-item> <el-descriptions-item label="法定代表人">鲍哲松</el-descriptions-item>
<el-descriptions-item label="申请时间" <el-descriptions-item label="申请时间">{{
>2020-11-25 12:14:58</el-descriptions-item detail.time
> }}</el-descriptions-item>
<el-descriptions-item label="申请人/组织机构证件类型" <el-descriptions-item label="申请人/组织机构证件类型"
>营业执照</el-descriptions-item >营业执照</el-descriptions-item
> >
...@@ -75,10 +75,10 @@ ...@@ -75,10 +75,10 @@
</el-descriptions> </el-descriptions>
<div class="content-title">申请材料表格</div> <div class="content-title">申请材料表格</div>
<div class="file-box flex-between"> <div class="file-box flex-between">
<span>企业变更登记(税务信息变更)申请表</span> <span>{{ detail.fileName }}</span>
<div class="flex download"> <div class="flex download">
<i class="el-icon-download"></i> <i class="el-icon-download"></i>
<span>下载</span> <span @click="downliadFile(detail.file)">下载</span>
</div> </div>
</div> </div>
...@@ -113,6 +113,7 @@ ...@@ -113,6 +113,7 @@
</template> </template>
<script> <script>
import { mapState } from "vuex";
// import * as api from "@/api"; // import * as api from "@/api";
export default { export default {
name: "enterpriseServiceDataDetail", name: "enterpriseServiceDataDetail",
...@@ -124,10 +125,27 @@ export default { ...@@ -124,10 +125,27 @@ export default {
}, },
components: {}, components: {},
data() { data() {
return {}; return {
detail: {},
};
},
computed: {
// import { mapState } from "vuex";
...mapState({
testData: (state) => state.tabledata.enterpriseServiceData,
}),
},
mounted() {
let { id } = this.$route.query;
if (id) this.detail = this.testData.find((item) => item.id == id);
}, },
watch: {}, watch: {},
methods: {}, methods: {
downliadFile(url) {
window.open(window.location.origin + url);
},
},
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
......
...@@ -17,22 +17,27 @@ ...@@ -17,22 +17,27 @@
<div class="flex-col flex-center"> <div class="flex-col flex-center">
<div class="qrcode-box flex-col"> <div class="qrcode-box flex-col">
<div>扫码授权办事数据</div> <div>扫码授权办事数据</div>
<img src="@/assets/img/test-qrcode.png" alt="" /> <canvas id="canvas" ref="canvas"></canvas>
<div class="btns flex-between"> <!-- <img src="@/assets/img/test-qrcode.png" alt="" /> -->
<el-button type="text">下载</el-button> <div class="btns flex-center">
<el-button type="text">负责</el-button> <el-button type="text" @click="downloadImg">下载</el-button>
</div> </div>
</div> </div>
<div class="flex flex-center"> <div class="flex flex-center">
<el-input v-model="url" size="small" style="width:281px"></el-input> <el-input v-model="url" size="small" style="width:281px"></el-input>
<el-button type="primary" size="small">复制</el-button> <el-button type="primary" size="small" ref="url" @click="copyUrl"
>复制</el-button
>
</div> </div>
</div> </div>
</PubDialog> </PubDialog>
</InnerView> </InnerView>
</template> </template>
<script> <script>
import QRCode from "qrcode";
import { saveAs } from "file-saver";
import { mapState } from "vuex";
import PubDialog from "@/components/App/PubDialog"; import PubDialog from "@/components/App/PubDialog";
export default { export default {
name: "enterpriseServiceDataList", name: "enterpriseServiceDataList",
...@@ -46,13 +51,13 @@ export default { ...@@ -46,13 +51,13 @@ export default {
components: { PubDialog }, components: { PubDialog },
data() { data() {
return { return {
url: "http//:www.baidu.com", url: "",
dialogVisible: false, dialogVisible: false,
headers: [ headers: [
{ {
field: "theme", field: "theme",
fieldName: "业务主题", fieldName: "业务主题",
width: 300, width: 350,
}, },
{ {
field: "status", field: "status",
...@@ -70,23 +75,6 @@ export default { ...@@ -70,23 +75,6 @@ export default {
}, },
], ],
params: [], params: [],
testData: [
{
theme: "关于企业变更登记(税务信息变更)“一件事”的申请",
status: "正常",
time: "2023-07-13 17:14:43",
},
{
theme: "关于公司创业担保贷款申请",
status: "准予许可",
time: "2023-04-25 15:28:36",
},
{
theme: "关于负责限额以下村镇建设工程的质量安全监管的申请",
status: "不予许可",
time: "2023-03-15 14:22:16",
},
],
fetcher: async () => { fetcher: async () => {
// console.log(this); // console.log(this);
// console.log(params); // console.log(params);
...@@ -99,6 +87,12 @@ export default { ...@@ -99,6 +87,12 @@ export default {
}, },
}; };
}, },
computed: {
// import { mapState } from "vuex";
...mapState({
testData: (state) => state.tabledata.enterpriseServiceData,
}),
},
watch: {}, watch: {},
methods: { methods: {
renderBtns(e) { renderBtns(e) {
...@@ -124,11 +118,54 @@ export default { ...@@ -124,11 +118,54 @@ export default {
</div> </div>
); );
}, },
openDtail() { openDtail(row) {
this.$router.push("/enterpriseServiceData/detail"); this.$router.push(`/enterpriseServiceData/detail?id=${row.id}`);
}, },
dataAuth() { dataAuth(row) {
let local = window.location;
let url =
local.host +
local.pathname +
"#" +
`/enterpriseServiceData/detail?id=${row.id}`;
// console.log();
this.url = url;
this.dialogVisible = true; this.dialogVisible = true;
this.$nextTick(() => {
let canvas = this.$refs.canvas;
let opts = {
errorCorrectionLevel: "H", //容错级别
type: "image/png", //生成的二维码类型
quality: 0.3, //二维码质量
margin: 0, //二维码留白边距
text: this.url, //二维码内容
color: {
dark: "#333333", //前景色
light: "#fff", //背景色
},
};
QRCode.toCanvas(canvas, this.url, opts, (err) => {
if (err) {
console.log(err);
}
});
});
},
copyUrl() {
const dom = document.createElement("input");
dom.value = this.url;
document.body.appendChild(dom);
dom.select();
document.execCommand("copy");
document.body.removeChild(dom);
this.$message.success("复制成功");
},
downloadImg() {
let canvas = this.$refs.canvas;
canvas.toBlob((blob) => {
saveAs(blob, "image.png");
});
}, },
}, },
}; };
...@@ -150,9 +187,10 @@ export default { ...@@ -150,9 +187,10 @@ export default {
padding-top: 31px; padding-top: 31px;
align-items: center; align-items: center;
margin-bottom: 28px; margin-bottom: 28px;
img { img,
width: 138px; canvas {
height: 141px; width: 138px !important;
height: 141px !important;
margin-top: 10px; margin-top: 10px;
margin-bottom: 3px; margin-bottom: 3px;
} }
......
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<div> <div>
为了给您提供更好的服务,我们希望收集您在使用平台时的意见或者建议。 为了给您提供更好的服务,我们希望收集您在使用平台时的意见或者建议。
</div> </div>
<div>对您的配合和支持表示衷心感谢!新增证照</div> <div>对您的配合和支持表示衷心感谢!</div>
</div> </div>
<el-form <el-form
ref="form" ref="form"
......
...@@ -124,14 +124,14 @@ export default { ...@@ -124,14 +124,14 @@ export default {
if (["liyun", "user"].includes(this.ruleForm.user)) { if (["liyun", "user"].includes(this.ruleForm.user)) {
this.$store.dispatch("user/setUserAuth", this.testAuthUser); this.$store.dispatch("user/setUserAuth", this.testAuthUser);
this.$store.dispatch("user/setUserInfo", { this.$store.dispatch("user/setUserInfo", {
name: "", name: "",
type: 1, type: 1,
}); });
localStorage.setItem("userAuth", JSON.stringify(this.testAuthUser)); localStorage.setItem("userAuth", JSON.stringify(this.testAuthUser));
localStorage.setItem( localStorage.setItem(
"userInfo", "userInfo",
JSON.stringify({ JSON.stringify({
name: "", name: "",
type: 1, type: 1,
}) })
); );
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<ScrollView style="overflow-x: hidden;"> <ScrollView style="overflow-x: hidden;">
<div class="block-title"> <div class="block-title">
<div class="title">申请信息</div> <div class="title">申请信息</div>
<div class="status">状态: 准予许可</div> <div class="status">状态: {{ detail.status }}</div>
</div> </div>
<div class="content-title">基础信息</div> <div class="content-title">基础信息</div>
<el-descriptions title="" :column="2"> <el-descriptions title="" :column="2">
...@@ -16,9 +16,9 @@ ...@@ -16,9 +16,9 @@
>7cc3bc07-d86d-4701-ace..</el-descriptions-item >7cc3bc07-d86d-4701-ace..</el-descriptions-item
> >
<el-descriptions-item label="受理人员">贺正勇</el-descriptions-item> <el-descriptions-item label="受理人员">贺正勇</el-descriptions-item>
<el-descriptions-item label="事项名称" <el-descriptions-item label="事项名称">{{
>农药经营许可(核发)</el-descriptions-item detail.theme
> }}</el-descriptions-item>
<el-descriptions-item label="申请人类型">自然人</el-descriptions-item> <el-descriptions-item label="申请人类型">自然人</el-descriptions-item>
<el-descriptions-item label="类型">XK(行政许可)</el-descriptions-item> <el-descriptions-item label="类型">XK(行政许可)</el-descriptions-item>
...@@ -42,9 +42,9 @@ ...@@ -42,9 +42,9 @@
> >
<el-descriptions-item label="法定代表人">——</el-descriptions-item> <el-descriptions-item label="法定代表人">——</el-descriptions-item>
<el-descriptions-item label="申请时间" <el-descriptions-item label="申请时间">{{
>2020-11-25 12:14:58</el-descriptions-item detail.time
> }}</el-descriptions-item>
<el-descriptions-item label="申请人/组织机构证件类型" <el-descriptions-item label="申请人/组织机构证件类型"
>身份证</el-descriptions-item >身份证</el-descriptions-item
> >
...@@ -67,15 +67,15 @@ ...@@ -67,15 +67,15 @@
> >
<el-descriptions-item label="业务主题" <el-descriptions-item label="业务主题"
>关于李荣辉农药经营许可(核发) 的申请</el-descriptions-item >关于李农药经营许可(核发) 的申请</el-descriptions-item
> >
</el-descriptions> </el-descriptions>
<div class="content-title">申请材料表格</div> <div class="content-title">申请材料表格</div>
<div class="file-box flex-between"> <div class="file-box flex-between">
<span>申请在校求职创业补贴相关资料</span> <span>{{ detail.fileName }}</span>
<div class="flex download"> <div class="flex download">
<i class="el-icon-download"></i> <i class="el-icon-download"></i>
<span>下载</span> <span @click="downliadFile(detail.file)">下载</span>
</div> </div>
</div> </div>
...@@ -110,6 +110,7 @@ ...@@ -110,6 +110,7 @@
</template> </template>
<script> <script>
import { mapState } from "vuex";
// import * as api from "@/api"; // import * as api from "@/api";
export default { export default {
name: "serviceDataDetail", name: "serviceDataDetail",
...@@ -121,10 +122,28 @@ export default { ...@@ -121,10 +122,28 @@ export default {
}, },
components: {}, components: {},
data() { data() {
return {}; return {
detail: {},
};
},
computed: {
// import { mapState } from "vuex";
...mapState({
testData: (state) => state.tabledata.serviceData,
}),
},
mounted() {
let { id } = this.$route.query;
if (id) this.detail = this.testData.find((item) => item.id == id);
}, },
watch: {}, watch: {},
methods: {}, methods: {
downliadFile(url) {
window.open(window.location.origin + url);
},
},
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
......
...@@ -17,22 +17,27 @@ ...@@ -17,22 +17,27 @@
<div class="flex-col flex-center"> <div class="flex-col flex-center">
<div class="qrcode-box flex-col"> <div class="qrcode-box flex-col">
<div>扫码授权办事数据</div> <div>扫码授权办事数据</div>
<img src="@/assets/img/test-qrcode.png" alt="" /> <canvas id="canvas" ref="canvas"></canvas>
<div class="btns flex-between"> <!-- <img src="@/assets/img/test-qrcode.png" alt="" /> -->
<el-button type="text">下载</el-button> <div class="btns flex-center">
<el-button type="text">负责</el-button> <el-button type="text" @click="downloadImg">下载</el-button>
</div> </div>
</div> </div>
<div class="flex flex-center"> <div class="flex flex-center">
<el-input v-model="url" size="small" style="width:281px"></el-input> <el-input v-model="url" size="small" style="width:281px"></el-input>
<el-button type="primary" size="small">复制</el-button> <el-button type="primary" size="small" ref="url" @click="copyUrl"
>复制</el-button
>
</div> </div>
</div> </div>
</PubDialog> </PubDialog>
</InnerView> </InnerView>
</template> </template>
<script> <script>
import QRCode from "qrcode";
import { saveAs } from "file-saver";
import { mapState } from "vuex";
import PubDialog from "@/components/App/PubDialog"; import PubDialog from "@/components/App/PubDialog";
export default { export default {
name: "serviceDataList", name: "serviceDataList",
...@@ -46,13 +51,13 @@ export default { ...@@ -46,13 +51,13 @@ export default {
components: { PubDialog }, components: { PubDialog },
data() { data() {
return { return {
url: "http//:www.baidu.com", url: "",
dialogVisible: false, dialogVisible: false,
headers: [ headers: [
{ {
field: "theme", field: "theme",
fieldName: "业务主题", fieldName: "业务主题",
width: 300, width: 350,
}, },
{ {
field: "status", field: "status",
...@@ -70,33 +75,6 @@ export default { ...@@ -70,33 +75,6 @@ export default {
}, },
], ],
params: [], params: [],
testData: [
{
theme: "关于李云农药经营许可(核发) 的申请",
status: "正常",
time: "2023-07-13 17:14:43",
},
{
theme: "关于李云生育服务证登记的申请",
status: "准予许可",
time: "2023-04-25 15:28:36",
},
{
theme: "关于李云不动产登记的申请",
status: "不予许可",
time: "2023-03-15 14:22:16",
},
{
theme: "关于李云区县境内水路客运经营许可",
status: "准予许可",
time: "2023-02-18 14:28:15",
},
{
theme: "关于李云采许可证颁发的申请",
status: "准予许可",
time: "2023-02-14 12:22:33",
},
],
fetcher: async () => { fetcher: async () => {
// console.log(this); // console.log(this);
// console.log(params); // console.log(params);
...@@ -109,6 +87,12 @@ export default { ...@@ -109,6 +87,12 @@ export default {
}, },
}; };
}, },
computed: {
// import { mapState } from "vuex";
...mapState({
testData: (state) => state.tabledata.serviceData,
}),
},
watch: {}, watch: {},
methods: { methods: {
renderBtns(e) { renderBtns(e) {
...@@ -134,11 +118,51 @@ export default { ...@@ -134,11 +118,51 @@ export default {
</div> </div>
); );
}, },
openDtail() { openDtail(row) {
this.$router.push("/serviceData/detail"); this.$router.push(`/serviceData/detail?id=${row.id}`);
}, },
dataAuth() { dataAuth(row) {
let local = window.location;
let url =
local.host + local.pathname + "#" + `/serviceData/detail?id=${row.id}`;
// console.log();
this.url = url;
this.dialogVisible = true; this.dialogVisible = true;
this.$nextTick(() => {
let canvas = this.$refs.canvas;
let opts = {
errorCorrectionLevel: "H", //容错级别
type: "image/png", //生成的二维码类型
quality: 0.3, //二维码质量
margin: 0, //二维码留白边距
text: this.url, //二维码内容
color: {
dark: "#333333", //前景色
light: "#fff", //背景色
},
};
QRCode.toCanvas(canvas, this.url, opts, (err) => {
if (err) {
console.log(err);
}
});
});
},
copyUrl() {
const dom = document.createElement("input");
dom.value = this.url;
document.body.appendChild(dom);
dom.select();
document.execCommand("copy");
document.body.removeChild(dom);
this.$message.success("复制成功");
},
downloadImg() {
let canvas = this.$refs.canvas;
canvas.toBlob((blob) => {
saveAs(blob, "image.png");
});
}, },
}, },
}; };
...@@ -160,9 +184,10 @@ export default { ...@@ -160,9 +184,10 @@ export default {
padding-top: 31px; padding-top: 31px;
align-items: center; align-items: center;
margin-bottom: 28px; margin-bottom: 28px;
img { img,
width: 138px; canvas {
height: 141px; width: 138px !important;
height: 141px !important;
margin-top: 10px; margin-top: 10px;
margin-bottom: 3px; margin-bottom: 3px;
} }
......
...@@ -50,6 +50,7 @@ ...@@ -50,6 +50,7 @@
</template> </template>
<script> <script>
import { mapState } from "vuex";
// import * as api from "@/api"; // import * as api from "@/api";
export default { export default {
name: "SpaceIndexMain", name: "SpaceIndexMain",
...@@ -92,28 +93,6 @@ export default { ...@@ -92,28 +93,6 @@ export default {
placeholder: "请输入", placeholder: "请输入",
}, },
], ],
testData: [
{
materialName: "申请在校求职创业补贴相关资料",
opdateTime: "2023-01-13 12:25:23",
},
{
materialName: "高等学校等毕业生接收手续办理相关资料",
opdateTime: "2023-01-08 09:23:46",
},
{
materialName: "受理公费师范生跨省任教申请相关资料",
opdateTime: "2023-01-07 09:15:42",
},
{
materialName: "档案的接收和转递的相关资料",
opdateTime: "2023-01-06 14:28:13",
},
{
materialName: "职业指导相关资料",
opdateTime: "2023-01-04 11:18:23",
},
],
fetcher: async () => { fetcher: async () => {
// console.log(this); // console.log(this);
// console.log(params); // console.log(params);
...@@ -126,6 +105,13 @@ export default { ...@@ -126,6 +105,13 @@ export default {
}, },
}; };
}, },
computed: {
// import { mapState } from "vuex";
...mapState({
testData: (state) => state.tabledata.SpaceIndexMain,
}),
},
watch: {}, watch: {},
methods: { methods: {
renderBtns(e) { renderBtns(e) {
...@@ -143,8 +129,8 @@ export default { ...@@ -143,8 +129,8 @@ export default {
</div> </div>
); );
}, },
openDetail() { openDetail(row) {
this.$router.push("/spaceIndex/materiaDetail"); this.$router.push(`/spaceIndex/materiaDetail?id=${row.id}`);
}, },
handleSelect(index) { handleSelect(index) {
// console.log(index); // console.log(index);
......
...@@ -5,19 +5,20 @@ ...@@ -5,19 +5,20 @@
<div class="content-title">基础信息</div> <div class="content-title">基础信息</div>
<el-descriptions title="" :column="1" style="padding-left:30px"> <el-descriptions title="" :column="1" style="padding-left:30px">
<el-descriptions-item label="材料名称" <el-descriptions-item label="材料名称">{{
>申请在校求职创业补贴相关资料</el-descriptions-item detail.materialName
> }}</el-descriptions-item>
<el-descriptions-item label="上传时间" <el-descriptions-item label="上传时间">{{
>2023-01-13 12:25:23</el-descriptions-item detail.opdateTime
> }}</el-descriptions-item>
</el-descriptions> </el-descriptions>
<div class="content-title">材料文件</div> <div class="content-title">材料文件</div>
<div class="file-box flex-between"> <div class="file-box flex-between">
<span>申请在校求职创业补贴相关资料</span> <span>{{ detail.fileName }}</span>
<div class="flex download"> <div class="flex download">
<i class="el-icon-download"></i> <i class="el-icon-download"></i>
<span>下载</span> <span @click="downliadFile(detail.file)">下载</span>
</div> </div>
</div> </div>
</ScrollView> </ScrollView>
...@@ -25,6 +26,7 @@ ...@@ -25,6 +26,7 @@
</template> </template>
<script> <script>
import { mapState } from "vuex";
// import * as api from "@/api"; // import * as api from "@/api";
export default { export default {
name: "SpaceIndexMateriaDetail", name: "SpaceIndexMateriaDetail",
...@@ -36,10 +38,27 @@ export default { ...@@ -36,10 +38,27 @@ export default {
}, },
components: {}, components: {},
data() { data() {
return {}; return {
detail: {},
};
},
computed: {
// import { mapState } from "vuex";
...mapState({
testData: (state) => state.tabledata.SpaceIndexMain,
}),
},
mounted() {
let { id } = this.$route.query;
if (id) this.detail = this.testData.find((item) => item.id == id);
}, },
watch: {}, watch: {},
methods: {}, methods: {
downliadFile(url) {
window.open(window.location.origin + url);
},
},
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
......
module.exports = {
// 入口文件
entry: "./src/main.js",
output: {
// path: path.resolve(__dirname, "dist"),
// filename: "bundle.js",
},
module: {
rules: [
{
test: /\.vue$/,
loader: "vue-loader",
},
{
test: /\.css$/,
use: ["style-loader", "css-loader"],
},
{
test: /\.(jpg|png|svg|ttf)$/,
use: "url-loader",
},
{
test: /\.(docx|doc|pdf)$/,
use: "url-loader",
},
],
},
};
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