合并

src/views/service/detail/achievements.vue

@@ -1,19 +1,102 @@
 <template>
-  <div id="achievements">
-    <p>achievements</p>
+  <div id="detail" style="background-color: #F5F5F54f;">
+    <div class="w_0100">
+      <div class="w_1200">
+        <div class="detailmain">
+          <el-col class="title" :span="24"> {{ detail.title }}</el-col>
+
+          <el-col :span="24" class="info">
+            <p><span>简介:</span>{{ detail.desc }}</p>
+            <p><span>描述:</span>{{ detail.miaoshu }}</p></el-col
+          >
+          <el-col :span="24" class="context">
+            <el-button plain style="cursor: default;">确认绩效评价对象</el-button><i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">下发通知书</el-button> <i class="el-icon-right"></i
+            ><el-button plain style="cursor: default;">提交绩效评价数据</el-button> <i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">绩效评价审核结果</el-button>
+            <i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">绩效评价结果上报相关部门</el-button>
+            <i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">绩效评价结果运用</el-button>
+          </el-col>
+        </div>
+      </div>
+    </div>
   </div>
 </template>
 
 <script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+
 export default {
-  name: 'achievements',
-  props: {},
+  name: 'detail',
+  props: {
+    newsid: null,
+  },
   components: {},
-  data: () => ({}),
+  data: () => {
+    return {
+      detail: {
+        title: '绩效评价',
+        desc:
+          '绩效评价是指运用一定的评价方法、量化指标及评价标准，对中央部门为实现其职能所确定的绩效目标的实现程度，及为实现这一目标所安排预算的执行结果所进行的综合性评价。绩效评价的过程就是将员工的收集工作绩效同要求其达到的工作绩效标准进行比对的过程。',
+
+        miaoshu:
+          '1、对员工的晋升、降职、调职和离职提供依据；2、组织对员工的绩效考评的反馈；3、对员工和团队对组织的贡献进行评估；4、 对员工的薪酬决策提供依据；5、 对招聘选择和工作分配的决策进行评估；6、了解员工和团队的培训和教育的需要；7、 对培训和员工职业生涯规划效果的评估；8、 对工作计划、预算评估和人力资源规划提供信息。',
+      },
+
+      img: {
+        top_bg: require('@/assets/live/top_bg.png'),
+        logo: require('@/assets/live/logo.png'),
+        img1: require('@/assets/live/1.jpg'),
+      },
+
+      detailinfo: {},
+    };
+  },
   created() {},
-  computed: {},
   methods: {},
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
 };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+@import '~@/style/style.css';
+.w_1200 {
+  width: 95%;
+  margin: 0 auto;
+}
+.detailmain {
+  min-height: 500px;
+}
+
+.detailmain .title {
+  color: #215199;
+  font-size: 18px;
+  text-align: center;
+  font-weight: bold;
+  font-size: 25px;
+}
+.detailmain .info p {
+  padding: 10px 0 10px 0;
+  font-size: 20px;
+}
+
+.detailmain .info p span {
+  color: #000000;
+  font-weight: bold;
+}
+.context {
+  // text-align: center;
+  padding: 20px 0 20px 0;
+  font-size: 18px;
+}
+</style>

src/views/service/detail/assessment.vue

@@ -1,19 +1,102 @@
 <template>
-  <div id="assessment">
-    <p>assessment</p>
+  <div id="detail" style="background-color: #F5F5F54f;">
+    <div class="w_0100">
+      <div class="w_1200">
+        <div class="detailmain">
+          <el-col class="title" :span="24"> {{ detail.title }}</el-col>
+
+          <el-col :span="24" class="info">
+            <p><span>简介:</span>{{ detail.desc }}</p>
+            <p><span>描述:</span>{{ detail.miaoshu }}</p></el-col
+          >
+          <el-col :span="24" class="context">
+            <el-button plain style="cursor: default;">接受评估任务</el-button><i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">制定评估方案</el-button> <i class="el-icon-right"></i
+            ><el-button plain style="cursor: default;">签订评估合同</el-button> <i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">采集评估信息并综合分析，开展评估活动</el-button>
+            <i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">提交评估报告</el-button>
+            <i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">行业审核和备案</el-button>
+          </el-col>
+        </div>
+      </div>
+    </div>
   </div>
 </template>
 
 <script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+
 export default {
-  name: 'assessment',
-  props: {},
+  name: 'detail',
+  props: {
+    newsid: null,
+  },
   components: {},
-  data: () => ({}),
+  data: () => {
+    return {
+      detail: {
+        title: '科技评估',
+        desc:
+          '科技评估，是指由科技评估机构（以下简称评估机构）根据委托方明确的目的，遵循一定的原则、程序和标准，运用科学、可行的方法对科技政策、科技计划、科技项目、科技成果、科技发展领域、科技机构、科技人员以及与科技活动有关的行为所进行的专业化咨询和评判活动。',
+
+        miaoshu:
+          '综述了国外科技评估活动的发展状况、科技评估的发展特点、我国科技评估的发展现状,介绍了科技评估的概念、范畴与分类,我国科技评估体系的基本框架,及科技评估机构应具备的条件,分析了科技评估在科技决策与科技管理中的作用,及政府在科技评估管理中的地位与作用',
+      },
+
+      img: {
+        top_bg: require('@/assets/live/top_bg.png'),
+        logo: require('@/assets/live/logo.png'),
+        img1: require('@/assets/live/1.jpg'),
+      },
+
+      detailinfo: {},
+    };
+  },
   created() {},
-  computed: {},
   methods: {},
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
 };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+@import '~@/style/style.css';
+.w_1200 {
+  width: 95%;
+  margin: 0 auto;
+}
+.detailmain {
+  min-height: 500px;
+}
+
+.detailmain .title {
+  color: #215199;
+  font-size: 18px;
+  text-align: center;
+  font-weight: bold;
+  font-size: 25px;
+}
+.detailmain .info p {
+  padding: 10px 0 10px 0;
+  font-size: 20px;
+}
+
+.detailmain .info p span {
+  color: #000000;
+  font-weight: bold;
+}
+.context {
+  // text-align: center;
+  padding: 20px 0 20px 0;
+  font-size: 20px;
+}
+</style>

src/views/service/detail/contract.vue

@@ -1,19 +1,103 @@
 <template>
-  <div id="contract">
-    <p>contract</p>
+  <div id="detail" style="background-color: #F5F5F54f;">
+    <div class="w_0100">
+      <div class="w_1200">
+        <div class="detailmain">
+          <el-col class="title" :span="24"> {{ detail.title }}</el-col>
+
+          <el-col :span="24" class="info">
+            <p><span>简介:</span>{{ detail.desc }}</p>
+            <p><span>描述:</span>{{ detail.miaoshu }}</p></el-col
+          >
+          <el-col :span="24" class="context">
+            <el-button plain style="cursor: default;">合同谈判发起</el-button><i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">合同谈判</el-button> <i class="el-icon-right"></i
+            ><el-button plain style="cursor: default;">电子合同二次确认</el-button> <i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">电子合同的电子签名</el-button>
+            <i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">电子合同辅助认证</el-button>
+            <i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">电子合同备注保存</el-button>
+            <i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">电子合同生效，法律适用</el-button>
+          </el-col>
+        </div>
+      </div>
+    </div>
   </div>
 </template>
 
 <script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+
 export default {
-  name: 'contract',
-  props: {},
+  name: 'detail',
+  props: {
+    newsid: null,
+  },
   components: {},
-  data: () => ({}),
+  data: () => {
+    return {
+      detail: {
+        title: '合同在线',
+        desc: '在线服务合同是指网络运营商通过网络为用户提供有偿或无偿服务合同。',
+
+        miaoshu:
+          '第一，合同的标的是某种服务，而且这种服务只能以网络为载体才能提供。这就使得在线服务合同与以提供服务为标的的电子商务合同不同，因为在这种电子商务合同中，网络只是改变了合同订立的方式，服务的提供不能通过网络进行。第二，这种合同既可以是有偿的，也可以是无偿的。有偿的如网络游戏合同，无偿的如几大门户网站提供的免费电子邮件服务。',
+      },
+
+      img: {
+        top_bg: require('@/assets/live/top_bg.png'),
+        logo: require('@/assets/live/logo.png'),
+        img1: require('@/assets/live/1.jpg'),
+      },
+
+      detailinfo: {},
+    };
+  },
   created() {},
-  computed: {},
   methods: {},
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
 };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+@import '~@/style/style.css';
+.w_1200 {
+  width: 95%;
+  margin: 0 auto;
+}
+.detailmain {
+  min-height: 500px;
+}
+
+.detailmain .title {
+  color: #215199;
+  font-size: 18px;
+  text-align: center;
+  font-weight: bold;
+  font-size: 25px;
+}
+.detailmain .info p {
+  padding: 10px 0 10px 0;
+  font-size: 20px;
+}
+
+.detailmain .info p span {
+  color: #000000;
+  font-weight: bold;
+}
+.context {
+  // text-align: center;
+  padding: 20px 0 20px 0;
+  font-size: 20px;
+}
+</style>

src/views/service/detail/credit.vue

@@ -1,19 +1,101 @@
 <template>
-  <div id="credit">
-    <p>credit</p>
+  <div id="detail" style="background-color: #F5F5F54f;">
+    <div class="w_0100">
+      <div class="w_1200">
+        <div class="detailmain">
+          <el-col class="title" :span="24"> {{ detail.title }}</el-col>
+
+          <el-col :span="24" class="info">
+            <p><span>简介:</span>{{ detail.desc }}</p>
+            <p><span>描述:</span>{{ detail.miaoshu }}</p></el-col
+          >
+          <el-col :span="24" class="context">
+            <el-button plain style="cursor: default;">申请CCECS认证的程序</el-button><i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">由企业提出申请</el-button> <i class="el-icon-right"></i
+            ><el-button plain style="cursor: default;">企业提供相关资质证书、文件</el-button> <i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">进行企业信用评审</el-button><i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">发放符合性证书</el-button> <i class="el-icon-right"></i
+            ><el-button plain style="cursor: default;">企业签发合格声明</el-button> <i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">由企业在产品上贴附CCECS标记</el-button><i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">证书颁发及使用</el-button>
+          </el-col>
+        </div>
+      </div>
+    </div>
   </div>
 </template>
 
 <script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+
 export default {
-  name: 'credit',
-  props: {},
+  name: 'detail',
+  props: {
+    newsid: null,
+  },
   components: {},
-  data: () => ({}),
+  data: () => {
+    return {
+      detail: {
+        title: '信用认证',
+        desc:
+          '信用认证，是指认证机构对“被认证公司是否合法存在”的认证以及“认证申请人是否属于被认证公司”的查证。通常指某些协会或信用评价机构对申请认证的各类企事业单位、政府及其他组织的信用情况是否符合某种信用监督体系信用标准的信用评定活动。',
+
+        miaoshu:
+          '通常来讲都是以官方为背景的平台为企业和其他事业单位和个人提供的独立的第三方查询系统！这些机构有政府背景但同时又是市场化运作的！就类似毕业证查询网站等等！',
+      },
+
+      img: {
+        top_bg: require('@/assets/live/top_bg.png'),
+        logo: require('@/assets/live/logo.png'),
+        img1: require('@/assets/live/1.jpg'),
+      },
+
+      detailinfo: {},
+    };
+  },
   created() {},
-  computed: {},
   methods: {},
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
 };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+@import '~@/style/style.css';
+.w_1200 {
+  width: 95%;
+  margin: 0 auto;
+}
+.detailmain {
+  min-height: 500px;
+}
+
+.detailmain .title {
+  color: #215199;
+  font-size: 18px;
+  text-align: center;
+  font-weight: bold;
+  font-size: 25px;
+}
+.detailmain .info p {
+  padding: 10px 0 10px 0;
+  font-size: 20px;
+}
+
+.detailmain .info p span {
+  color: #000000;
+  font-weight: bold;
+}
+.context {
+  padding: 20px 0 20px 0;
+  font-size: 20px;
+}
+</style>

src/views/service/detail/exhibition.vue

@@ -1,19 +1,97 @@
 <template>
-  <div id="exhibition">
-    <p>exhibition</p>
+  <div id="detail" style="background-color: #F5F5F54f;">
+    <div class="w_0100">
+      <div class="w_1200">
+        <div class="detailmain">
+          <el-col class="title" :span="24"> {{ detail.title }}</el-col>
+
+          <el-col :span="24" class="info">
+            <p><span>简介:</span>{{ detail.desc }}</p>
+            <p><span>描述:</span>{{ detail.miaoshu }}</p></el-col
+          >
+          <el-col :span="24" class="context">
+            <el-button plain style="cursor: default;">注册登录</el-button><i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">提交申请办展资料</el-button> <i class="el-icon-right"></i
+            ><el-button plain style="cursor: default;">确认需求</el-button> <i class="el-icon-right"></i>
+            <el-button plain style="cursor: default;">展会宣传</el-button>
+          </el-col>
+        </div>
+      </div>
+    </div>
   </div>
 </template>
 
 <script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+
 export default {
-  name: 'exhibition',
-  props: {},
+  name: 'detail',
+  props: {
+    newsid: null,
+  },
   components: {},
-  data: () => ({}),
+  data: () => {
+    return {
+      detail: {
+        title: '展会管理',
+        desc: '本届展会会将集中展示包括科技超市、动态监测、直播大厅、技术培训、实现对接等代表信息产业的核心内容,主打造一流创新服务平台。',
+
+        miaoshu:
+          '展会众多业内人士齐聚直播大厅现场进行业务洽谈、产品展示、以及行业经验的交流。展会邀请各种行业的企业进行参加,促进行业交流，内外交流，横向交流，促进商业发展',
+      },
+
+      img: {
+        top_bg: require('@/assets/live/top_bg.png'),
+        logo: require('@/assets/live/logo.png'),
+        img1: require('@/assets/live/1.jpg'),
+      },
+
+      detailinfo: {},
+    };
+  },
   created() {},
-  computed: {},
   methods: {},
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
 };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+@import '~@/style/style.css';
+.w_1200 {
+  width: 95%;
+  margin: 0 auto;
+}
+.detailmain {
+  min-height: 500px;
+}
+
+.detailmain .title {
+  color: #215199;
+  font-size: 18px;
+  text-align: center;
+  font-weight: bold;
+  font-size: 25px;
+}
+.detailmain .info p {
+  padding: 10px 0 10px 0;
+  font-size: 20px;
+}
+
+.detailmain .info p span {
+  color: #000000;
+  font-weight: bold;
+}
+.context {
+  text-align: center;
+  padding: 20px 0 20px 0;
+  font-size: 20px;
+}
+</style>