<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta name="viewport"
	content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" ">
<title id="needhtml5">创知厚德知产在线</title>
<link rel="stylesheet" href="/css/ele/chalk.css">
<link rel="stylesheet" href="/css/main.css">
<link rel="stylesheet" href="/css/fontawesome/css/font-awesome.min.css">
<link rel="stylesheet" href="/css/autocomplete.css">
<script src="/js/vue/vue.min.js"></script>
<script src="/js/ele/index.js"></script>

<style>
li.el-carousel__indicators{
	marin:0 auto
}
</style>
</head>
<body style="overflow:auto">
  <div id="app" style="visibility:hidden;">
		<div style="height:40px;background-color:#202326">
	  	<div style="width:100%;margin:0 auto;">
				<div style="color:white;padding:7px 20px;font-size:16px;font-weight:bold;float:left">创知厚德知产在线</div>
				<div style="float:left;">
					<el-button type="text" style="color:#2692FF;font-size:14px;cursor:pointer;font-family:Microsoft YaHei" @click="firstPage">首页</el-button>
				  <el-button type="text" style="color:white;font-size:14px;margin-left:20px;cursor:pointer;font-family:Microsoft YaHei" @click="secondPage">服务项目</el-button>
			  </div>
	  </div>
    <div style="clear:both;"></div>

		<!-- 轮播图设置 -->
		<div style="width:100%;height:490px;background-color:#011939;margin-top:0px">
			<div style="height:490px;margin:0 auto;">
				<el-carousel height="490px" >
		      <el-carousel-item v-for="item in scrollpicture" :key="item">
		        <img style="width:1920px;height:490px;margin:0 auto;" :src="item.url" />
		      </el-carousel-item>
		    </el-carousel>
			</div>
		</div>


		<div style="width:1200px;margin:30px auto;background-color:#FFFFFF;">
			<div style="text-align:center;color:#2692FF;font-size:23px;font-weight:bold;font-family:MicrosoftYaHei-Bold;">创知厚德——专业的知识产权服务平台</div>
		</div>

		<div v-for="(item,index) in datalist" style="width:1200px;margin:30px auto;">
			<div style="width:1200px">
			  <div style="width:480px;height:1px;border-top:solid #E1E1E1 1px;float:left;margin-top:15px"></div>
			  <div style="width:240px;float:left;font-size:24px;color:#2F2F2F;text-align:center;font-weight:600;font-family:Microsoft YaHei">{{item.itemTypeName}}服务</div>
			  <div style="width:480px;height:1px;border-top:solid #E1E1E1 1px;float:left;margin-top:15px"></div>
		  </div>
			<div style="clear:both"></div>

			<div style="width:1200px;margin-bottom:50px">
				<el-card  v-for="it in item.productList" style="width:391px;height:400px;float:left;margin:30px 3px">
					<div style="width:140px;height:120px;margin:0 auto">
						<img :src="it.mobilePic" style="width:100%;height:100%"></img>
					</div>
					<div style="width:80%;margin-left:10%;text-align:center;font-size:24px;margin-top:10px;color:#2F2F2F;font-weight:400;font-family:Microsoft YaHei">{{it.name}}</div>
					<div style="width:80%;height:90px;margin-left:10%;color:#828282;font-size:16px;font-weight:400px;margin-top:12px;font-family:Microsoft YaHei">{{it.shortDesc}}</div>
          <div style="width:80%;margin-left:10%;text-align:center;font-size:18px;font-weight:600;color:#FF394D;font-family:Microsoft YaHei;margin-bottom:20px">¥{{it.guidePrice}}/件</div>
					<div style="width:80%;margin-left:10%;text-align:center">
						<el-button type="primary" style="border-radius:2px;width:160px;font-family:Microsoft YaHei" @click="showneed(it.name,it.code)">立即咨询</el-button>
					</div>
				</el-card>

        <div style="clear:both"></div>
				<div style="width:1200px;text-align:center">
					<el-button plain style="width:180px;font-family:Microsoft YaHei" @click="more(item.itemType)">更多服务</el-button>
				</div>
			</div>

		</div>
		<div style="clear:both"></div>
		<div style="width:100%;background-color:#202326;height:200px">
			<div style="width:1200px;margin:0 auto;height:160px;padding-top:40px">
        <div style="width:1200px;text-align:left;color:#FFFFFF;font-size:16px;font-weight:400;font-family:Microsoft YaHei">特约知识产权服务提供商：创知厚德（北京）科技有限公司</div>
				<div style="width:1200px;margin-top:20px">
					<div style="float:left;font-size:14px;font-weight:400;color:#B2B2B2;font-family:Microsoft YaHei">客服电话：4006-798-9999</div>
					<div style="float:left;margin-left:30px;font-size:14px;font-weight:400;color:#B2B2B2;font-family:Microsoft YaHei">邮箱：czhd_ip@gongsibao.com</div>
				</div>
				<div style="clear:both"></div>
			  <div style="width:1200px;text-align:left;color:#B2B2B2;font-size:14px;font-weight:400;margin-top:20px;font-family:Microsoft YaHei">地址：北京市朝阳区朝来高科技产业园10号楼102号</div>
			</div>
		</div>

		<el-dialog title="提交需求" :visible.sync="dialogFormVisible" center width="600px" >
			<el-form :model="form" ref="form" :rules="rules" style="margin-left:40px">
				<div style="color:#606266;font-size:14px;font-weight:400;line-height:12px;margin-bottom:30px;margin-left:12px">服务需求：{{serviceName}}</div>
				<el-form-item label="您的名字：" prop="name">
          <el-input v-model="form.name" autocomplete="off" placeholder="请输入您的名字" style="width:360px"></el-input>
        </el-form-item>
				<el-form-item label="联系方式：" prop="mobile">
          <el-input v-model="form.mobile" autocomplete="off" placeholder="请输入您的电话" style="width:360px"></el-input>
        </el-form-item>
				<el-form-item label="所属城市：" prop="city" >
					<el-cascader style="width:360px"
						expand-trigger="hover"
						:options="bigtype"
						v-model="form.city" placeholder="请选择所属城市">
					</el-cascader>
        </el-form-item>
				<el-form-item label="需求详情：" prop="notes" style="margin-left:12px">
          <el-input v-model="form.notes" type="textarea" :rows="3" autocomplete="off" placeholder="请输入您的详细内容" style="width:360px"></el-input>
        </el-form-item>
				<el-form-item >
					<div style="width:100%;font-size:12px;color:#B2B2B2;margin-left:12px;font-family:Microsoft YaHei">
						<i class="el-icon-info"></i>
						提交需求后，我们专业代理人会及时与您联系，为您服务，请保持电话畅通。
				  </div>
				</el-form-item >
				<el-form-item >
					<div style="width:100%;text-align:center;font-family:Microsoft YaHei">
						<el-button type="primary" @click="submitneed">提交</el-button>
		        <el-button @click="dialogFormVisible=false">取消</el-button>
					</div>
	      </el-form-item>
			</el-form>
		</el-dialog>



  </div>
	<script src="/js/vue/jquery.min.js"></script>
  <script src="/js/vue/axios.min.js"></script>
  <script src="/js/PCneedhtml5.js"></script>
</body>
</html>
